Skip to main content

Wir haben ├╝ber 200 Domains inklusive aller auf der Startseite verlinkten URLs gecrawlt und die Unterschiede zwischen dem gerenderten HTML und dem Original-Quelltext untersucht. Die Ergebnisse und einige Beispiele findet ihr in diesem Beitrag.

Unterschiede zwischen den beiden HTML-Versionen k├Ânnen, gerade bei gr├Â├čeren Webseiten, eine Rolle bei der Indexierung spielen und sollten daher bei der Optimierung ber├╝cksichtigt werden.

96% der gecrawlten Domains haben Unterschiede zwischen dem gerenderten HTML und dem Original-Quelltext.

96% der gecrawlten Domains haben Unterschiede in SEO-relevanten Bereichen wie Text, internen Links, Title- oder Meta-Tags. Dabei wies jedoch h├Ąufig nicht jede Unterseite der Domains Unterschiede zwischen den beiden Versionen auf – insgesamt waren┬á56% der gecrawlten URLs betroffen.

Bei 81 (ca. 35%)  der gecrawlten Domains weisen nur Unterseiten und nicht die Startseite Unterschiede zwischen dem gerenderten HTML und dem Original-Quelltext auf.

Unterschiede nach Bereichen

Die meisten Unterschiede gab es in den Bereichen zus├Ątzlicher Text und zus├Ątzliche Inhalte. Das macht auch Sinn, da dynamische Inhalte ├╝ber Javascript in das DOM geladen werden. Auff├Ąllig ist auch, dass es viele Domains gibt, bei denen Links durch Javascript aus dem DOM entfernt werden. Unterschiede in Title-, Canonical- oder Robots-Tags sind bei weniger Domains zu finden.

Interne Verlinkung & JavaScript-Rendering

Auf fast allen gecrawlten Seiten gab es zus├Ątzliche Links im JS-gerenderten HTML. Wenn man sich die Top-Seiten anschaut, werden teilweise fast 3.000 Links je Unterseite hinzugef├╝gt. Hier kann man davon ausgehen, dass die gesamte Hauptnavigation haupts├Ąchlich im Javascript-gerenderten HTML verf├╝gbar ist.

W├╝rde Google diese Links nicht ber├╝cksichtigen, w├╝rden viele Strukturen und Unterseiten im Index fehlen. Daher macht es Sinn, dass Google schon seit l├Ąngerer Zeit die meisten Seiten rendert und immer mehr Bem├╝hungen anstellt, wirklich alle gecrawlten Seiten auch zu rendern und die per JS eingef├╝gten Links zu werten. Schon 2017 hat John M├╝ller auf die Frage geantwortet, ob ein Link der per JavaScript hinzugef├╝gt wird, genau so PageRank vererbt wie ein Link im normalen HTML:

A link is a link, regardless of how it comes to the page. It wouldn’t really work otherwise.

John M├╝ller, https://s.viu.one/013fc

Wir haben einige F├Ąlle gefunden, bei denen Links, die der User sieht, nicht im gerenderten HTML f├╝r Google auftauchen.

Ein Grund daf├╝r ist, dass bestimmte Links erst bei einem Mouseover-Event in das gerenderte HTML geschrieben werden. Im Original-Quelltext und im gerenderten HTML (ohne Interaktion) sind die Links nicht vorhanden. Soweit bekannt f├╝hrt der Googlebot aktuell keine Mouseover-Events aus – Daher ist diese Art von Links f├╝r Google nicht „sichtbar“.

Ein Beispiel hierf├╝r aus unserem Crawl ist auf rebuy.de zu finden – In diesem kurzen Video kann man gut nachvollziehen, dass die Links erst nach dem Mouseover-Event auftauchen (Beispiel iPhone XS Max aus dem Hauptmen├╝):

Wenn man also sichergehen will, dass Links bereits im gerenderten HTML vorhanden sind, sollte man sich das gerenderte HTML vor jeglicher Nutzer-Interaktion anschauen.

 

Ein weiterer Grund f├╝r im durch Google gerenderten HTML fehlende Links kann sein, dass Requests durch die robots.txt-Datei geblockt werden, die zum Rendern der Navigation ben├Âtigt werden. Das k├Ânnen Requests nach JavaScript-Assets sein, ohne die die Navigation nicht funktioniert, oder auch Ajax-Quellen, die f├╝r die Navigation ben├Âtigt werden.

Ein Beispiel aus unserem Crawl ist auf klingel.de zu finden – Hier wird zum laden des Hauptmen├╝s auf Unterseiten ein Ajax-Request an den Server gesendet, der die Kategorien zur├╝ckliefert. Sobald dieser geblockt ist, funktioniert die Navigation nicht mehr:

Testen kann man das z.B. mit der Chrome Extension Asset Swapper – Einfach den entsprechenden Request auf einen 404 laufen lassen.

 

