Architektur, Navigation und Design von Webseiten

Die Architektur einer Webseite, die Navigation und das Design bestimmen zu einem großen Teil, wie der Benutzer Informationen auf der Webseite findet, von einem Informationsbestandteil zum nächsten gelangt und wie leicht er die Informationen aufnimmt. Die Webseitenarchitektur beschreibt dabei die Struktur der Informationsanordnung und ist weitgehend statisch unabhängig von möglichen Eingaben des Kunden.

Die Navigation beschreibt den Prozess, wie ein Kunde von einem Bereich der Webseite zum nächsten gelangt. Das graphische Design definiert visuelle Elemente wie Layout, Schriftgröße und –farbe, oder Bilder.

Architektur

Das Ziel einer guten Webseitenarchitektur ist leicht beschrieben: Sie ermöglicht es dem Benutzer, die gesuchten Informationen oder Produkte intuitiv und logisch zu finden. Eine gute Architektur macht eine Freitextsuche weitgehend überflüssig.

Die Herausforderung bei der Erstellung der Architektur besteht darin, dass es beliebig viele Möglichkeiten gibt, Informationen zu strukturieren. Einige Beispiele: Datum, Alphabet, Geographie, Thema, Hierarchie, Kombination, Benutzergruppe, Aufgabe, Kategorie. Bei Produkten gibt es vergleichbare Optionen: Artikelnummer, Name, Produktgruppe, Preis, Verfügbarkeit, Größe, Beliebtheit usw. Jeder Mensch hat eine andere Herangehensweise an eine derartige Struktur, somit hat auch jeder Kunde eine andere Vorstellung von intuitiver Strukturierung.

Hinzu kommt, dass sich viele Informationen nicht mit einem eindeutigen Begriff beschreiben lassen. Es gibt allgemein übliche Synonyme, umgangssprachliche Begriffe, Fachbegriffe, Abkürzungen oder interne Begriffe eines Unternehmens.

Wie erstellt kann also eine gute Webseitenarchitektur erstellt werden? Grundsätzlich gilt, dass der Kunde im Mittelpunkt aller Überlegungen steht. Der Kunde muss die Informationen leicht finden und nicht der Betreiber der Webseite. Der erste Schritt sollte eine genaue Recherche sein, in der die zu veröffentlichenden Informationen oder Produkte gesichtet werden. Ein derartiger Überblick hilft bei der Gewichtung der Inhalte und damit bei der Erstellung einer gleichmäßigen Struktur. Zweitens sollte die Architektur von Mitbewerbern und neutralen Stellen analysiert werden, ob sich ggf. ein (de facto) Standard der Kategorisierung etabliert hat, den der Kunde verinnerlicht hat. Natürlich kann auch ein existierender Papierkatalog die Struktur diktieren, insbesondere wenn eine enge Verzahnung von Online- und Offlinewelt geplant ist. Schließlich kann eine Befragung von Kunden helfen, der Architektur den letzten Feinschliff zu geben.

Nach der erfolgreichen Erstellung der Webseitenarchitektur folgt der wichtigste Schritt: Die kontinuierliche Optimierung der Architektur. Im täglichen Betrieb zeigt sich, ob die Kunden die Architektur akzeptieren oder nicht. Zwei Hilfsmittel helfen bei der Optimierung: Eine detaillierte Analyse der Bewegung von Nutzern auf der Webseite zeigt, ob die Kunden die vorgeschlagene Struktur tatsächlich nutzen oder eher zufällig die gewünschten Informationen finden. Leider ist aus der Analyse nur ersichtlich, dass die Struktur nicht optimal ist, sie liefert aber keinen Verbesserungsvorschlag. Eine Analyse der häufigsten Suchbegriffe in der Freitextsuche liefert genau das: Informationen oder Produkte die der Kunde sucht, aber offensichtlich nicht leicht in der existierenden Webseitenarchitektur gefunden hat.

Navigation

