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
© Copyright 2024 ExpyDoc