Mit „Above the Fold“ wird der Bereich einer Website beschrieben, der für einen Nutzer ohne scrollen sichtbar ist. Der Begriff stammt aus dem Zeitungswesen. Zeitschriften werden an der Knicklinie (Falz) gefaltet und dem Leser zum Kauf angeboten. Auf dem sofort sichtbaren Bereich der Zeitungen stehen die wichtigsten Schlagzeilen, Storys, Überschriften und Bilder, um die Aufmerksamkeit des Lesers auf sich zu ziehen.
Genauso verhält es sich mit dem sichtbaren Bereich einer Website. Er ist das Erste, was ein User sieht, wenn er auf die entsprechende Website kommt. Er zieht das Interesse des Nutzers auf sich und ist entscheidend dafür, ob sich dieser durch die Seite klickt und scrollt. Alles unterhalb der Falzlinie (Fold) wird als Bereich Below the Fold bezeichnet.
Auch bei den Google Suchergebnissen wird teilweise von Ergebnissen Above the Fold gesprochen. Im besten Fall finden sich dort acht organische Web-Treffer. Bei der Einblendung von Ergebnissen aus der Bildersuche, Videosuche, Anzeigen, einem angezeigtem Knowledge Graph oder Ergebnissen mit Sitelinks schrumpft die Anzahl schnell zusammen. Daher haben insbesondere die ersten drei Plätze eine starke Bedeutung in der Suchmaschinenoptimierung. In der mobilen Darstellung der Suchergebnisse zeigt sich noch deutlicher die Bedeutung der Anzeige Above the Fold. Werden Anzeigen eingeblendet, sind diese möglicherweise die einzigen Ergebnisse, die ohne Scrollen dargestellt werden.
Der „Above the Fold“-Bereich kann als eine Art Schaufenster bezeichnet werden, mit dem sich eine Website der entsprechenden Zielgruppe präsentiert. Zum besseren Verständnis kann ein Vergleich zwischen der Offline-Welt und Online-Welt herangezogen werden.
Das Ziel eines Schaufensters in der Offline-Welt besteht darin, die Laufkundschaft von dem Angebot zu überzeugen. Die Fläche kann ansprechend und spannend gestaltet werden, um die Emotionen und das Kaufverlangen der Personen zu wecken.
Nicht anders verhält es sich bei einer Produktpräsentation in einem Online-Shop oder der allgemeinen Präsentation einer Website. Das Unternehmen möchte sich von seiner besten Seite zeigen und seinem Publikum das Alleinstellungsmerkmal vorstellen.
Es ist wichtig, diesen Bereich ansprechend zu gestalten und mit den wichtigsten Informationen zu versehen. Das Ziel besteht darin, das Interesse des Users zu wecken, ohne ihn mit unnötigen Informationen zu überfordern.
Above the Fold in der Suchmaschinenoptimierung
Den sichtbaren Bereich und das Nutzerverhalten ermitteln
Die Darstellung des „Above the Fold“-Bereichs richtet sich nach dem Endgerät, das ein Nutzer zur Betrachtung einer Website verwendet. Allein unter Monitoren variieren die Auflösungen stark, ebenso bei Tablets und Smartphones.
Einen Überblick, mit welcher Bildschirmauflösung eine Seite am häufigsten betrachtet wird, liefert Google Analytics. Im Bereich „Berichte“ unter „ZIELGRUPPE > Technologie > Browser und Betriebssystem“ stehen unterschiedliche Berichte zur Verfügung. Oberhalb der Tabelle kann die Primäre Dimension auf „Bildschirmauflösung“ gewechselt werden.
Zusätzlich ist interessant, welche Seiten über Desktop, Tablet und Smartphone betrachtet werden. Dazu kann zum Beispiel die Darstellung des Nutzerflusses betrachtet werden: Unter „VERHALTEN >Verhaltensfluss“ kann die Darstellung nach Geräten (Segment) gefiltert werden. Eine andere Möglichkeit ist, unter „VERHALTEN > Alle Seiten“ als Sekundäre Dimension die Bildschirmauflösung einzublenden. Die Analysen können natürlich beliebig ausgeweitet werden, um beispielsweise nach Zusammenhängen zwischen Auflösung und Absprungseiten zu suchen. Apropos Absprungseiten: Leider wertet Analytics standardmäßig Seiten als Absprungseiten, von denen nicht auf eine weitere Seite der Domain gewechselt wurde. Es ist also gut möglich, dass User Informationen auf der Landingpage finden und deshalb nicht weiter navigieren.
Um hier genauere Informationen zum Nutzerverhalten zu erhalten, kann ein Script in Analytics eingebunden werden, über das das Scrollverhalten getrackt wird. Darüber können Informationen gewonnen werden, die zeigen, ob „Absprungseiten“ über den „Above the Fold“-Bereich hinaus betrachtet werden.
Mit den Entwickler-Tools im Google Browser Chrom können die einzelnen Seiten für verschiedene Auflösungen betrachtet werden. Diese Tools erreicht man über den Rechtsklick auf der Seite und „Untersuchen“ im Kontextmenü. Rechts öffnet sich ein Fenster, in dem man oben links auf die mobile Ansicht umschalten kann. In der mobilen Ansicht kann mittig im Fenster die Auflösung manuell eingestellt werden. Hier kann also leicht die „Above the Fold“-Darstellung einer Seite kontrolliert werden. Mithilfe von verschiedenen Testoptionen lässt sich feststellen, auf welchen Bereich sich ein Nutzer beim Aufruf einer Site konzentriert.
Viele Agenturen und Website-Betreiber bedienen sich außerdem der Heatmaps und Clickmaps, die sichtbar machen, an welche Stelle der User seine Maus hinbewegt. Die Scrollmaps stellen dar, wie weit ein Besucher auf einer Seite nach unten geht und wie lange er an einer Stelle verweilt. Oftmals wird im Zusammenhang mit Begriffen wie Heatmaps, Opacity Maps und Gazeplots von Eyetracking gesprochen. Einige Unternehmen zeichnen dafür tatsächlich anhand von Testpersonen Augenbewegungen auf. Bei diesem Verfahren kann von zuverlässigeren Daten als bei Heatmaps ausgegangen werden, weil keine Ableitung aus der Cursorbewegung stattfindet, sondern Kameras den Blick direkt verfogen. Gleichzeitig ist diese Maßnahme kostenintensiver.
Bei der Verwendung der Tools zum Cursortracking sind Datenschutzbestimmungen zu beachten. Die DSGVO sollte jedem Webseitenbetreiber ein Begriff sein. Seit der Einführung der neuen Datenschutzverordnung am 25. Mai 2018 sind diese Tests nicht mehr so einfach umsetzbar. Die Personen müssen über die Erfassung informiert werden und dieser zustimmen. Bei Nichtbeachtung drohen empfindliche Strafen. Die zuständigen Behörden des jeweiligen Bundeslandes sind für die Einhaltung der Datenschutzbestimmungen verantwortlich.
Eine Person hat das Recht, die erhobenen Daten löschen zu lassen. Dieses Recht auf das „Vergessen werden“ ist in der neuen Verordnung festgeschrieben. Die erhobenen Daten müssen vor unbefugtem Zugriff sicher geschützt werden. In größeren Unternehmen kümmert sich ein Datenschutzbeauftragter um die Einhaltung der gesetzlichen Vorschriften. Die Kontaktdaten der verantwortlichen Person sind im Datenschutzhinweis aufzuführen.
Ein Website-Betreiber sollte sich ausführlich über die neuen Bestimmungen informieren, bevor er diese Trackingmethoden anwendet. Kaum ist die neue Datenschutzverordnung in Kraft getreten, hat es bereits Abmahnungen von Seiten der Konkurrenz gegeben. Viele Online-Shops haben sich noch nicht mit dem Thema auseinandergesetzt. Dies ist dringend notwendig, um nicht teure gerichtliche Auseinandersetzungen führen zu müssen.
Auf vielen Websites und Online-Shops hat sich die folgende „Above the Fold“-Darstellung bewährt. Der Header bildet den oberen Bereich des Schaufensters. Auf der linken Seite befindet sich das Logo. Auf der rechten Seite folgen die Alleinstellungsmerkmale des Unternehmens, die Suchmöglichkeit und die Hinweise auf Kontaktmöglichkeiten und den Kundenservice. Im Anschluss erscheint die Produktnavigation eines Online-Shops oder die allgemeine Navigation einer Website.
Unter dem Header und der Navigation schließt sich ein Teaser oder Slider an, der sich im Idealfall aus Textelementen und Bildelementen zusammensetzt.
Er ist ein wichtiger Bereich, denn hier werden die Produkte mit den Emotionen eines Besuchers verknüpft.
Ein Bild sagt mehr als tausend Worte und spricht den Nutzer auf einer anderen tiefer gelegenen Ebene an als die reine Textform. Zudem kann der Inhalt eines Bilder deutlich schneller erfasst werden als eine Überschrift. Bilder sind daher ein hilfreiches Element um ein Thema und Emotionen schnell zu transportieren und so zum Scrollen zu animieren. Zudem rücken Bilder zunehmend in den Fokus der SEOs und auch Google optimiert kontinuierlich die Bildersuche.
Suchmaschinen wie Google erkennen die wunderbar grafisch gestalteten Bilder jedoch noch nicht zuverlässig. Die textliche Ergänzung hilft dem Google Bot, das Bild zu verstehen und richtig thematisch einzuordnen. Empfehlenswert ist, die H1-Überschrift und H2-Überschriften mit den wichtigsten Keywords und Keyword-Kombinationen im Teaser-Schaufenster zu verbinden. Im Anschluss folgt dann der eigentliche Content-Bereich.
Für mobile Geräte fällt der „Above the Fold“-Bereich natürlich deutlich kleiner aus. Außerdem müssen klickbare Elemente einen ausreichenden Abstand aufweisen. Da für die Ausspielung auf Desktops, Tablets und Smartphones oft die gleiche Seite verwendet wird, muss die Seite Above the Fold klar strukturiert und durchdacht sein. Teilweise kann mit dem responsiven Webdesign die mobile Darstellung stark vereinfacht werden, die Präsentationen auf den verschiedenen Endgeräten sollten dennoch im Blick behalten werden.
Nachdem der Nutzer das Online-Schaufenster betrachtet hat und ihm gefällt, was er sieht, sollte er mit den entsprechenden Hinweisen durch die Website gelenkt werden. Dies geschieht in der Offline-Welt eines Kaufhauses mit Schildern, die zum Beispiel auf das Damenangebot in der dritten Etage des Kaufhauses hinweisen.
Diese Schilder lassen sich in das Angebot eines Online-Shops oder in eine allgemeine Site integrieren.
Pfeile können anzeigen, dass unten auf einer Website noch mehr zu finden ist. Werden Texte durch die „Above the Fold“-Linie unterbrochen, kann dem Besucher angezeigt werden, dass sich ein Blick darunter lohnt. Eine elegante Variante ist eine Unterteilung des Contents in versetzten Spalten, sodass der Inhalt einer Spalte erst nach dem Scrollen komplett sichtbar wird.
Ein gut durchdachter „Above the Fold“-Bereich führt den Nutzer automatisch an das gewünschte Ziel und lenkt diesen durch das „virtuelle Kaufhaus“. Im Internet existiert eine Vielzahl an Websites, die sich über die Layouts ihrer Schaufenster zu wenig Gedanken machen. In vielen Fällen empfängt den Nutzer eine Standardwillkommens-Seite, die in ein paar wenigen Worten die Leistungen eines Unternehmens beschreibt.
Ein Negativ-Beispiel wäre eine Webseite, auf der nur ein Firmenstempel mit den jeweiligen Kontaktangaben zu sehen ist. Sinnvoller ist es, gerade in den Bereich Above the Fold viel Liebe und Aufwand in die Grafik zu investieren, weil darüber besonders gut die Aufmerksamkeit des Nutzers gewonnen werden kann. Hier kann auch wieder der Vergleich zu Zeitungen gezogen werden. Bei Magazinen wird viel Wert auf das Cover gelegt. Hier wird auf auffällige Bilder und interessante Schlagzeilen gesetzt. Je neutraler die Schlagzeile formuliert wird, desto mehr Bedeutung hat der optische Eindruck.
Die vorangegangenen Ausführungen haben ein Layout gezeigt, dass von vielen Online-Shop- Betreibern und Website-Betreibern verwendet wird. Doch wie sieht das ideale Schaufensterkonzept für einen Online-Shop in Bezug auf die Suchmaschinenoptimierung aus?
Im Idealfall wird ganz oben als echter Text, nicht als Bild, der Titel optisch hervorgehoben. Die Hauptnavigation sollte so weit oben wie möglich stehen. Der H1-Überschriften sollte ein Teaser folgen. In der mobilen Ansicht wäre dann jedoch meist nur die H1-Überschrift und eventuell der Teaser ganz oder zum Teil sichtbar. Der Teaser eignet sich bestens, um die wichtigsten Informationen anzuschneiden. Gerade auf dem Smartphone muss wegen der kleinen Ausschnitte viel gescrollt werden. Daher ist es wichtig, dass wichtige Informationen an den Anfang gestellt werden oder ein echter Mehrwert durch das Scrollen entsteht. Sinnvoll ist auch bei langen Texten, ein Inhaltsverzeichnis mit Sprungmarken voranzustellen.
Der Bildbereich sollte außerdem nicht den ganzen Raum des „Above the fold“-Bereiches einnehmen, sondern nur so hochgestellt werden, dass weiterführender Inhalt oberhalb der „Falz“ beginnt. Die Produkte sollten mit dem Produkttitel und einer Kurzbeschreibung versehen werden, um den Schaufensterbereich optimal auszuschöpfen.
Im Jahre 2012 führte die Suchmaschine Google das Page-Layout-Algorithm-Update ein, welches das Verhältnis zwischen Inhalt und Ads im sichtbaren Bereich in den Fokus rückte. Seiten, deren Schwerpunkt sich auf die Schaltung von Werbebannern konzentriert, werden seitdem abgestraft.
Früher reichten ein einfacher Online-Auftritt und Linkbuilding-Methoden aus, um in den Suchergebnissen zu ranken. Heute stellt Google den User in den Vordergrund und versucht, dessen Bedürfnisse und Wünsche zu erfassen. Dazu gehört auch, dass Usersignale zu Suchergebnissen ausgewertet werden. Springt der Nutzer nach dem Klick auf seine Seite zurück in die Suchergebnisse und kehrt auch nicht wieder, ist dies ein negatives Signal an Google, das zu Rankingverlusten führen kann. Der Grund für ein solches Nutzerverhalten kann natürlich sehr vielfältig sein. Einer davon kann der erste Eindruck sein, den der User von einer Seite bekommt. Und der erste Eindruck wird immer über die Anzeige Above the Fold vermittelt.
Da Werbung an dieser Stelle eher zu einem negativen Nutzererlebnis führt, ist verständlich, dass Google hier eine Abwertung vornimmt. Werbebanner haben also einen direkten Einfluss auf das Ranking. User Signale hingegen wirken indirekt. Daher ist es wichtig, auch durch optische Merkmale zu überzeugen, die Google nicht direkt bewerten kann. Über die Farbwahl wird oft Einfluss auf die unbewusste Wahrnehmung der Nutzer genommen. Eine unglückliche Farbwahl und Gestaltung kann sich deshalb auch negativ auswirken.
Zusammenfassend lässt sich sagen, dass „Above the Fold“ der Beginn einer gut durchdachten Usability ist, die sich durch den ganzen Online-Shop beziehungsweise die Website ziehen sollte. Auch als Teil des Marketings ist das Schaufensterprinzip ein wichtiges Element.
Suchmaschinenoptimierung ist ein wichtiger Bestandteil der Webseitengestaltung. SEO muss im Zusammenhang mit der Usability und den wichtigsten Designelementen betrachtet werden. Im Vordergrund steht nicht mehr das reine Optimieren für Suchmaschinen, sondern für die Nutzer. Unter der Berücksichtigung der Nutzerfreundlichkeit (auch below the fold) und Suchmaschinenoptimierung kann ein gutes Website-Angebot entstehen.
Es ist wichtig, dem Website-Besucher Orientierungselemente an die Hand zu geben, mit denen er sich im Online-Angebot zurechtfinden kann. Je besser sich ein Nutzer auf der Webseite zurechtfindet, desto länger verweilt er auf dieser. Die Verweildauer stellt ein positives Signal für Suchmaschinen wie Google dar.
Zu den Orientierungselementen gehören sich wiederholende Designelemente und eine konsistente Beibehaltung der Corporate-Design-Richtlinien. Eine farbliche Hervorhebung des aktuellen Abschnitts in der Navigation kann zur Orientierung beitragen. Die Navigation sollte sich fortlaufend an der gleichen Stelle (möglichst weit oben) befinden. Suchfunktionen und Kontaktangaben müssen integriert sein.
Bei Webdesign Webseite oder eines Online-Shops sollte sich der Betreiber folgende Fragen stellen: Was würde ich als Kunde erwarten, wie stelle ich mir einen guten Auftritt vor?
Viele Website-Betreiber testen ihr Angebot an ausgewählten Zielgruppen, die gegen Bezahlung die Website für einen längeren Zeitraum ausprobieren. Bei einem größeren Online-Angebot lohnt sich diese Investition, da hier Schwachstellen schnell aufgedeckt werden können. Eine kleine Veränderung des Inhalts und der Struktur kann den Absatz der Produkte erhöhen.
Treten bei einem Online-Auftritt größere Probleme auf, die nicht einfach gelöst werden können, sollte ein Website-Betreiber die Hilfe von spezialisierten Agenturen in Anspruch nehmen. Die Usability und die Suchmaschinenoptimierung sind kein einfaches Unterfangen und erfordern eine fachkundige Vorgehensweise. Bei der richtigen Anwendung können sie zur Verbesserung der Wettbewerbsfähigkeit und Platzierung in den Suchergebnissen beitragen.
„*“ zeigt erforderliche Felder an
Ich bin dein erster Ansprechpartner:
Inhaber & Geschäftsführer
Marco Janck
Telefon:
030 | 9599987-20
E-Mail:
support@sumago.de
Adresse:
Motzener Str. 12-14
12277 Berlin
Schwerpunkte
