Google Search Console - JS & CSS Benachrichtigung

Probleme mit dem Googlebot – So vermeidet man blockiertes JavaScript & CSS!

Ende Juli haben viele Webmaster über die Google Search Console (ehemals Google Webmaster Tools) Benachrichtigungen über blockierte JavaScript- und CSS-Dateien erhalten. Vor allem Webseiten, deren .js und .css Ressourcen über die Robots.txt gesperrt sind, erhielten diese Nachrichten in der Search Console. Dieses Vorgehen von Google basiert auf den Erweiterungen der Google Webmaster Richtlinien von Oktober 2014. Dort heißt es dazu:

„Damit Google die Inhalte Ihrer Website vollständig interpretieren kann, lassen Sie zu, dass alle Assets Ihrer Website, wie CSS- und JavaScript-Dateien, gecrawlt werden.“

Google Search Console - JS & CSS Benachrichtigung

Google Search Console – JS & CSS Benachrichtigung

In dieser Benachrichtigung heißt es:

„Google systems have recently detected an issue with your homepage that affects how well our algorithms render and index your content. Specifically, Googlebot cannot access your JavaScript and/or CSS files because of restrictions in your robots.txt file. These files help Google understand that your website works properly so blocking access to these assets can result in suboptimal rankings.“

Google möchte also Webseiten nicht mehr nur als Quelltext lesen, sondern auch wie ein Webseiten-Besucher rendern und betrachten. Oft werden .js und .css Dateien unbewusst durch Content Management Systeme oder serverseitig blockiert, was zu Problemen beim Rendering durch den Googlebot führt.

Wann kann es zu Problemen mit blockierten CSS- und JavaScript-Dateien und Suchmaschinen kommen?

Google veröffentlichte vor gut einem Jahr einen Artikel unter dem Titel „Understanding web pages better“, der erklärt, weshalb Google Webseiten zukünftig komplett rendern möchte und wo hierbei Probleme am häufigsten austreten können.

Die häufigsten Probleme treten demnach auf…

1. Wenn .js und .css Ressourcen in separaten Dateien beispielsweise über die Robots.txt Datei blockiert und damit nicht zum Abruf freigegeben sind, kann Google diese nicht crawlen und die Webseite somit auch nicht wie ein durchschnittlicher Besucher betrachten.

2. Wenn ein Webserver nicht in der Lage ist die Anzahl an Crawling-Anfragen für diese Ressourcen zu verarbeiten, kann das negative Auswirkungen auf das Rendering der Webseite durch Google haben. Ein Webserver sollte die Crawling-Anfragen von Google verarbeiten können, um diese Probleme beim Rendering zu vermeiden.

3. Wenn die Inhalte einer Webseite aufgrund von JavaScript nicht auf jedem Browser verfügbar sind, kann das für manche Suchmaschinen Probleme beim Rendern bedeuten. Jede Webseite sollte so erstellt werden, dass ihre Inhalte auch mit deaktiviertem JavaScript verfügbar sind. Besucher, deren Browser nicht über die notwendigen JavaScript-Anforderungen verfügen oder JavaScript nicht aktiviert haben, sollten die Inhalte der Webseite ebenfalls konsumieren können.

In Google Chrome kann man JavaScript ganz einfach über die Inhaltseinstellungen deaktivieren, um eine Webseite zu testen.

Google Chrome - JavaScript deaktivieren

Google Chrome – JavaScript deaktivieren

Für Firefox empfiehlt sich etwa das QuickJava Addon zur Deaktivierung von JavaScript.

4. Wenn der JavaScript Code sehr komplex geschrieben und aufgebaut wurde, ist es für Google schwer ihn korrekt zu verstehen, da auch Google mit zu komplexem JavaScript nicht immer korrekt umgehen kann. Dadurch könnte das Rendern der Webseite beeinträchtigt werden. Deshalb sollte Syntax der JavaScript-Funktionen sollte so einfach wie möglich aufgebaut sein.

5. Wenn Inhalte durch JavaScript entfernt oder versteckt werden, kann auch Google diese Inhalte nicht immer korrekt einlesen, bewerten und indexieren. Deshalb sollte jeder Inhalt (Text, Bild, Video, …) immer auch ohne JavaScript vollständig für Besucher und Suchmaschinen erreichbar sein. Ob alle Texte auf ohne JavaScript korrekt erreichbar sind, kann mit einem Textbrowser, wie Lynx, getestet werden.

Empfohlene Maßnahmen zur Optimierung von JavaScript- und CSS-Dateien

1. Überprüfe, ob der Googlebot alle JavaScript- und CSS-Dateien crawlen und rendern kann. Nutze dazu die Funktion Abruf wie durch Google in der Google Search Console. Diese Funktion ermöglicht das Abrufen der Webseite, um zu sehen wie Google diese Webseite rendert und betrachtet. So werden Darstellungsfehler durch blockierte JavaScript- oder CSS-Dateien, aber auch Indexierungsfehler und Crawling-Probleme, ausfindig gemacht.

Unter „Crawling > Abruf wie durch Google“ gibt man die URL der Webseite ein, die abgerufen und überprüft werden soll. Anschließend klickt man auf „Abrufen und Rendern“, um nicht nur den Quelltext der Seite abzurufen, sondern diese auch Rendern zu lassen. Klicke nun auf den Status, der angezeigt wird, um die gerenderte Version zu betrachten.

Google Search Console - Abruf wie durch Google

Google Search Console – Abruf wie durch Google

Nach dem Beheben der Konflikte mit blockierten JavaScript- und CSS-Dateien sollte die Webseite erneut abgerufen, überprüft und die Ergebnisse anschließend an Google übermittelt werden. So werden die Änderungen schneller in den Index übertragen.

Google Search Console - Rendering

Google Search Console – Rendering

2. Teste die robots.txt Datei in der Google Search Console, um gesperrte und blockierte Dateien, wie JavaScript, CSS oder Bilder, die das Rendering verhindern, zu finden.

Google Seach Console - Robots.txt testen

Google Seach Console – Robots.txt testen

Dieses Tool ermöglicht das Abrufen und Testen der Robots.txt Datei mit verschiedenen Crawling-Bots:

  • Googlebot
  • Googlebot-News
  • Googlebot-Image
  • Googlebot-Video
  • Googlebot-Mobile
  • Mediapartners-Google
  • Adsbot-Google

Um das Blockieren von .js und .css Dateien zu vermeiden, sollten in der Robots.txt Datei folgende Zeilen ergänzt werden:

User-agent: Googlebot
Allow: *.css
Allow: *.js

3. Prüfe die Webseite auf ihre mobile Kompatibilität. Der Test auf Optimierung für Mobilgeräte von Google ermöglicht es zu testen, ob Google die Webseite als mobilfähig bewertet oder nicht.

Test auf Optimierung für Mobilgeräte

Test auf Optimierung für Mobilgeräte

Um ein barrierefreies Rendern der mobilen Version einer Webseite zu ermöglichen, sollten alle in diesem Test aufgelisteten Fehler und Hinweise optimiert werden. Nutzt eine Webseite separate URLs für die Mobile- und Desktop-Version, so müssen beide Versionen separat getestet und optimiert werden.

Fazit

Google setzt vermehrt auf transparente Technik von Webseiten und möchte diese zukünftig noch besser verstehen und rendern. Der Googlebot will nicht mehr nur Quelltexte crawlen, sondern auch Webseiten wie durchschnittliche Besucher betrachten können. Aus diesem Grund ist es wichtig, dass vor allem die Inhalte einer Webseite immer erreichbar sind und barrierefrei abgerufen werden.