searchmetrics email facebook github gplus instagram linkedin phone rss twitter whatsapp youtube arrow-right chevron-up chevron-down chevron-left chevron-right clock close menu search
1467214672

Das 1×1 des JavaScript-SEO

JavaScript-SEO ist momentan in aller Munde. Viele Guides, Webinare und Ratgeber werden publiziert und dennoch bleiben viele Fragen offen. Nicht bei uns! SEO-Manager des Sparkassen-Finanzportal GmbH Sebastian Adler und Senior SEO Consultant von Searchmetrics Marcus Pentzek vermittelten in ihrem Webinar am 15.05. Grundlagenverständnis für die Problematiken rund um JavaScript und präsentierten Lösungen zu den gängigsten Anwendungsfragen der Community. In diesem Beitrag haben wir fünf der spannendsten Zuschauerfragen zum Thema, inklusive der Experten-Antworten, für euch zusammengefasst! Übrigens: In unserem separaten Blogpost findet ihr alle Antworten auf die häufigsten 5 Probleme bei Server-Side Rendering und JavaScript SEO.

Ihr wollt mehr Beratung zu den Grundlagen von JavaScript-SEO? Unsere Experten von der Digital Strategies Group sind mit Herz und SEO-Verstand für eure Anfrage gerüstet. Vereinbart einfach einen Kennenlern-Termin!

Jetzt Termin vereinbaren

Video: Das 1×1 des JavaScript-SEO

Wer beim Webinar zum Thema JavaScript-SEO nicht mit dabei war, kann sich die Video-Aufzeichnung auf unserem Youtube-Channel in voller Länge anschauen. Hier erklären Sebastian Adler und Marcus Pentzek neben den Grundlagen von SEO auch die Rolle von JavaScript auf Websites und deren Bedeutung für SEO. Besonders interessant für unsere Zuschauer ist in diesem Zusammenhang auch die Herbeiführung von Lösungen zu gängigen Anwendungsproblemen mithilfe von Prerendering, Dynamic Serving und Hybrid Rendering.

 

 

Im Laufe des Webinars gab es zahlreiche Fragen von euch, deren Beantwortungen wir euch natürlich nicht vorenthalten möchten. Wir haben fünf Fragen ausgewählt, die einen guten Überblick über unsere Themenstellungen vermitteln. Mehr dazu findet ihr im Video!
Los geht’s mit euren Anwendungsfragen rund um das 1×1 des JavaScript-SEO!


Frage #1: Google versteht ja JavaScript immer besser und kann besser damit umgehen. Was ist denn eure Einschätzung dazu? Ist Google bereit für JavaScript?

Sebastian: Google ist definitiv JS ready! Allerdings bringt die Verwendung von JavaScript Nachteile für den Rendering-Prozess mit sich, die gegebenenfalls schwere Auswirkungen haben können. Daher sollte JavaScript immer mit Bedacht eingesetzt werden, mit dem Ziel vor Augen, schnelle und leicht zu verarbeitende Inhalte auszuliefern.

Marcus: Google kann JavaScript einsetzen und rendern – das steht absolut außer Frage. Die Frage, die man sich stellen sollte, ist, ob man JavaScript wirklich einsetzen möchte oder ob das Problem nicht auch einfacher gelöst werden kann. Viele Developer benutzen JavaScript für die Programmierung einfacher Dropdown-Menüs, obwohl hier auch reines HTML und CSS zum Einsatz kommen kann. Ich empfehle aus Gründen der Effizienz, JavaScript nur zu benutzen, wenn Funktionen und Features hinzukommen, die sich nicht mittels HTML und CSS lösen lassen.

Google kann zwar mit JavaScript umgehen, jedoch ergeben sich durch seine Anwendung einige Nachteile. Es kann zu höheren “Ladezeiten” aufgrund von zusätzlichem Code und Rendering-Aufwand beziehungsweise zu einer Verzögerung der Indexierung von Content kommen, der über JavaScript nachgeladen wird. Diese Verzögerung der Indexierung ist bei veröffentlichungskritischem Content, wie zum Beispiel News im Publisher-Umfeld oder Preisanpassungen im E-Commerce, durchaus problematisch.


Frage #2: Mein Page-Speed ist langsam. Meine Homepage wurde in WordPress erstellt und enthält YouTube-Videos auf der Startseite. Beim ersten Laden der Seite werden 1,1 MB JavaScript analysiert. Wie verzögere ich das Parsen von JavaScript, um das Blockieren der Seitenwiedergabe zu reduzieren?

Sebastian: Hier gibt es viele Punkte, an denen man ansetzen kann. Zunächst blicken wir auf die Größe der JS Inhalte selbst: Kann man die 1,1MB minimieren? Werden wirklich alle Inhalte aus den Dateien gebraucht? Hier hilft zum Beispiel die Code Coverage aus den Chrome Developer Tools (F12 für die Developer Tools, gegebenenfalls ESC, um die Console am unteren Rand anzuzeigen und im Kontextmenü “Coverage” zu aktivieren).

 

 

Als nächsten Schritt kann man die Skripte, die man sofort braucht, von denen die man nicht sofort braucht, trennen.

