uxzentrisch erörtert:
Gut, genau das wollte ich noch erfahren.

Artikel 3 von 4: Inhaltsschwache Seiten

Im Rahmen der Serie zu kontextsensitiver Navigation beschäftigt sich dieser Beitrag mit dem Seitentyp der inhaltsschwachen Seiten. Was verstehe ich unter inhaltsschwachen Seiten? Dieser Seitentyp ist dadurch gekennzeichnet, dass die Anzahl der Inhalte gering ist, die Inhalte selten aktualisiert werden und weit verstreut sind. Verstreut, weil sie ganz kleine thematische Gruppen bilden oder sogar als einzelnes Content-Element ein Thema repräsentieren. Zusätzlich sind die Inhalte oft so spezifisch, dass sie kaum für jeden Besucher der Website relevant sein können. Typische Vertreter inhaltsschwacher Seiten sind Konzern- oder Markenauftritte.

Um die Relevanz eines Themas für den Nutzer herauszufinden, müssen ein paar Klicks vergehen bzw. muss eine Suchabfrage gestartet worden sein. Dies hängt u.a. mit dem heterogenen Publikum der Website zusammen.

Die folgende Skizze zeigt den Aufbau einer inhaltsschwachen Seite:

ill_007

Punkte repräsentieren die Inhalte, Linien die Navigation. Einzelne Inhalte bilden entweder kleine Gruppen oder stehen ganz alleine da.
ill_008

Der Nutzer möchte meist eine ganz bestimmte Information finden.

Der einzige gemeinsame Nenner der Inhalte ist die Häufigkeit der Nutzung. Deswegen werden auf der Startseite die meistbesuchten Inhalte gruppiert und dargestellt. So kann der Nutzer die gewünschten Inhalte durch einfaches Scrollen finden. Die Lösung funktioniert gut für inhaltsschwache Websites, da sie wenige Top-Inhalte umfassen. Um die Orientierung zu erleichtern, werden die Top-Inhalte nach Zielgruppen gebündelt.

carlsberg_001

Das vorgeschlagene Redesign der Startseite von carlsberggroup.com, deren Inhalte mir als Grundlage gedient haben, in der Smartphone-Ansicht.

Die Schwäche des Inhalts ergibt typischerweise eine hierarchische Gruppierung, da für alternative Systeme wie Tagging nicht genug Material vorhanden ist. Die klassischen Übersichtsseiten bieten allerdings rein künstlichen Inhalt, der nur erstellt wurde, um sie zu füllen. Solcher Inhalt bietet dem Nutzer keinen Mehrwert, deswegen verzichte ich bei dem Redesign auf die eigentlich »leeren« Übersichtsseiten. Die Regel ist simpel: Hat ein Navigationsknoten einen spannenden Inhalt von mindestens vier Absätzen, ein Video oder ein Tool anzubieten, führt dieser Navigationspunkt auf eine Seite. Unabhängig davon, ob diese Seite Unterseiten besitzt oder nicht. Hat eine Seite aber keinen Inhalt, funktioniert sie als reine Gruppierung und wird übersprungen. Damit bleiben dem Nutzer lange Ladezeiten sowie die Enttäuschung aufgrund der uninteressanten Inhalte erspart. Unten wird das Navigationsprinzip Schritt-für-Schritt erklärt.

Ein Klickweg in der Desktop- bzw. Tablet-Ansicht

1

carlsberg_004

Die Startseite in der Desktop-, bzw. Table-Ansicht. Die Navigation ist links platziert, die unterste Leiste beinhaltet das Logo und die Suchfunktion.

2

carlsberg_006

Sobald der Nutzer auf »About us« klickt, erscheinen die Unternavigationspunkte dieses Bereichs. Gleichzeitig wird die obere Ebene, also die Geschwister des ausgewählten Navigationspunkts, verdrängt. Diese Ebene kann wieder erreicht werden indem der Nutzer auf »Homepage« klickt. Obwohl der Nutzer weiter navigiert, wird keine neue Seite geladen. Rechts von der Navigation sehen wir immer noch die Startseite. Das liegt daran, dass der Navigationspunkt »About us« keine Inhalte anbietet und eine reine gruppierende Funktion erfüllt.

3

carlsberg_008

Der Punkt »Strategy« bietet ebenso keinen Inhalt und dient reiner Gruppierung. Deswegen wird auch in diesem Fall keine neue Seite geladen.

4

carlsberg_010

Erst die »Strategy Wheel«-Seite bietet Content an und nicht nur die Navigation, sondern auch der Inhalt verändert sich.

Und jetzt der gleiche Weg in der Smartphone-Ansicht.

1.1

carlsberg_012

Ein Ausschnitt der Startseite in der Smartphone-Ansicht. Die Navigation ist im Hamburger-Menü versteckt.

2.1

carlsberg_005

Der Nutzer öffnet das Menü mit einem Klick auf das Icon.

3.1

carlsberg_007

