Website-Aufbau

2018 war das Jahr der Long- oder Multi-Pager. Das sind mehrseitige Webseiten, deren Inhalte sehr lang sind und wie One-Pager gescrollt werden. Lerne hier, wieso sie auch 2019 so gut performen und was du bei der Konzeption beachten solltest.

Seit der Umstellung von Google auf die „mobile first“ Indexierung in 2018 liegen „lange“ Webseiten voll im Trend. Der Grund:

  • Mobile Nutzer scrollen lieber als zu Klicken. Die Klickrate ist mobil im Durchschnitt 2/3 geringer als auf Desktop-Geräten. Zu Klicken bedeutet immer eine Entscheidung zu treffen und einen größeren Umstand, als jederzeit zurück scrollen zu können (oft sind Menüs gar nicht mit einem Finger am Smartphone klickbar, da sie so weit oben sind). Deswegen scrollt man auch die erfolgreichsten Apps (Facebook, Instagram, Whatsapp).
  • Mobile Nutzer nehmen sich im Schnitt rund 1/3 weniger Zeit zum Surfen auf einer Website. Das liegt oftmals an dem Umstand, wo die Leute surfen (seltener im Büro als unterwegs oder auf dem Sofa).
  • Das mobile Nutzerverhalten – User Signals genannt – fließt durch die stärkere Nutzung von Mobilgeräten im Vergleich zu Desktop-Computern auch stärker in die Bewertung einer Website ein.
  • Nutzerunfreundliche und inhaltlich dünne Webseiten verlieren somit den Wettbewerb um SEO-Rankings – nicht nur 2018, sondern auch 2019.

Eine „lange“ Website kann als OnePager – also als Website mit nur einer URL, auf der alle Inhalte abgebildet sind – oder als Multi Pager realisiert werden. Einen Multi-Pager setzt du dann ein, wenn deine Website zu mehr als drei Suchbegriffen positioniert werden soll. Grundlage eines soliden Website-Konzeptes ist deswegen immer ein aktuelles Keyword-Set.

Infografik

In der nachfolgenden Infografik habe ich das Zusammenspiel der klassischen Navigation (hier im Hamburger-Menü versteckt), einer vertikalen Navigation (links) und der Inhalte visualisiert. Die Erkenntnisse stammen aus den Optimierungen von zig Webseiten aus 2017 und 2018 unterschiedlichster Größe – von ganz klein wie unserer eigenen Website bis zum großen Portal mit Millionen von Besuchern.

Infografik Blueprint Website Relaunch Landingpage Konzept

Download Infografik „Website- und Landingpage-Konzeption 2018”

Navigation

Durch eine lange Webseite nur mit Scrollen und Überfliegen der Inhalte zu navigieren ist für manche Nutzer zu umständlich. Das Risiko, dass sie genervt abspringen, ist höher als die Chance, dass sie länger auf der Seite verweilen. Stelle also sicher, dass deine Besucher zwischen den Sektionen oder Überschriften navigieren können. Du kannst dabei auf eine klassische horizontale Navigation oben in deiner Seite setzen, auf ein fixiertes vertikales Menü links oder auf eine klassische Gliederung, wie Wikipedia.

Sie sehen gerade einen Platzhalterinhalt von Standard. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf den Button unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

Weitere Informationen
In diesem (nicht ganz ernst gedrehten) Video erkläre ich anhand von Wikipedia, wieso eine vertikale Navigation sinnvoll ist.

Zusätzlich empfehle ich dir jeden Menüpunkt auf ein klares Wort zu limitieren. Ein Wort kann auf den ersten Blick deiner Nutzer erfasst werden, mehrere Wörter sind zu komplex und das Risiko, dass Nutzer von deiner Website abspringen (die sog. Absprungrate), steigt.

Conversions

Apropos Navigation: Da Google Analytics wie die meisten anderen Statistiktools nur schwer aufzeichnen können, was innerhalb einer URL passiert, da die Daten ja meist verschlüsselt übertragen werden, sollten wichtige Conversions und Ziele wie Kontaktrubriken und Formulare mit extra Tracking Codes versehen oder auf separate URLs ausgelagert werden. Das Conversion-Tracking kann bei kleinen Seiten direkt über Google Analytics eingerichtet werden (unter Verwaltung > Zielvorhaben), bei etwas größeren Seiten empfehle ich den Google Tag Manager einzusetzen.

Um die Conversionrate zu erhöhen, empfehle ich dir im sichtbaren Teil der Seite (engl. Above the fold-Bereich – innerhalb der ersten 600px) auf Angebotsseiten stets folgende Informationen darzustellen:

  • „Elevator Pitch“: Ein oder mehrere kurze Sätze, welche die Alleinstellungsmerkmale oder Kaufgründe aufzeigen;
  • Weitere verkaufsrelevante Informationen zum Angebot, Service, Support oder Versand.
  • Call-to-Action Button (Handlungsaufforderung)

Diese Grundregel zur Conversion-Rate-Optimierung (kurz: CRO) finden wir in allen wichtigen Webseiten. Ein Musterbeispiel stellt Apple dar:

Screenshot aus Apple-Website für MacBook Pro

Alle Thesen, die im Above the fold-Bereich gestellt werden, sollten dann im nachfolgenden Inhalt (below the fold) bestätigt werden.

Inhalte

