Organisches Webdesign

Jede Seite einer Website besteht aus einem oder mehreren Rechtecken, die die dargestellte Fläche des Webbrowsers ausfüllen. Innerhalb dieser Rechtecke wird dann der sichtbare Inhalt dargestellt. Meist gibt es eine horizontale Kopfleiste, mehrere vertikale Spalten und abschließend eine horizontale Fußleiste.
Diese grobe Grundstruktur hat sich inzwischen bewährt und kommt wohl bei den meisten Websites zum Einsatz. Damit nun aber nicht alle Websites gleich aussehen und damit sehr langweilig wirken würden, bemüht man sich um eine individuelle Note innerhalb dieser Aufteilung. Dies wird zum Teil durch eine unkonventionelle Aufteilung innerhalb der Grundstruktur erreicht, häufiger aber durch geschickten Einsatz von Hintergrund-Mustern und -Farben. Hierbei haben sich bestimmte Stile entwickelt, die teilweise schon einen eigenen Namen erhalten haben. Eine Stilrichtung ist das „Organische Webdesign“ für das ich hier ein paar Beispiele aufführen möchte.

Creativepayne
Creativepayne

Hier wird mittels Zeichnungen, Hintergrundmustern und Schreibschriften eine optische Anmutung wie bei Prospekten aus den 60er Jahren des vorigen Jahrhunderts erzeugt.


Spring
Spring

Auch hier werden Zeichnungen in einem typischen Stil verwendet, den man z.B. aus Lehrbüchern früherer Zeiten kennt. Durch die Wahl des Hintergrunds entsteht der Eindruck, die Seite wäre auf sehr grobem Papier gedruckt.


Josh-Sullivan
Josh-Sullivan

Und wieder Zeichnungen aus einer anderen Epoche als Stilelemente dieser Website.


Ndesign
Ndesign

Zeichnungen, Hintergrundmuster und Überschriften ergeben hier den ganz eigenen Charakter der Website.


Web-Designer-Wall
Web-Designer-Wall

Auch hier sind es in erster Linie die Zeichnungen, die den Charakter der Website bestimmen.


LivingDesign
LivingDesign

Die Header-Collage in Übergröße bestimmt hier den Stil der Website.


BornLiving
BornLiving

Groß, schräg, skizziert, so erscheint diese Website.


JESUS-RODRIGUEZ-VELASCO
JESUS-RODRIGUEZ-VELASCO

Ähnlich wie das Beispiel zuvor.


Morphix-Design-Studio
Morphix-Design-Studio

Ein Kinderbuch könnte hier Pate gestanden haben.


Kulturbanause
Kulturbanause

Auch hier bestimmt wieder die Grafik das Aussehen der Website.


David-Hellmann
David-Hellmann

Ein übergroßes Selbstportrait, große Schriftzüge und feine Hintergrundmuster bestimmen den Charakter dieser Website.


SimpleBits
SimpleBits

Farben und Hintergrundmuster sind hier bestimmend für den Charakter.


Wing-Cheng
Wing-Cheng

Eine ganz raffinierte Website, bei der fast nur Handskizziertes und Handgeschriebenes zum Einsatz kommt – wirklich unverwechselbar.


CSS3-Transforms
CSS3-Transforms

Eine Demonstration einiger der vielen Möglichkeiten von CSS3. Aufgrund der schrägen Darstellung der Elemente und des geschickten Einsatzes des Hintergrundmusters ergibt sich auch hier ein handgearbeiteter Stil.


In einem weiteren Artikel möchte ich als Kontrast zu den obigen Beispielen Seiten zeigen, die unter dem Begriff „Web 2.0 Look“ eine ganz andere Richtung einschlagen.