Auf der Startseite sind bei klingel.de die Links auch ohne den Ajax-Call vorhanden – Hier werden die Daten f├╝r die Navigation direkt im HTML-Quelltext mit ├╝bergeben.

 

Und dann gibt es noch die F├Ąlle, bei denen Links aus dem gerenderten HTML entfernt werden.

Hier wird das Link-Element aus dem DOM komplett gel├Âscht – und nicht nur ausgeblendet.

 

Bei mediamarkt.de beispielsweise werden Links der Hauptnavigation, die im Original-HTML vorhanden waren, auf Unterseiten gel├Âscht:

Google wird die Links im Original-HTML in diesem Fall finden. Wie Google jetzt aber mit dem Signal umgeht, dass ein Link scheinbar f├╝r den Nutzer nicht relevant ist und gel├Âscht wird, ist aktuell nicht bekannt. Man kann aber davon ausgehen, dass Google diese Information in irgendeiner Weise ber├╝cksichtigt.

Ob die Strukturen aus den Beispielen f├╝r die interne Verlinkung ggf. genau so gewollt sind, ist schwer zu sagen. Wichtig ist nur, dass man solche Einfl├╝sse bei der Optimierung ber├╝cksichtigt.

Zus├Ątzliche Inhalte

Im Bereich der Inhalte gibt es viele Domains, die im gerenderten HTML zus├Ątzliche Inhalte enthalten.

 

Bei einigen davon ist es haupts├Ąchlich der Inhalt des Consent-Banners. Im Beispiel von wetter.com wird durch den Consent-Banner sehr viel Datenschutztext per JavaScript geladen. Hier sollte man aufpassen, dass zu viele solcher Inhalte nicht den relevanten Inhalt verw├Ąssern, falls Google die Boilerplate nicht sauber erkennt.

In den von uns untersuchten Beispielen, bei denen relevanter Text nachgeladen wird, wurde dieser auch durch Google indexiert.

Änderungen in Title Tags

Schaut man sich die Domains an, die unterschiedliche Title Tags, haben f├Ąllt lidl.de ins Auge:

 

Hier wird der Title-Tag per JavaScript optimiert. Wenn man sich die Ergebnisse in Google ansieht, kann man erkennen, dass Google hier dieTitel-Tags aus dem gerenderten HTML ├╝bernimmt.

Bing verwendet hingegen den Title-Tag aus dem Original-Quelltext:

Wenn man also Title-Tags per JavaScript ├Ąndert oder setzt, sollte man sich bewusst sein, dass andere Suchmaschinen evtl. noch nicht so weit sind. Auch wenn man gro├če Webseiten hat kann es sein, dass Google nicht alle Unterseiten rendert und f├╝r einzelne Seiten dann den Title-Tag aus dem Original-Quelltext verwendet.

Ge├Ąnderte Canonical- & Robots-Tags

Bei Canonical- und Robots-Tags gab es in unserer Studie nur wenige Domains, die Unterschiede zwischen dem gerenderten HTML und dem Original-Quelltext aufwiesen.

 

Auff├Ąllig war, das saturn.de auf der Privacy-Seite im gerenderten HTML ein „noindex“ hat und im Original-Quelltext gar keinen Robots-Meta-Tag. Die Seite wird bei Google im Index aber gelistet. In dem Fall scheint Google den „noindex“ aus dem gerenderten HTML nicht zu ber├╝cksichtigen.

Vorsicht ist auch geboten, wenn durch ein JavaScript der Head-Bereich ver├Ąndert oder fr├╝hzeitig geschlossen wird. Dadurch kann der Canonical-Tag ausserhalb des Heads stehen, wodurch er nicht mehr ber├╝cksichtigt wird, falls der Tag nur im gerenderten HTML vorkommt.

 

Fazit

Kaum eine Webseite kommt heute noch ohne komplexes JavaScript aus, was auch direkte Auswirkungen auf die Art & Weise hat, wie Google eine Webseite sieht.

Zusammengefasst kann man sagen, dass das Thema JavaScript-Rendering noch einen weitere Ebenean Komplexit├Ąt in die Arbeit eines SEOs bringt. Speziell bei der internen Verlinkung sind dort verschieden Fallstricke drin, die sich nur sehr langsam bemerkbar machen. Aber auch die anderen Bereiche sollte man im Auge behalten. Ggf. kann man die M├Âglichkeiten, die das JS-Rendering mitbringt, auch zur Optimierung (z.B. der Title Tags) nutzen.

Zugriff auf die kompletten Daten

Gerne k├Ânnt ihr Zugriff auf die kompletten Daten als Datastudio Report haben.

Einfach hier eintragen und du erh├Ąlts den Link zum Data Studio Dashboard per eMail.

Data Studio link anfordern
Michael Weber

Author Michael Weber

Michael Weber ist der Gr├╝nder und Hauptentwickler von searchVIU. Er betreibt seit 2001 SEO und hat Erfahrungen als Berater in einer Agentur und als Inhouse-SEO gesammelt.

More posts by Michael Weber