print logo
- Anzeige -

Mobile First Indexing - Was Webseitenbetreiber jetzt beachten sollten

Um Ihre Webseite bestmöglich für mobile Ausgabegeräte zu optimieren, sollten Sie diese Fehlerquellen möglichst vermeiden.
OnPage.org GmbH | 07.12.2016

Immer mehr Menschen nutzen Smartphones und Tablets, um damit im Internet zu surfen. So nutzte 2014 in Deutschland schon mehr als die Hälfte der Bevölkerung das Internet mobil [1]. Darüber hinaus umfasst die mobile Suche in manchen Branchen bereits mehr als die Hälfte aller Suchanfragen.

Google reagierte auf diese Entwicklung mit zwei zentralen Neuerungen: 2015 wurde die Mobilfreundlichkeit als offizieller Rankingfaktor eingeführt und im Oktober 2016 hat die Umstellung auf einen Mobile-First Index, also einen durch mobile Websites geprägten Index, begonnen. Wenn Sie bei der Mobilen Indexierung mit Ihrer Webseite erfolgreich bleiben wollen, sollten Sie nun handeln. Dieser Beitrag gibt Tipps für die mobile Optimierung und zeigt häufige Fehlerquellen auf.

Hintergrund


Der 21. April 2015 galt für viele Webmaster als einschlägiges Datum, denn zu diesem Zeitpunkt führte Google die Eignung von Webseiten für mobile Endgeräte als offizielles Rankingkriterium ein. Mit einher ging das Mobile Friendly Update, das mit dem markanten Schlagwort "Mobilegeddon" versehen wurde. Schon einen Monat nach dem Mobile Update erlitten einige Webseiten deutliche Rankingverluste in den mobilen SERPs [2]. Google legte fast genau ein Jahr später noch einmal nach und passte das Mobile Update an [3]. Damit war der Grundstein gelegt, dass die Mobile Optimierung endgültig zum wichtigen Rankingfaktor für Webseiten wurde.

Im Oktober 2016 folgte schließlich der nächste logische Schritt, bei dem Google den mobilen Index als primären Index für die Suchmaschine definierte [4]. In der Ankündigung im Google Webmaster Central Blog heißt es folgendermaßen:

“Es wird auch künftig nur einen einzigen Suchindex aus Websites und Apps geben, aber unsere Algorithmen werden dann vor allem auf die mobile Version einer Website zurückgreifen, um das Ranking ihrer Seiten zu ermitteln, strukturierte Daten zu erfassen und Snippets dieser Seiten in den Ergebnissen zu zeigen.” (Doantam Phan, Google) [5]

Was jetzt zu tun ist: Technical Setup

Google hat in seiner Ankündigung vom 15. November 2016 [6] erklärt, dass Webseiten auch weiterhin gecrawlt werden, wenn sie nur als Desktop-Version vorliegen. Dennoch sollten Webmaster reagieren und ihre Webseite mobil ausrichten.

Responsive Webdesign

Empfehlenswert ist die Umsetzung der mobilen Optimierung im Responsive Design. Diese Technik wird auch von Google empfohlen, unter anderem weil hierbei nur eine URL für alle Endgeräte verwendet wird. Die Webseite wird durch CSS an die jeweilige Bildschirmgröße des Ausgabegeräts angepasst.

Responsive Webdesign hat den Vorteil, dass Sie nur ein CMS pflegen müssen und die Inhalte für die mobile Version sowie für die Desktop-Version die gleichen sind.

Wichtig ist, dass beim Responsive Webdesign der sogenannte Viewport-Metatag verwendet wird. Dadurch wird die Webseite exakt an das Display des Endgeräts angepasst.

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Mit dem Tag “width” definieren Sie die Breite des Bildschirms. Ergänzt mit „device-width“ bedeutet die Angabe, dass die Webseite sich an den Bildschirm des Geräts anpassen soll. Mit Hilfe der „initial-scale“ wird angeben, wie stark der Zoomfaktor maximal sein darf. Als Standard wird der einfache Zoomfaktor von 1 gesetzt.

