mobile Update

Google Kriterien für die Bewertung
mobil optimierter Webseiten
Google Kriterien für die Bewertung mobil optimierter Webseiten
Am 21. April hat Google damit begonnen ein neues Algorithmus Update auszurollen und die mobile
Optimierung als Rankingsfaktor einzuführen. Vier wichtige und kritische Punkte zum Update beleuchtet
unser Blogartikel unter http://www.projecter.de/blog/seo/mobilegeddon-kritisch-betrachtet.html.
Welche Maßnahmen zu ergreifen sind und anhand welcher Maßstäbe Google beurteilt, ob eine Seite mobil
optimiert ist, verrät die folgende Checkliste:
Zugriff auf Javascript, CSS und Bildressourcen gewähren
Um festzustellen, ob eine Seite mobil optimiert ist, wird Google diese
grafisch rendern. Das bedeutet man schaut sich nicht nur den Quelltext an,
sondern versucht die Seite aus Perspektive des Seitenbesuchers zu werten. Für
dieses Rendering braucht Google Zugriff auf Javascript, CSS und Bilddateien.
Der Test auf Optimerung für Mobilgeräte von Google zeigt, wie der Googlebot die
eigene Seite sieht. Weicht diese Darstellung stark von der Wirklichkeit ab, bedeutet
dies, dass Google nicht auf alle benötigten Informationen zugreifen kann. Hier muss
ein Programmierer ran und die Einstellungen des Webservers sowie der robots.txt
prüfen. Alternativ könnte eine Fehlinterpretation vorliegen, die ebenfalls unbedingt
aus dem Weg geräumt werden sollte.
Darstellbare Inhalte zur Verfügung stellen
Manche Videoplayer oder interaktiven Inhalte basieren auf Technologien, die von
Mobilgeräten kaum unterstützt werden. Diese Technologien wie bspw. Adobe Flash
sind zu vermeiden und durch den HTML 5 Standard zu ersetzen. Youtube arbeitet
bspw. mittlerweile standardmäßig mit dieser Technologie im embed-Code.
Darstellungsbereich konfigurieren
Mobile Browser haben sich im Lauf der Zeit an schlecht optimierte Webseiten
angepasst. In der Regel werden Webseiten stark verkleinert geladen, damit die Seite
zunächst vollständig sichtbar wird. Bei responsive und mobil optimierten Seiten
ist das nicht notwendig. Mit dem Meta-Tag viewport kann dem Browser mitgeteilt
werden, von welcher Seitenbreite er auszugehen hat. Außerdem kann festgelegt
werden, in welchem Verhältnis Bildschirmpixel und definierte CSS Pixel skaliert
werden sollen. Sehr schöne Erläuterungen zur Umsetzung stellt html5-mobile.de
zur Verfügung: http://html5-mobile.de/blog/meta-viewport-fuer-mobile-anpassen
2
Touchelemente bedienbar halten
Damit Links auch auf Touchgeräten bedient werden können, sollten sie
mindestens 48 CSS-Pixel breit oder hoch sein. Weniger wichtige Links dürfen auch
kleiner sein, sollten dann aber mindestens einen Abstand von 5mm bzw.
32 CSS-Pixeln einhalten. Optimale Bedienung laut Google bedeutet, dass keine
Tools wie Pop-up Lupen von Nöten sind, um Links zielsicher anzutippen.
Konkrete Auskunft zu diesem Thema gibt Google hier:
https://developers.google.com/speed/docs/insights/SizeTapTargetsAppropriately
Welche Links Google für kritisch erachtet verrät der PageSpeed Insights Report.
(Meldung Optimale Größe von Links oder Schaltflächen auf Mobilgeräten einhalten):
https://developers.google.com/speed/pagespeed/insights/
Lesbare Schriftgrößen einrichten
Der Text einer mobilen Seite muss ohne Zoom gut lesbar sein. Das bedeutet,
dass der Zeilenabstand idealerweise auf 1,2 fache (1,2 em) vergrößert und der
wichtige Textanteil eine Schriftgröße von mindestens 16px aufweist. Damit diese
CSS Pixel auch in der richtigen Größe dargestellt werden, ist die Definition des
Darstellungsbereichs unabdingbar (s. oben).
Welche Textanteile Google als kritisch erachtet verrät der Google Pagespeed
Insights Report (Meldung: „ Lesbare Schriftgrößen verwenden“)
https://developers.google.com/speed/pagespeed/insights/
Vermeidung von horizontalem Scrollen
Google ist der Ansicht, dass Nutzer vertikal gut scrollen können, horizontal nicht.
Ganz unrecht hat man damit nicht, denn Seiten, die man auf dem Mobiltelefon
nicht in eine Richtung wischen kann, lassen sich wirklich besser bedienen. Ist ein
Darstellungsbereich konfiguriert, der zu klein für die Mindestbreite der Webseite
ist, kommt der Nutzer um das horizontale Scrollen nicht herum. Dies ist zu
vermeiden, indem es keine Mindestbreite gibt bzw. die Inhalte im Zweifelsfall
kleinskaliert werden. Hier ist jedoch zu beachten, dass auch dann Texte noch
lesbar und Link antippbar bleiben müssen.
Nähere Infos zu diesem Thema gibt Google hier:
https://developers.google.com/speed/pagespeed/insights/
3
Korrekte Benutzerführung
Wird für die mobilen Seiten eine separate URL zur Verfügung gestellt, muss der
Nutzer mit Mobilgerät korrekt weitergeleitet werden. Es ist sehr frustrierend, wenn
www.shop.de/braunes-sofa aufgerufen wird, der mobile Nutzer jedoch auf die
mobile Startseite m.shop.de weitergeleitet wird.
Ebenfalls negativ wertet Google, wenn von der mobilen Version viele Links auf die
Desktopversion verweisen, denn auch das beeinträchtigt die Nutzererfahrung. Ein
einzelner Link auf jeder Seite, um auf Wunsch zur Desktopversion zu wechseln,
sollte jedoch nicht schaden.
Ladezeiten beachten!
Das Optimum an Ladezeit laut Google ist erreicht, wenn der Nutzer nach einer
Sekunde den ersten sichtbaren Anteil der Webseite vollständig sehen kann.
Aufgrund hoher Latenzzeiten bei langsamen mobilen Internetverbindungen, muss der
Server besonders schnell reagieren und nur die notwendigsten Informationen an das
Endgerät schicken. Ist der erste Teil der Webseite geladen, können im Anschluss
weitere Teile nachgeladen werden, ohne dass der Nutzer das Gefühl hat, warten zu
müssen.
Eine erste Übersicht zu den relevanten Faktoren der Ladezeit fasst Google auf
dieser Seite zusammen: https://developers.google.com/speed/docs/insights/mobile
Achtung: Die Ladezeit ist ein wichtiger Rankingfaktor, beeinflusst jedoch nur bei
extremen Ladezeiten Googles Urteil über die mobile Optimierung.
Zu beachten ist, dass Google für jede Unterseite einzeln festlegt, ob diese den mobilen Kriterien
entspricht. Es ist gut möglich, dass nur ausgewählte Seiten bei der Überprüfung von Linkabständen,
Textgrößen etc. durchfallen. In den Google Webmaster Tools werden alle URLs aufgelistet, die den
grundlegenden Kriterien nicht entsprechen. Diese können dann wunderbar mit dem PageSpeed Insights
Tool sowie dem Test auf Optimierung für Mobilgeräte überprüft werden. Für jede Unterseite gibt Google
damit Auskunft, welche Seitenbestandteile noch nicht optimal sind.
Das Positive am Update ist, dass bei jedem Besuch des Google Bots neu beurteilt wird, ob die Seite
den mobilen Kriterien entspricht. Hier gibt es einen entscheidenden Unterschied zu früheren Updates
wie bspw. Penguin, wo man teilweise Monate warten musste, bis Google die Bereinigung des Linkprofils
honoriert hat. Änderungen am Layout wirken sich somit zeitnah in der Bewertung durch den Algorithmus
aus.
4
Wichtige Tools zur Überprüfung von mobilen Webseiten:
Check einzelner Unterseiten auf Mobilfreundlichkeit
https://www.google.de/webmasters/tools/mobile-friendly/
Google Check einzelner Unterseiten auf Speed- und Layoutprobleme
https://developers.google.com/speed/pagespeed/insights/
Auflistung aller URLs, die lt. Google bestimmte Kriterien nicht erfüllen
https://www.google.com/webmasters/tools/mobile-usability/
Tool des W3 Konsortiums, um Quellcode auf Fehler zu prüfen
http://validator.w3.org/mobile/
Weitere wichtige Google Ressourcen zum Thema mobile:
Ankündigung der Algorithmusänderung
http://googlewebmastercentral-de.blogspot.de/2015/02/mehr-fuer-mobilgerate-optimiertesuchergebnisse.html
Ankündigung des Hinweises „Für Mobilgeräte“ in den Suchergebnissen
http://googlewebmastercentral-de.blogspot.de/2014/11/suche-nach-websites-fuermobilgeraete.html
Umfassende Hinweise, wie Mobilseiten optimiert werden müssen
https://developers.google.com/webmasters/mobile-sites/mobile-seo/index.html?hl=de
Hinweise zur korrekten Umsetzung eines responsiven Layouts
https://developers.google.com/web/fundamentals/layouts/rwd-fundamentals/
Anleitungen von Google, um Drittanbietersoftware zu optimieren:
https://developers.google.com/webmasters/mobile-sites/website-software/
5
www.projecter.de
39