Beschreibe in deinen Texten knackig aber umfangreich deine Angebote, denn im Schnitt ist eine top-10-Seite in den Desktop-Suchergebnissen von Google rund 1.500 Wörter lang. In mobilen Suchergebnissen nur 1.000 Wörter.

Damit deine Texte deine Besucher nicht erschlagen, sollten sie in übersichtliche Absätze unterteilt und mit Zwischenüberschriften betitelt werden. Als Faustregel sollte eine Überschrift und ein Absatz zusammen sollten dabei nicht länger sein als ein Smartphonedisplay.

Vermeide in den Texten Füllwörter und erkläre Fachbegriffe. Schreibe keine maschinell klingenden SEO Texte, sondern lasse dich von Optimierungsmethoden wie der WDF*IDF-Analyse nur inspirieren. Schreibe kurze und vermeide verschachtelte Sätze.

Verwende jedoch den wichtigsten Suchbegriff – das Fokus-Keyword – in möglichst exakter Schreibweise in deinem Titel (der h1-Überschrift). Alternative Schreibweisen des Fokus-Keywords und weitere Suchbegriffe zum Thema tauchen dann idealerweise im Text auf.

Lasse außerdem deine Kunden und Leser zu Wort kommen: Ich empfehle das Kundenbewertungen zu integrieren und das Gesamtergebnis in den Above the fold-Bereich zu integrieren. Dieses verlinkst du idealerweise mit den dazu passenden Kommentaren oder Zitaten. Hast du eine Website auf WordPress-Basis, kannst dafür auch das Bewertungsmodul unseres SEO Plugins einsetzen, welches die Kommentarfunktion um die Bewertungssterne ergänzt.

Ankerlinks und Sternebewertungen in Google Suchergebnissen
Sternebewertungen und Ankerlinks als Sitelinks – Screenshot aus Google

Die Bewertungstexte können die Relevanz deiner Seite verbessern, sofern der Anteil dieses „user generated Content“ nicht den deiner Texte übersteigt. Im Idealfall ist der Anteil an Rezensionen kleiner oder gleich 30%. Um das zu erreichen, kannst du eine Paginierung der Kommentare aktivieren. Die Sterne-Bewertungen können außerdem die Aufmerksamkeit in den Suchergebnissen erhöhen. Dies führt zu besseren Klickraten und Rankings.

Layoute außerdem deine Texte sinnvoll: Idealerweise hast du nur einspaltige Inhalte, da diese durch den Anspruch an die Optimierung für mobile Endgeräte entstehen („mobile first Ansatz“). Du kannst aber auch bis zu vierspaltig Inhalte einsetzen, wenn die Lesbarkeit dadurch auf Desktop-Geräten besser wird. Insbesondere bei Übersichtsseiten ist das meist sinnvoll. Bilder und Animationen helfen außerdem, Informationen zu visualisieren und Nutzer auf der Webseite zu halten.

Medien

Je länger deine Inhalte werden, desto mehr Medien werden darin abgebildet. Dies kann dazu führen, dass deine Webseite sehr langsam wird. Da aber der Anspruch an schnelle Websites enorm gestiegen ist (unter 4 Sekunden Ladezeit ist Pflicht – Teste sie einfach mal mit WebPageTest.org), solltest du alle Bilder zunächst im richtigen Format abspeichern:

  • Fotos sind im JPG-Format mit leicht bis stark reduzierter Qualität (60-80%) am besten;
  • Grafiken solltest du am besten im SVG-Format als Vektoren speichern, da diese in vielen Fällen die kleinsten Dateien sind und sich verlustfrei skalieren lassen. Wichtig bei der Verwendung von Text in SVG-Grafiken ist, dass dieser in einer Webfont (Schriftart deiner Webseite) eingestellt ist, oder dieser vektorisiert wird. Alternativ kannst du bei Grafiken auch mit PNG in 8 Bit oder GIF in reduzierter Farbzahl experimentieren.

Vor dem Upload sollten alle JPG-, PNG-, GIF-, JavaScript- und CSS-Dateien komprimieren werden. Wie das geht, verrate ich dir in meiner Anleitung zur Performance Optimierung. Bilder und Inhalte per LazyLoad Funktion erst dann zu laden, wenn sie in den sichtbaren Bereich einer Seite kommen, kann übrigens dazu führen, dass diese nicht von Google wahrgenommen werden. Das gleiche gilt für versteckte Slider-Elemente und Accordion-Inhalte. Deswegen sollten wichtige Informationen nie in solchen Elementen oder Funktionen versteckt sein.

Videos würde ich übrigens immer an YouTube auslagern, da diese dann auch zur Video SEO genutzt werden können. Über die YouTube-Schnittstelle des Mikrodaten-Moduls unseres SEO Plugins, lassen sich übrigens sehr einfach Videovorschauen in die Google Suchergebnisse bringen.

Fazit

Der Anspruch an umfangreiche Inhalte steigt zwar, allerdings birgt dies auch besondere Herausforderungen in der Benutzerfreundlichkeit und selbst dem Messen von Erfolgen. Und noch was: Vergesse in deinen Inhalten nie dein eigentliches Ziel und die Handlungsaufforderung.

Planst du einen Website-Relaunch, ist zusätzlich zum Keyword-Set ein Content-Audit sehr empfehlenswert, damit du die Qualität und Nutzerfreundlichkeit deiner Inhalte bewerten kannst. Aus dem Content-Audit folgt ein Pflichtenheft zur Überarbeitung oder Löschung schwacher Inhalte.