Das Auge liest mit

Gelungenes Design im Internet funktioniert nach einem einfachen Prinzip: Alles oder Nichts

Wer im Internet überzeugen will, dem bleibt die Zeit eines Wimpernschlags: Gelangt man auf eine neue Internetseite, wird nach einer zwanzigstel Sekunde bereits ein erstes Urteil gefällt. „Der erste visuelle Eindruck beeinflusst den weiteren Entscheidungsprozess der Nutzer enorm und kann somit als ein grundlegender Baustein zum Aufbau und Vertrauen in die Seite gesehen werden“, meint der Webseiten-Entwickler und Designer Vitaly Friedman.

Das Fundament für den Erfolg einer optisch beeindruckenden Internetseite ist zweieinhalb Tausend Jahre alt. Es stammt von dem Griechen Euklid von Alexandria. Der Mathematiker aus dem 4. Jahrhundert vor Christus hat den Begriff des goldenen Schnitts geprägt. Der besagt, dass die Trennung von Flächen und Geraden immer dann als harmonisch empfunden wird, wenn das Verhältnis fünf zu drei beträgt. Zum Beispiel wirken Landschaftsaufnahmen dann besonders gut, wenn fünf Teile Himmel und drei Teile Erde zu sehen sind. Das Prinzip funktioniert auch im Internet: Eine optische Aufteilung im Verhältnis des goldenen Schnitts lässt eine Seite harmonisch und aufgeräumt wirken.

Grundsätzlich gilt: Das Ordnen der Internet-Seite in inhaltliche Blöcke ist wichtige Bedingung für gelungenes Design. „Studien haben gezeigt“, so Friedman, „dass wir Webseiten nicht nach einem typischen Schema scannen, sondern eine Art Zickzack-Analyse nach dem F-Muster durchführen.“ Das F-Muster meint, dass sich User Internetseiten in der Weise anschauen, dass ihr Augenverlauf den Buchstaben „F“ ergibt. Sie scannen zuerst den Kopf der Webseite, anschließend den linken Bereich, dann den Hauptbereich, der oft quer in der Mitte liegt. Auf diese Weise wird sortiert, kategorisiert und anschließend die Entscheidung für die nächste Seitenaktion getroffen.

Um den User auf diesem Weg zu unterstützen, sollten Internet-Seiten in einzelne Blöcke aufgeteilt werden. Denn „bevor ein Benutzer seine nächste Entscheidung treffen kann, muss er präsentierte Inhalte in verdauliche Bruchteile auflösen“, schreibt Friedman im „Praxisbuch Web 2.0“. Einfaches Mittel um diese Blockbildung zu erreichen: Zwischen unterschiedlichen Elementen einer Seite Abstand halten – der leere Raum als wichtige Design-Regel.

In der Design-Szene spreche man dann von einem gelungenen Design, so Friedman weiter, wenn dieses entweder sofort ins Auge springe oder unsichtbar bleibe. „Ein unsichtbares Design ist häufig weit effizienter als ein buntes Farbenspiel, vor allem weil es nicht die Gestalt der Seite betont, sondern den Inhalt der Beiträge.“

Doch was sich zunächst leicht anhört, ist in der Praxis schwer umzusetzen. Denn wo nichts ist, da ist eben auch kein Inhalt. Gerade bei größeren Portalen, wie zum Beispiel Nachrichten-Diensten, bei denen es darauf ankommt, besonders viele Inhalte zu präsentieren, bedarf es des Kompromisses zwischen großzügigem Design und der Übermittlung möglichst vieler Informationen. Weniger ist eben auch nicht immer mehr. Oder wie es der Designer Milton Glaser sagte: Less isn’t more, enough is more – Weniger ist nicht mehr, gerade genug ist mehr.

Die gekonnte Reduktion aber ist nur eines von mehreren Merkmalen gelungener Webseiten. Was ebenfalls wichtig ist:

  • Die optisch strikte Trennung der eigentlichen Seiteninhalte von Seitenattributen wie Navigation oder Kontaktinformationen.
  • Ein starkes Augenmerk auf die richtige Farbauswahl. Zur Zeit in Mode: sowohl weiche Farben, die den Eindruck von Ruhe und Behaglichkeit vermitteln als auch starke Farbkontraste, um beim Seiten-Besucher einen bleibenden Eindruck zu erwecken.
  • Ein besonders typisches Merkmal des Web 2.0-Designs: abgerundete Ecken. Friedman: „Während Kästen und rechteckige Gebilde eher für praktische Zwecke gedacht sind, können abgerundete Objekte sich davon abheben und eine natürliche Form vorweisen.“ Das wirke attraktiv und spielerisch.
  • Bei der Wahl der Typografie werden zudem zunehmend serifenlose Schriften bevorzugt. Als Serife (französisch „Füßchen“) bezeichnet man die feine Linie, die einen Buchstabenstrich am Ende, quer zu seiner Grundrichtung abschließt. Serifen erhöhen prinzipiell die Lesbarkeit von Buchstaben. Generell eignen sich Serifenschriften aber eher für gedruckte Schrift.

Und was ist eigentlich mit Bildern? Der Volksmund sagt: Ein Bild sagt mehr als 1000 Worte. Informatik-Professor Mario Fischer meint: „Als sich das Sprichwort eingebürgert hat, gab es noch keine Webseiten.“ Und es habe damals noch keine verzweifelten Versuche gegeben, mit Bildern, Grafiken und Icons auch wenigstens nur ein einziges Wort zu ersetzen. Der Vorteil von Bildern sei zwar, dass man sich an sie viel besser erinnere als an Worte. Das Problem: Bilder, Grafiken und Icons seien in ihrer Aussage selten eindeutig. Die Folge: Die Seitenbesucher verstehen sie nicht. Sprache sei dagegen meist klarer. Für das Internet kehrt Fischer die Volksweisheit deshalb um: „Ein Wort sagt mehr als 1000 Bilder.“

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s