Die Webseite www.dilber-restaurant.at war ein Teil meiner Diplomarbeit im Jahr 2012.
Als Teil dieses Projekts habe ich die Webseite von Grund auf neu entwickelt, einschließlich des Logos, des Layouts, der Grafiken sowie des HTML- und CSS-Codes. Hierbei habe ich bewusst auf die Verwendung von vorgefertigten Templates und Vorlagen verzichtet, um ein einzigartiges und individuelles Design zu schaffen.
Die Webseite ist nicht mehr online, man kann eine Vorabversion unter dem folgenden Link betrachten: https://dilber.altan.at/Dilber-Restaurant/
Layout: Das Layout der Webseite ist in Form einer Tulpe gestaltet und wurde an das Logo des Restaurants angelehnt, um eine konsistente visuelle Identität zu gewährleisten. Es wurden auch Inhalte mit Flash erstellt, die jedoch aufgrund der Inkompatibilität mit aktuellen Browsern nicht mehr angezeigt werden können.
Farben:
Bei der Farbgestaltung wurde bewusst auf einen Weiß-Bordeauxrot-Kontrast gesetzt. Das Hintergrundmuster wurde in einem etwas dunkleren Bordeauxrot erstellt, begleitet von Schattenverläufen, um den Inhalt noch stärker hervorzuheben.
Webfont:
Als Schriftart wurde das „Google-Font“ „Philosopher“ ausgewählt, das auf elegante Weise an die geschwungene Form einer Tulpe erinnert und somit perfekt mit dem Corporate Design harmoniert.
JavaScript/Ajax:
Die Inhalte werden dynamisch in einen Container(div) geladen. So dass beim klicken der Buttons die Webseite nicht von neuem aufgebaut wird. So entstehen flüssige Übergänge beim laden, und kein typisches flackern. Auch mit einem deaktivierten JavaScript ist die Seite voll funktionsfähig.
Ladeschirm:
Nachdem die Webseite vollständig geladen wurde, öffnet sie sich mit einer beeindruckenden Intro-Animation, die mit Hilfe von jQuery erstellt wurde. Diese Animation verleiht der Webseite einen professionellen und ansprechenden Eindruck und sorgt für eine positive Nutzererfahrung.
Menü Buttons:
Die Buttons zeigen CSS Mouse-Over Effekte mit wachsenden Blüten-Pfeilanimationen. Angeklickte Buttons erhalten ein blaues Icon.
Slider:
Um die geschwungene Form des Tulpen-Layouts zu berücksichtigen, wurden speziell für den Slider transparente PNG-Bilder erstellt.
Flash Flipbook Speiseliste:
Die Speiseliste wurde als Flash-Animation umgesetzt, die das Umblättern einer visuellen Speisekarte simuliert. Links sind die Speisen und Preise in einem Rahmen aufgelistet, rechts die entsprechenden Bilder.
Kontaktformular:
Das Kontaktformular mit Captcha. Lageplan wurde mit „Google Maps Api“ realisiert. Das Farbschema und die Icons von Google Maps wurden an die Webseite angepasst.
Die Webseite ist nicht mehr online, man kann eine Vorabversion unter dem folgenden Link betrachten:
Diese Version gibt Ihnen einen Eindruck von der Gestaltung und Funktionalität der Webseite, die ich damals entwickelt habe.