Sobald der Nutzer auf »About us« klickt, erscheinen die Unternavigationspunkte dieses Bereichs. Gleichzeitig wird die obere Ebene, also die Geschwister des ausgewählten Navigationspunkts, verdrängt. Diese Ebene kann wieder erreicht werden, indem der Nutzer auf »About us« klickt.

4.1

carlsberg_009

Der Punkt »Strategy« bietet ebenso keinen Inhalt und dient reiner Gruppierung. Die Unternavigationspunkte werden angezeigt.

5.1

carlsberg_011

Erst die »Strategy Wheel«-Seite bietet Content an. Die Seite wird neu geladen, die Navigation klappt zu. Der Nutzer kann über den Link »Strategy« die Navigationspunkte der Elternebene erreichen. Mit dem Klick auf das Hamburger-Menü klappt das Menü auf; die Hauptnavigation – die erste Navigationsebene – wird angezeigt.

Wie gerade in dem Beispiel aufgezeigt, wird die Seite erst neu geladen, wenn ein richtiger Inhalt – »Strategy Wheel« – erreicht wurde. Aus Respekt vor dem Nutzer, der uns durch sein Navigationsverhalten genügend Informationen über seine Interessen vermittelt hat, werden am Ende des von ihm aufgesuchten Inhalts Links zu anderen passenden Inhalten platziert. Dazu dient das Element: „Most Viewed After “, das auf der Analyse der Zugriffsdaten basiert. Diese Navigation bietet direkten Zugang zu Inhalten, die der Nutzer wahrscheinlich als nächste lesen möchte. Somit wird die erneute Verwendung der Hauptnavigation vermieden. Die Geschwisternavigationsknoten, in der mobilen Ansicht unter „Most Viewed After“ und in der Tablet-Ansicht in dem Navigationsbereich links von »Most Viewed After« platziert, bieten eine zweite Möglichkeit, logisch naheliegende Inhalte schnell zu erreichen.

„Most Viewed After“ als zusätzliches Navigationselement

1.1.1

carlsberg_002

Das »Most Viewed After«-Element sollte im besten Fall auf der Traffic-Analyse beruhen. Dadurch findet der Nutzer, direkt nachdem er sich mit dem initial gesuchten Inhalt befasst hat, einen klaren Zugang zu den in dem konkreten Fall höchstwahrscheinlich relevanten Inhalten.

2.1.1

carlsberg_003

Das »Most Viewed After«-Element in der Smartphone-Ansicht.

3.1.1

carlsberg_014

Auf dieser Seite wird links statt der statischen eine dynamisch generierte Navigation angezeigt. Das »Most Viewed After«-Element bleibt an der gleichen Stelle.

4.1.1

carlsberg_013

Das »Most Viewed After«-Element in der Smartphone-Ansicht im Fall einer dynamisch generierten Subnavigation.

Fazit

Zusammengefasst erfordert eine erfolgreiche Navigation auf einer inhaltsschwachen Seite folgende Punkte:
- Mutiger Verzicht auf unnötige Übersichtsseiten
- Ein Interaction-Pattern, das die Geschwister- und Kindernavigationspunkte in allen Ansichten (Desktop, Tablet, Smartphone) einfach zugänglich macht
- Ein navigatorisches Element, das – nachdem der gesuchte Inhalt gefunden wurde – weitere, für den Nutzer mit großer Wahrscheinlichkeit spannende Inhalte anteasert

Die responsive Navigation funktioniert in der Desktop-/Tablet- und Smartphone-Ansicht gleich und unterscheidet sich durch zwei Eigenschaften: Erstens werden in der Smartphone-Ansicht die Hauptnavigationspunkte anfangs unter dem Menü-Knopf versteckt. Zweitens werden mögliche Geschwister- und Kindernavigationspunkte unter statt neben dem Inhalts-Modul platziert.
Somit lässt sich eine runde navigatorische Lösung für inhaltsschwache Websites bauen. In meinem nächsten Artikel beschäftige ich mich mit produktstarken Websites am Beispiel von amazon.com.

3 Kommentare

Andreas Diehl vor 1 Jahren

Schöner Einblick. Habt hr für das »Most Viewed After« Element ein fertiges Tool verwendet?

Iwona Markuszewska Autor vor 1 Jahren

Hallo Andreas,

Da ich in dem Beitrag ein Konzept und keine fertige Neuimplementierung schildere, kann ich Dir kein bereits von uns getestetes Tool empfehlen.
Abhängig von dem benutzten CMS gibt es unterschiedliche Extensions, die, mit der Anbindung an Analytics, die hier beschriebene Funktionalität ermöglichen. Eine Art Recommendation-Engine für klassische Websites.

Viele Grüße,
Iwona

Peter Smyczek vor 1 Jahren

Danke für diese Artikel-Serie, echt sehr anschaulich und klar nachvollziehbar dargestellt alles.

Hier gefällt mir besonders der Hinweis »mutiger Verzicht auf nutzlose Übersichtsseiten«. Wer kennt es nicht, leider werden diese viel zu oft gefordert aus vermeintlichen »SEO-Gründen«.
Jetzt kann auf einen schönen Artikel verweisen, der genau dieses Problem löst, danke :-)

Grüße
Peter