Neben Responsive Webdesign gibt es noch weitere Möglichkeiten der mobilen Optimierung:

Dynamic Serving

Beim Dynamic Serving wird ähnlich wie beim Responsive Design nur eine URL für die mobile Ansicht und die Desktop-Version verwendet. Allerdings liefert der Server auf den User-Agent zugeschnittenen HTML- und CSS-Code aus. Der Unterschied besteht also darin, dass der Server den Quellcode so ausgibt, dass er auf den User-Agent des Endgerätes zugeschnitten ist.

Separate, mobile URL

Manche Webseiten nutzen eine Subdomain oder eine separate Domain für ihre mobile Version. Hier ist der Verwaltungsaufwand höher, da in der Regel zwei verschiedene HTML-Codes gepflegt werden müssen.

3 Praxis-Tipps für Webmaster

Damit eine Webseite für mobile Endgeräte geeignet ist, sind verschiedene Gegebenheiten zu berücksichtigen: Der mobile Bildschirm ist meist kleiner, die Webseite wird per Touchscreen bedient und die Datenverbindung ist oftmals langsamer.

Aus diesen Erfordernissen ergeben sich folgende wichtige Aspekte der mobilen Optimierung:

1. Ladezeiten optimieren

Die Ladezeit einer Webseite wird sowohl durch die Geschwindigkeit der Internetverbindung, als auch durch die zu ladende Datenmenge bestimmt. Darüber hinaus kann auch die Optimierung des Servers zur Verringerung der Ladezeit beitragen.

Bilder komprimieren: Grafiken oder Fotos sollten mit einem gängigen Bildbearbeitungsprogramm komprimiert werden. Dadurch muss der Client eine geringere Datenmenge beim Seitenaufruf laden. Auch wenn LTE bereits in vielen Regionen verbreitet, ist, können viele unkomprimierte Bilddateien das Laden der mobilen Webseite deutlich verzögern.

Wichtig ist außerdem bei der Verwendung von Bildern, dass sie in relativen Größen eingebunden werden. Auf diese Weise können sich Bilder verlustfrei an das Display des jeweiligen Ausgabegeräts anpassen.

Komprimieren der Webseite: Wird die Webseite auf einem Apache-Server gehostet, sollte das gzip- sowie das deflate-Modul genutzt werden. Auf diese Weise kann die gesamte Dateigröße der Webseite verringert werden.
Noch mehr hilfreiche Tipps zur Optimierung der Ladezeit finden Sie in diesem umfangreichen Tutorial.


Abbildung 1: Test auf Optimierung für Mobilgeräte von Google

2. UX (User Experience)


Mobile Webseiten werden über ein Touchdisplay bedient. Dies sollten Sie bei der Umsetzung der mobilen Version Ihrer Webseite berücksichtigen.

Touchelemente und Schaltflächen prüfen: Damit mobile Webseiten problemlos mit dem Smartphone oder Tablet genutzt werden können, sollten Touch-Elemente mindestens 7 Millimeter hoch sein. Dabei wird von einer durchschnittlichen Fingerbreite von 10 Millimetern ausgegangen.

Der Abstand zwischen den einzelnen Bedienelementen sollte darüber hinaus mindestens 5 Millimeter betragen.

3. Mobile Textoptimierung


Während Webseiten auf Desktops viel Platz für Texte ausschöpfen können, ist der Platz auf Handybildschirmen deutlich begrenzter. Diese Tatsache sollten Sie bei der Textgestaltung beachten.

Relative Schriftgrößen verwenden: Die Schriftgröße sollte immer relativ angegeben werden. Auf diese Weise können sich Textgrößen immer an den jeweiligen Bildschirm anpassen. Empfehlenswert ist eine Basisgröße von 16 Pixeln für Schriften. Wenn Sie weitere Schriften verwenden, werden diese dann per CSS ins Verhältnis zur Basisschriftgröße gesetzt.

