Mit dieser Artikelserie möchte ich beginnen etwas zur Individualität einer Internetpräsens zu schreiben.

Durch die Vielzahl an Seiten im World Wide Web, wird es immer wichtiger auf ein individuelles Design zu setzen. Die Seiten, die sich im Internet durchsetzen, haben ein besonders schönes Design, oder aber auch ein besonders hässliches, einprägsames Design. Es muss sich von anderen Design abheben und einen hohen Wiedererkennungswert besitzen.

Vorüberlegung zum Layout / Design

Die folgenden Fragen solltet ihr euch in einer Art Übersicht beantworten und immer vor Augen halten, wenn ihr etwas an eurer Seite ändert. Die Fragen sind nicht nur bei Änderungen am Layouts wichtig, sondern immer, wenn ihr an der Seite etwas macht.

Überlegt euch gut, wen ihr mit eurer Präsenz ansprechen wollt.

• Wie alt ist die Zielgruppe? Sehr jung oder schon sehr alt
• Welches Geschlecht möchtet ihr ansprechen? Mann oder Frau
• Haben die Zielpersonen eine spezielle Sexualität? Heterosexuell, Bisexuell, Transsexuell oder Homosexuell
• Woher kommt die Zielgruppe? Stadt, Land, Bundesland
• Welche Vorlieben sollten die Personen mit euch teilen, wenn Sie eure Seite besuchen? Tiere, Design, Optimierung, Programmierung, Freunde, etc

Je genauer die Zielgruppe definiert ist, desto einfacher wird es sein, ein individuelles Design zu erarbeiten.

Layout und Content sollten eine Einheit bilden

Wenn das Layout an den Content angepasst wird, dann merken sich Nutzer in gedanklicher Verbindung beider Seiten das Erscheinungsbild besser.

• Welche Emotionen möchtet ihr vermitteln? Freude, Trauer, Wut oder vielleicht Empörung? Auch Kaufbereitschaft zählt hier mit hinein
• Sind es politische oder technische Themen über die geschrieben werden?
• Auf was wird der Focus gelegt? Bilder, Video oder Text

Um ein Paar Unterschiede zu sehen, einfach folgende Seiten betrachten.

• Offizielle Seite des Weißen Hauses - Regierungseite
• Welt.de - Nachrichtenseite
• YouTube - Videobroadcast
• Clipfish - Videobroadcast
• Heise - Technik und Nachrichten

Beispiele für emotionale Layouts folgen in kürze

Wiedererkennungswert

Am Beispiel Google kann man den Wiedererkennungswert ganz gut erläutern. Google.com ist eine ganz einfache Seite mit einem Logo in der Mitte der Seite und einem Formulareingabefeld darunter. Jeder, der das Internet schon einmal benutzt hat, würde diesen Stil wiedererkennen. Auch die Suchergebnisliste, die sogenannten SERPs (Searchengine Result Pages) sehen seit jeher immer gleich aus. Einige andere Suchmaschinen kopieren diesen Stil um den Nutzer mit dem Wiedererkennungswert von Google zu täuschen und ihm dadurch ein "heimisches" Gefühl vermitteln. Gerade die Einfachheit eines Designs ist sehr ansprechend für viele Nutzer, denn einfach ist gleich übersichtlich und daraus resultiert, der Benutzer kann mit der Seite arbeiten. Weniger ist manchmal mehr!

Was ist wichtig beim Layouten

Behindertengerecht / Barrierefreiheit

Ebenfalls beachten sollte man, dass auch behinderte Menschen auf die Seite Zugriff haben sollten. Barrierefreiheit ist dabei das Stichwort. Auf der Seite des W3C wird in der Thematik WAI - Web Accessibility Initiative genauestens beschrieben, was es bedeutet Barrierefrei zu Layouten. Dabei sind es einfache Dinge, wie beispielsweise der hohe Kontrast der Schriftfarbe zur Hintergrundfarbe oder eine anpassbare Schriftgröße, die bei einer behindertengerechten Webpräsenz eine Rolle spielen.

• Schriftgrößenangabe in em (1em = 16px) oder Prozent - nicht Pixel. Dadurch kann in den meisten Browsern durch drücken der Tasten Strg/Crtl und +/Plus die Schrift vergößert werden.
• Kontrastreiche Darstellung von Texten
• Alternativtexte in Bildern angeben
• Ist die Seite einhändig bedienbar (in den meisten Fällen gegeben)

Weiterführende Links zum Thema Gestaltung einer WebPräsenz

Zu guter letzt noch ein Paar Links, welche ich auf dem Weg der Recherche gefunden habe und als sehr nützlich erachte.

Anregungen für Designer

• Templateworld
• CSS Mania
• W3C Sites - W3C konform Seiten
• Netzfrühling
• Joomla Template Gallerie
• MyFreeTemplates
• templatemonster

Barrierefreiheit

• W3C - WAI - Web Accessibility Initiative
• Wikipedia - Web Accessibility Initiative

Wiedererkennung und Corporate Identity

• Variation und Wiedererkennung
• Wikipediaartikel zum Corporate Identity
• corporate identity portal