Hierfür werden die Skripte mittels “async” oder “defer” verzögert.

Hinweis: “async” lädt das Skript parallel und führt es aus, wenn es fertig geladen ist; “defer” lädt das Skript und führt es erst aus, wenn die Seite fertig geladen ist.

<script async>

<script defer>

Weiterhin kann es helfen, die Inhalte “vorzuladen”. Eine Übersicht aller Möglichkeiten der Priorisierung gibt es hier: https://addyosmani.com/blog/script-priorities/. Für die WordPress- Seite bedeutet das also Anpassungen im Seiten-Template und ein Splitting beziehungsweise eine Optimierung der JS Dateien.

Marcus: Wie Sebastian bereits sagt werden sicherlich viele der Scripts, die geladen werden, nicht wirklich benötigt. Ich kann mir vorstellen, dass dein WordPress-Template oder eines der genutzten Plugins für diesen Überhang an JavaScript verantwortlich ist. Hier gilt der Leitsatz, den Sebastian während des Webinars immer wieder brachte: “Sprich mit deinem Developer” – er oder sie kann dir sagen, ob das Template umprogrammiert werden kann oder das Plugin wirklich erforderlich ist beziehungsweise gegen ein weniger belastendes Plugin ersetzt werden kann.

Frage #3: Was sind gute Ladezeiten im Google Lighthouse Audit? Habt ihr Vergleichswerte für mich?

Sebastian: Um Vergleichswerte zusammenzutragen, stellt Google die Pagespeed Score Card zur Verfügung. Hier könnt ihr euch mit Wettbewerbern vergleichen. Generell sollte das Ziel sein, alle Inhalte innerhalb von 5, besser in 3 Sekunden fertig gerendert (“onLoad” Event) zu haben. Für die restlichen, von Google genutzten, User-Timings FCP/FMP gilt generell: je eher desto besser!

Wollt ihr eine genaue Analyse zu eurer Domain? Unser neues Google Lighthouse Produkt analysiert den Online-Markt eurer Wettbewerber und liefert exakte Benchmark-Werte, die für eure Website relevant sind!

Frage #4: Wird das Akkordeon-Menü in WordPress von den Suchmaschinen ausgelesen?

Sebastian: Sofern das Akkordeon über CSS realisiert wird und JavaScript nur die Animationen für das Ein- und Ausklappen übernimmt, sollte alles in Ordnung sein.

Allerdings kann ich nicht für das Plugin sprechen. Prüft zuerst, ob die Links aus dem Menü im Seitenquelltext (F12 im Chrome) zu finden sind. Sind sie da, ist alles okay.

Marcus: Ist der Inhalt bereits im initialen Quelltext vorhanden, kann Google diesen natürlich auslesen. Hier würde sich eher die Frage stellen, wie Google den Quelltext bewertet, wenn dieser initiale Inhalt nicht sichtbar – also eingeklappt – ist. Früher sagte Google, dass nicht sofort sichtbare Inhalte “anders” bewertet werden, als ein Text, der direkt “above the fold“ sichtbar war. Hier unterscheide ich gerne zwischen zwei “Arten” von “nicht sofort sichtbar”: Die Inhalte, die ich erfassen kann, wenn ich nur scrollen muss oder die Inhalte, bei denen ich (zusätzlich) klicken muss. Hier ist die Wahrscheinlichkeit, dass ich als User diese Inhalte zu Gesicht bekommen werde, relativ groß (falls die Buttons zum Ausklappen groß und sichtbar genug sind).

In der Umstellung auf Mobile-First-Indexing, sagte Google, dass Akkordeon-Konstrukte in mobilen Layouts ein übliches Mittel seien, um Usern Content zugänglich zu machen und dass hier die Regel “wir bewerten versteckte Inhalte anders” nicht greifen würde.

Setzt ihr allerdings JavaScript ein, um Inhalte in den initial versteckten Tabs nicht bloß anzuzeigen, sondern gar erst nachzuladen, passiert was Sebastian im Webinar sagte: Der User muss klicken, um Inhalte vom Server zu laden (vergleichbar mit SPAs). Der Suchmaschinen-Bot ist dafür nicht zuständig und würde diese Inhalte nicht sehen.

Frage #5: Welche Auswirkungen seht ihr für Inhalte, die direkt geladen aber zugeklappt werden und somit nicht direkt sichtbar sind?

Sebastian: Aktuell kann dazu keine verlässliche Aussage getroffen werden. Auf dem Desktop bewertet Google ausgeblendete Inhalte grundsätzlich schlechter. Im Zuge der Umstellung auf Mobile Indexing hat John Mueller allerdings gesagt, dass es kein Problem darstellen sollte, wenn Inhalte, die auf dem Desktop sichtbar sind, auf dem Mobilgerät eingeklappt werden. Belastbare Erfahrungen mit dem Umgang auf Mobil-Seiten gibt es noch nicht.


Ihr habt noch Fragen? Unsere Experten von der Digital Strategies Group sind mit Herz und SEO-Verstand für eure Anfrage gerüstet. Vereinbart einen unverbindlichen Kennenlern-Termin! 

Jetzt Termin vereinbaren