Inhaltliche Optimierung: Für die mobile Textoptimierung gilt umso mehr, dass die Inhalte klar und verständlich präsentiert werden. Hierzu gehören strukturierende Zwischenüberschriften ebenso wie logische und sinnvolle Absätze. Auch wenn diese Regeln grundsätzlich für Webcontent gelten, sind sie für die mobile Optimierung umso wichtiger.

Häufige Fehler bei der mobilen Optimierung

Um Ihre Webseite bestmöglich für mobile Ausgabegeräte zu optimieren, sollten Sie die folgenden Fehlerquellen möglichst vermeiden.

Fehler: Sie blockieren den Abruf wichtiger CSS-, JavaScript- oder Bilddateien durch den Googlebot.
Lösung: Stellen Sie mit Hilfe der robots.txt-Datei sicher, dass alle wichtigen Bereiche Ihrer Webseite gecrawlt werden können. Sie können Ihre robots.txt-Datei zum Beispiel mit Hilfe der Google Search Console überprüfen. Auch OnPage.org bietet Ihnen die Möglichkeit, die robotst.txt Ihres Webprojekts kontinuierlich zu überwachen.

Fehler: Inhalte können nicht mobil abgerufen werden, weil Flash verwendet wird.
Lösung: Grundsätzlich sollten Sie Flash-Inhalte auf mobil optimierten Webseiten vermeiden. Nutzen Sie zum Beispiel stattdessen Animationen in HTML5 oder verwenden Sie iframes.

Fehler: Der Nutzer wird nicht korrekt auf die mobile Webseite weitergeleitet.
Lösung: Wenn Sie responsive Webdesign verwenden, besteht diese Gefahr nicht. Sollte Ihre mobile Webseite eine andere URL haben als Ihre Desktop-Version, prüfen Sie am besten genau, dass jeder Desktop-URL genau eine mobile URL entspricht. Gibt es nicht für jede Desktop-URL eine mobile Version, sollten Sie auf eine Weiterleitung verzichten und stattdessen nur die Desktop-Version ausgeben.

Mobile Friendliness mit OnPage.org prüfen

Mit OnPage.org Focus haben Webmaster die Möglichkeit, einzelne URLs hinsichtlich ihrer Mobilfreundlichkeit zu prüfen.

In der Einzelseitenanalyse werden wichtige Metriken einzelner URLs in einer ganzheitlichen Echtzeit-Analyse überprüft. Wie ein digitaler Assistent, zeigt das Tool dabei Hinweise zu akuten Fehlern auf der Webseite auf. Im Abschnitt „Mobile“ werden alle zentralen Punkte der mobilen Optimierung angezeigt. Mit nur einem Klick wissen Sie somit, ob Ihre Webseite für mobile Geräte geeignet ist und ob Fehler vorliegen.


Abbildung 2: Mobilfreundlichkeit mit OnPage.org Focus testen.

Fazit

Die Mobile Optimierung wird in Zeiten des Mobile First Indexing zum zentralen Optimierungsansatz für Webmaster. Berücksichtigen Sie bei der Gestaltung Ihrer Webseiten deshalb, dass ein Großteil der Nutzer Ihre Inhalte mit einem mobilen Endgerät konsumieren wird. Wenn Sie dabei gängige Fehler vermeiden und die Besonderheiten der mobilen Nutzung als Basis für die Webseitengestaltung nehmen, haben Sie schon die wichtigste Voraussetzung für Ihren Erfolg im mobilen Web geschaffen.

Weitere Informationen unter https://de.onpage.org


Quellen
[1] https://de.statista.com/statistik/daten/studie/197383/umfrage/mobile-internetnutzung-ueber-handy-in-deutschland/
[2]https://www.stonetemple.com/mobilegeddon-may-have-been-bigger-than-we-thought/
[3] https://de.onpage.org/blog/google-mobile-update-die-schrauben-werden-nachgezogen
[4] https://webmaster-de.googleblog.com/2016/11/mobile-first-indexierung.html
[5] https://webmaster-de.googleblog.com/2016/11/mobile-first-indexierung.html
[6] https://webmaster-de.googleblog.com/2016/11
/mobile-first-indexierung.html