Die Navigation ermöglicht es dem Benutzer, leicht von einem Bereich der Webseite zum nächsten zu gelangen. Zu diesem Zweck werden dem Benutzer einer Webseite ein oder mehrere Navigationselemente angeboten: Hauptnavigation, Nebennavigation, Brotkrümelnavigation (bread crumb navigation), ähnliche Bereiche, und Links. Der Einsatz dieser Elemente hängt im Wesentlichen vom erwarteten Kundenverhalten, von der Zielsetzung der Webseite, und dem Umfang der Webseite ab.

Ein Unternehmen steht bei der Gestaltung der Navigation vor zwei Herausforderungen. Die Navigation muss die Webseitenarchitektur mit Hilfe von geeigneten Elementen (z.B. Menüs) abbilden und dem Kunden die ganze Breite der Informationen in leicht begreifbarer Weise anbieten. Der Benutzer soll problemlos von einem Informationsbereich zum nächsten springen können.  Es gibt jedoch auch Situationen, in denen der Kunde einen linearen Prozess verfolgen soll, z.B. bei der Newsletterregistrierung oder während des Abschlusses eines Einkaufs. Hier muss die Navigation deutlich den nächsten Schritt aufzeigen und möglichst wenige Ablenkungsmöglichkeiten bieten.

Um eine gute Webseitennavigation zu erstellen, gilt es eine Reihe von Faktoren zu berücksichtigen. In Europa und Amerika hat sich eine Platzierung der Hauptmenüs oben und / oder links zum de facto Standard entwickelt. Hintergrund hierfür ist die Lesrichtung von links oben nach rechts unten. Die meisten Nutzer einer Webseite erwarten die Hauptnavigation daher an einer der beiden Positionen. Die Mehrheit der Benutzer erwartet auch, zu jedem Zeitpunkt zu wissen, wo er sich auf der Webseite befindet, wie er dort hingekommen ist und wie er zum Ausgangspunkt zurück gelangt. Gerade bei umfangreichen Webseiten mit einer hohen Verschachtelungstiefe der Menüs ist dies ein Muss, aber auch weil nicht alle Kunden über die Startseite in die Navigation einsteigen, sondern via Suchmaschine direkt auf einer für sie interessanten Seite landen. Eine so genannte Brotkrümelnavigation kann hier helfen, indem sie dem Kunden visualisiert, welche Schritte ihn zum derzeitigen Standpunkt geführt haben. Gerade bei linearen Prozessen wie z.B. bei einem Bezahlvorgang ist es darüber hinaus entscheidend, dem Kunden auch zu zeigen, welche Schritte noch auf ihn zu kommen und wann er die finale Entscheidung zum Kauf treffen muss. Der Kunden soll bei diesem Prozess nicht überrascht werden.

Bei der Optimierung der Navigation sollte behutsam vorgegangen werden. In den meisten Fällen ist nämlich keine grundlegende Änderung angeraten, sondern Verbesserungen im Detail. Diese Verbesserungen können oft über eine Änderung des Designs vorgenommen werden, z.B. eine andere Platzierung von „zurück“ und „weiter“ Schaltflächen oder eine andere farbliche Kennzeichnung dieser Schaltflächen. Auch eine markantere Kennzeichnung der erforderlichen Schritte in einem Prozess kann die Navigation für den Benutzer erheblich verbessern. Anhaltspunkte für solche Verbesserungen liefern zum einen Klickanalysen und zum anderen Usability Tests.

Zu Navigationselementen zählen auch so genannte Teaser, die eine Information oder ein Produkt kurz beschreiben und den Kunden neugierig machen sollen. Die eigentliche Beschreibung folgt dann auf einer separaten Seite. Der Einsatz dieser Art von Navigationselementen kann sehr erfolgreich und dominant sein, wie z.B. bei Spiegel Online.

