CSS Noodle Garden

Screenshot des Noodle Garden.

Der "CSS Noodle Garden" ist eine Semesterarbeit der Vorlesung Mediendesign.

Hintergrund

Die Website "CSS Zengarden" veranschaulicht, was mit CSS-Design alles möglich ist: Auf der Startseite können unterschiedliche Layouts ausgewählt werden. Diese Layouts sind lediglich verschiedene Stylesheets, die dynamisch in diese eine HTML-Seite eingebunden sind und somit gar nichts an der HTML-Struktur ändern.

Aufgabe

Aufgabe war es nun, ein weiteres Layout für den "CSS Zengarden" zu gestalten und mit CSS umzusetzen. Dabei kam es besonders auf eine kreative Idee, ein schlüssiges, stimmiges und benutzerfreundliches Design und ein gut geschriebenes CSS an.

Konkrete Umsetzung

Da ich sehr gerne Nudeln esse und man sich vom Fehlen jeglicher assoziativen, motivischen und layouterischen Vorgaben beflügeln lassen sollte, habe ich mich für ein Nudel-Layout entschieden.
Man schaut dabei auf einen gedeckten Tisch mit dem Flair einer italienischen Pizzeria. Da ich es bevorzuge, dass grafische Elemente eine Funktion haben, trägt der plakative Teller im Seitenkopf den Titel und die Serviette den Einleitungstext. Daneben finden sich immer wieder witzige, kleine Details wie verschiedene Oliven als Aufzählungspunkte oder Tomaten für die Überschriften die das Design stimmig machen. Auch die Typografie der Überschriften und Titel ist rund und verschnörkelt, um ein "nudeliges" Aussehen zu vermitteln.