Hier findest du alle Neuigkeiten und Informationen von der Google I/O 2019.
Bei der Google I/O 2019 haben wir spannende Neuigkeiten zu dieser neuen Entwicklung für die Google Suche vorgestellt.
In diesem Beitrag konzentrieren wir uns auf Best Practices, mit denen JavaScript-Web-Apps in der Google Suche gefunden werden können. Dazu gehören:
- Der neue Evergreen-Googlebot
- Googlebot-Pipeline für Crawling, Rendering und Indexierung
- Funktionserkennung und Fehlerbehandlung
- Renderingstrategien
- Testtools für deine Website in der Google Suche
- Häufige Herausforderungen und mögliche Lösungen
- Best Practices für SEO in JavaScript-Webanwendungen
Der Evergreen-Googlebot
Dieses Jahr haben wir den mit Spannung erwarteten Evergreen-Googlebot angekündigt.
Der Googlebot verwendet jetzt eine moderne Chromium-Engine, um Websites für die Google Suche zu rendern. Darüber hinaus werden wir neuere Versionen von Chromium testen, um den Googlebot auf dem neuesten Stand zu halten. Dies geschieht normalerweise innerhalb weniger Wochen nach jeder stabilen Chrome-Version. Diese Ankündigung ist eine wichtige Neuigkeit für Webentwickler und SEOs, da sie die Ankunft von mehr als 1.000 neuen Funktionen wie ES6 und höher, IntersectionObserver und Web Components v1 im Googlebot markiert.
So funktioniert der Googlebot
Der Googlebot ist eine Pipeline mit mehreren Komponenten. Sehen wir uns an, wie der Googlebot Seiten für die Google Suche indexiert.
Der Vorgang läuft wie folgt ab:
- Der Googlebot stellt URLs zum Crawlen in die Warteschlange.
- Anschließend werden die URLs mit einer HTTP-Anfrage basierend auf dem Crawling-Budget abgerufen.
- Der Googlebot scannt den HTML-Code nach Links und stellt diese zum Crawlen in die Warteschlange.
- Anschließend stellt der Googlebot die Seite zum Rendern in die Warteschlange.
- Eine monitorlose Chromium-Instanz rendert die Seite so schnell wie möglich. Dies beinhaltet auch die JavaScript-Ausführung.
- Der Googlebot verwendet den gerenderten HTML-Code, um die Seite zu indexieren.
Ihre technische Einrichtung kann das Crawling, Rendering und die Indexierung beeinflussen. Langsame Antwortzeiten oder Serverfehler können sich beispielsweise auf das Crawling-Budget auswirken. Ein weiteres Beispiel wäre, dass JavaScript zum Rendern der Links erforderlich wäre. Dies kann dazu führen, dass die Erkennung dieser Links länger dauert.
Funktionserkennung verwenden und Fehler beheben
Der Evergreen-Googlebot hat viele neue Funktionen, aber einige werden noch nicht unterstützt. Wenn Sie auf nicht unterstützte Funktionen angewiesen sind oder Fehler nicht richtig verarbeiten, kann der Googlebot Ihre Inhalte nicht rendern oder indexieren.
Sehen wir uns ein Beispiel an:
<body>
<script>
navigator.geolocation.getCurrentPosition(function onSuccess(position) {
loadLocalContent(position);
});
</script>
</body>
In einigen Fällen werden auf dieser Seite möglicherweise keine Inhalte angezeigt, da der Code nicht verarbeitet wird, wenn der Nutzer die Berechtigung ablehnt oder wenn der getCurrentPosition-Aufruf einen Fehler zurückgibt. Der Googlebot lehnt Berechtigungsanfragen wie diese standardmäßig ab.
Dies ist die bessere Lösung:
<body>
<script>
if (navigator.geolocation) {
// this browser supports the Geolocation API, request location!
navigator.geolocation.getCurrentPosition(
function onSuccess(position) {
// we successfully got the location, show local content
loadLocalContent(position);
}, function onError() {
// we failed to get the location, show fallback content
loadGlobalContent();
});
} else {
// this browser does not support the Geolocation API, show fallback content
loadGlobalContent();
}
</script>
</body>
Wenn Sie Probleme bei der Indexierung Ihrer JavaScript-Website haben, lesen Sie unsere Anleitung zur Fehlerbehebung.
Die richtige Rendering-Strategie für Ihre Web-App auswählen
Die standardmäßige Renderingstrategie für einseitige Apps ist aktuell das clientseitige Rendering. Der HTML-Code lädt das JavaScript, das dann während der Ausführung den Inhalt im Browser generiert.
Sehen wir uns eine Webanwendung an, die eine Sammlung von Katzenbildern zeigt und JavaScript verwendet, um vollständig im Browser zu rendern.
Wenn Sie Ihre Rendering-Strategie kostenlos wählen können, ziehen Sie das serverseitige oder Pre-Rendering in Betracht. Sie führen JavaScript auf dem Server aus, um den anfänglichen HTML-Inhalt zu generieren. Dadurch kann die Leistung sowohl für Nutzer als auch für Crawler verbessert werden. Diese Strategien ermöglichen es dem Browser, mit dem Rendern von HTML zu beginnen, sobald dieser über das Netzwerk eingeht, wodurch die Seite schneller geladen wird. In der Rendering-Sitzung auf der I/O oder im Blogpost zum Rendering im Web wird gezeigt, wie das serverseitige Rendering und die Hydration die Leistung und Nutzerfreundlichkeit von Webanwendungen verbessern können. Außerdem findest du weitere Codebeispiele für diese Strategien.
Wenn du Crawlern helfen möchtest, die kein JavaScript ausführen, oder keine Änderungen an deiner Front-End-Codebasis vornehmen kannst, kannst du das dynamische Rendering in diesem Codelab ausprobieren. Im Vergleich zum serverseitigen oder Pre-Rendering werden die Nutzererfahrung und die Leistung jedoch nicht optimiert, da beim dynamischen Rendering nur statisches HTML für Crawler bereitgestellt wird. Es ist also keine langfristige Strategie, sondern eine Notlösung.
Seiten testen
Auch wenn die meisten Seiten problemlos mit dem Googlebot funktionieren, empfehlen wir Ihnen, Ihre Seiten regelmäßig zu testen, um sicherzustellen, dass Ihre Inhalte für den Googlebot verfügbar sind und keine Probleme auftreten. Dafür gibt es mehrere großartige Tools.
Am einfachsten lässt sich eine Seite mit dem Test auf Optimierung für Mobilgeräte schnell überprüfen. Sie zeigt nicht nur Probleme mit der Optimierung für Mobilgeräte, sondern auch einen Screenshot des ohne Scrollen sichtbaren Inhalts und des gerenderten HTML-Codes aus Sicht des Googlebots.
Sie können auch herausfinden, ob es Probleme beim Laden von Ressourcen oder JavaScript-Fehler gibt.
Wir empfehlen, Ihre Domain in der Google Search Console zu bestätigen. So können Sie mit dem URL-Prüftool mehr über den Crawling- und Indexierungsstatus einer URL erfahren, Nachrichten erhalten, wenn die Search Console Probleme erkennt, und weitere Informationen zur Leistung Ihrer Website in der Google Suche erhalten.
Allgemeine Tipps und Anleitungen zur Suchmaschinenoptimierung finden Sie in den SEO-Prüfungen in Lighthouse. Verwenden Sie die Lighthouse-Befehlszeile oder den Lighthouse CI-Bot, um SEO-Prüfungen in Ihre Testsuite zu integrieren.
Diese Tools helfen dir dabei, Probleme mit Seiten in der Google Suche zu erkennen, zu beheben und Fehler zu beheben. Sie sollten Teil deiner Entwicklungsroutine sein.
Auf dem Laufenden bleiben und Kontakt aufnehmen
Aktuelle Informationen zu Ankündigungen und Änderungen an der Google Suche finden Sie in unserem Webmasters-Blog, dem YouTube-Kanal für Google Webmasters und unserem Twitter-Konto. Weitere Informationen zu SEO und JavaScript finden Sie auch in unserem Entwicklerleitfaden für die Google Suche und in unserer Videoreihe „JavaScript SEO“.