Der Einsatz von neuen Technologien wie z.B. AJAX wird in den nächsten Jahren die Navigation dramatisch verändern. Sind heute noch mehrere Schritte notwendig, um beispielsweise die Kundeninformationen abzufragen, so werden in Zukunft alle Informationen in einem Schritt erfasst werden und dynamisch validiert und ergänzt werden.

Design

Das Webseitendesign bestimmt die visuellen Aspekte einer Internetpräsenz. Ziel des Designs ist es, dem Kunden die Informationsaufnahme durch geeignete gestalterische Mittel zu unterstützen. Dies wird erreicht, indem das Layout ansprechend gewählt wird und die Seitenelemente an der idealen Stelle platziert werden. Der Text kann hinsichtlich der Schriftart, Schriftgröße und Farbe angepasst werden und einen klaren Kontrast zum Hintergrund aufweisen. Grafiken und Bilder können die Seite auflockern und gleichzeitig die Aufmerksamkeit des Benutzers auf bestimmte Elemente lenken.

Die größte Herausforderung beim Webseitendesign besteht darin, dass ein ungeeigneter Einsatz der beschriebenen Gestaltungselemente die Informationsaufnahme des Kunden behindert, dass also genau das Gegenteil des eigentlichen Ziels erreicht wird. Klasse Beispiele hierfür sind zu geringer Kontrast oder eine zu kleine Schrift sowie die Überfrachtung der Seite mit Informationselementen. Weiterhin wird oft versucht, die Besonderheiten des Mediums Internet zu ignorieren und die gleichen Gestaltungsgrundsätze wie im Printbereich anzuwenden. Eine eins-zu-eins Übertragung ins Internet funktioniert allerdings in den seltensten Fällen.
Bei der Erstellung des Designs ist zuerst zu prüfen, ob es bereits ein Corporate Design (CD) gibt, welches die Corporate Identity (CI) widerspiegelt. Existiert ein CD, so sind mit hoher Wahrscheinlichkeit Schriftarten, Farben und zu verwendende Bilder bereits vorgegeben und müssen für die Nutzung im Internet angepasst werden. Generell gilt es darauf zu achten, dass ein einheitliches Erscheinungsbild der Webseite gewährleistet wird und die erstellten Richtlinien bezüglich Layout, Schrift etc. konsistent beibehalten werden. In Bezug auf eine leichte Informationsaufnahme sollten einige Prinzipien aus dem Druckbereich übernommen werden, insbesondere die maximale Anzahl von Zeichen pro Zeile und die Anzahl der Zeilen pro Seite. Dies erhöht die Lesbarkeit erheblich.

Eine Optimierung des Designs sollte genau wie bei der Navigation behutsam erfolgen. Anhaltspunkte können auch hier ein Klickanalyse oder ein Usability Test sein. Die Wirksamkeit von Änderungen sollte gemessen werden, um sich nicht auf das Bauchgefühl von Designern verlassen zu müssen. Hier kann in idealer Weise die Funktionalität der multivariaten Tests genutzt werden. Dies bedeutet, dass eine Hypothese bezüglich der Gestaltung eines Webseitenelements direkt überprüft wird, indem ein Teil der Kunden eine Variante benutzt und ein anderer Teil eine andere Variante.

Zusammenfassung

Die drei Elemente Webseitenarchitektur, Webseitennavigation und Webseitendesign beeinflussen in wesentlicher Weise, wie ein Kunde Informationen aufnimmt oder Produkte wahrnimmt. Eine erfolgreiche Webpräsenz muss daher diesen Elementen eine hohe Aufmerksamkeit einräumen. Bei der Neugestaltung von Webseiten sollte die Arbeit bei der Architektur beginnen und über die Navigation hin zum Design immer weiter detailliert werden. Bei der Optimierung von Webseiten gilt die „Politik der kleinen Schritte“, so dass Änderungen schnell umgesetzt werden können und ihre Wirksamkeit direkt überprüft werden kann.

• < Zurück
• Weiter >