JavaScript ist ein essenzieller Bestandteil moderner Websites: Mittels JavaScript wird Deine Website dynamisch und ermöglicht Interaktionen, Animationen und mehr für eine gelungene User Experience. Diese Technik stellt jedoch auch besondere Anforderungen an die Suchmaschinenoptimierung. Dieser Artikel beschreibt, auf welche Punkte Du im Einsatz von JavaScript achten solltest und wie Du moderne Webentwicklung mit erfolgreicher SEO vereinst.
Was ist JavaScript-SEO?
JavaScript-SEO bezieht sich auf Strategien und Techniken, die sicherstellen, dass Suchmaschinen Websites, die JavaScript verwenden, effektiv crawlen, rendern und indexieren können. Das ist entscheidend, da Suchmaschinen historisch gesehen für statische HTML-Inhalte ausgelegt waren und JavaScript zusätzliche Schritte in den Prozessen des Crawlings und Renderings erfordert.
Technischer Hintergrund: Wie Suchmaschinen JavaScript verarbeiten
In der Regel sind Suchmaschinen in der Lage, Websites mit JavaScript fehlerfrei zu crawlen und korrekt zu verarbeiten. Es kann jedoch vorkommen, dass einige APIs oder komplexe Skripte nicht korrekt ausgeführt werden können. Außerdem gibt es bestimmte JavaScript-Nutzungsweisen, die in Bezug auf SEO kritisch sein können.
Zudem solltest Du Dir immer vor Augen halten, dass die Verarbeitung von JavaScript sehr rechenintensiv ist, letztlich bei den Suchmaschinen Kosten verursacht und demnach von ihnen im Crawling und in der Indexierung (bei kleineren, JavaScript-lastigen Websites) herunterpriorisiert werden kann.
Grundsätzlich ist es wichtig zu verstehen, dass Suchmaschinen wie Google mehrere Phasen durchlaufen, um Inhalte einer Website zu verarbeiten:
- (Warten auf) Crawling
Der Bot besucht die URL und lädt den Basis-HTML-Code herunter. In dieser Phase werden nur Inhalte erfasst, die direkt im HTML verfügbar sind. Ressourcen wie CSS, JavaScript oder Bilder werden ebenfalls erkannt, aber noch nicht vollständig verarbeitet. Inhalte, die erst durch JavaScript generiert werden, bleiben zunächst unberücksichtigt und gelangen in eine Warteschlange für das Rendering. - Rendering
Der Web Rendering Service (WRS) berechnet die Seite in einer Headless-Chrome-Umgebung. Dabei wird JavaScript ausgeführt, CSS geladen und die Seite vollständig geladen. Dadurch wird der vollständige Inhalt sichtbar, einschließlich dynamischer Inhalte, die zuvor nicht im initialen HTML enthalten waren. - Verarbeitung / Extraktion von Inhalten
Danach werden die relevanten Inhalte der gerenderten Seite wie Texte, Links und Metadaten extrahiert. Google analysiert die gerenderte DOM-Struktur und bereitet die Daten für die Indexierung vor. - Indexierung
Die finalen Inhalte, die nach dem Rendering verfügbar sind, werden in den Suchmaschinenindex aufgenommen. Dadurch werden auch dynamische und JavaScript-generierte Inhalte für die Suchergebnisse.
Verarbeitungsphasen von JavaScript durch Suchmaschinen (Quelle: eigene Darstellung, in Anlehnung an: https://developers.google.com/search/docs/crawling-indexing/javascript/javascript-seo-basics?hl=de) - Ressourcenoptimierung
Google bewertet während dieses Prozesses die Ladezeiten und die Effizienz der Website. Ressourcen, die blockieren oder unnötig komplex sind, können den Rendering-Prozess negativ beeinflussen und die Indexierung erschweren. Das Verarbeiten von JavaScript erfordert von Suchmaschinen erhebliche Ressourcen. Google legt den Fokus auf stark frequentierte Websites, wodurch weniger besuchte Seiten unter Umständen verzögert oder unvollständig gerendert werden.Websites, die in hohem Maß auf JavaScript basieren, können das Problem haben, dass ihre Inhalte für Suchmaschinen-Bots nicht sofort sichtbar sind. In solchen Fällen spielen unterschiedliche Rendering-Strategien eine zentrale Rolle:
| Rendering-Methode | Beschreibung | Vorteile | Nachteile |
| Clientseitiges Rendering (CSR) | Der Inhalt wird im Browser des Nutzers oder der Nutzerin erzeugt, nachdem die Seite vollständig geladen wurde. Suchmaschinen müssen JavaScript ausführen, um den Inhalt zu erkennen. | – einfachere, schnellere Implementierung
– ideal für Webanwendungen mit vielen interaktiven Elementen |
– Crawler müssen JavaScript ausführen, was ressourcenintensiv ist.
– Inhalte können verzögert oder gar nicht indexiert werden. Dies kann dazu führen, dass wichtige Inhalte nicht erfasst werden. |
| Serverseitiges Rendering (SSR) | Inhalte werden serverseitig inklusive des JavaScripts als HTML ausgeliefert, was die Verarbeitung und Indexierung erleichtert. | – direkte Auslieferung von gerendertem HTML
– schnelleres Crawling und verbesserte Seitenladegeschwindigkeit (wichtig für Core Web Vitals) |
– höhere Belastung der Hosting-Server
– gegebenenfalls längere Ladezeit bis zur ersten visuellen Darstellung der Webseite – technisch komplexer und kostenintensiver |
| Dynamisches Rendering | Der Server entscheidet je nach User-Agent zwischen server- oder clientseitigem Rendering. Nutzer:innen erhalten eine nicht gerenderte Seite, Suchmaschinen vorberechnete HTML-Versionen. Google empfiehlt diese Methode nicht mehr. | – Flexibilität, da je nach User-Agent entschieden wird, welche Rendering-Methode verwendet wird | – potenziell komplexere Implementierung
– keine langfristige Lösung laut Google (Quelle: Google Search Central, https://developers.google.com/search/docs/crawling-indexing/javascript/dynamic-rendering?hl=de) |
Wann ist JavaScript-SEO für meine Website relevant?
Zunächst gilt es einmal zu klären, wie stark eine Website von JavaScript abhängig ist. Im ersten Schritt ist diese Prüfung wichtig, um einschätzen zu können, wie relevant das Thema JavaScript-SEO generell für die jeweilige Website ist. Grundsätzlich gilt: Eine Überprüfung schadet nicht,
Wie abhängig ist eine Einzelseite von JavaScript?
Das kannst Du leicht herausfinden, wenn Du das JavaScript beim Aufruf einer Webseite deaktivierst. Dafür gibt es mehrere Wege. Zwei praktikable Möglichkeiten, JavaScript im Browser zu deaktivieren, führe ich hier auf.
- Deaktivieren direkt im Browser:
Beispiel Chrome: Einstellungen -> Datenschutz & Sicherheit -> JavaScript -> “Websites dürfen JavaScript nicht verwenden“
Google Chrome Einstellungen (Quelle: eigener Screenshot) Nun sollte die Seite einmal neu geladen werden. Falls dann beim Aufruf der Website große Teile des Inhalts fehlen, werden demnach einige Inhalte mit JavaScript dynamisch eingebettet beziehungsweise nachgeladen. Sind dagegen visuell nur kleine oder keine Veränderungen zu sehen, ist die Webseite weniger stark abhängig von JavaScript (was die visuell sichtbaren Elemente angeht). Dennoch können auch zunächst nicht visuelle Elemente wie zum Beispiel Meta-Daten, Überschriften oder Canonical Tags nachträglich mit JavaScript geladen beziehungsweise manipuliert werden. - Deaktivieren via Browser-Extension
Es gibt auch Chrome Extensions wie “View Rendered Source“, mit denen Du auf HTML-Ebene einsehen kannst, wie Dein initiales HTML aussieht und wie das gerenderte und durch JavaScript veränderte HTML ausgegeben wird. Farblich werden Dir die jeweiligen Unterschiede dargestellt.
(Quelle: Chrome Web Store, View Rendered Source, https://chromewebstore.google.com/detail/view-rendered-source/ejgngohbdedoabanmclafpkoogegdpob)
Massenüberprüfung von JavaScript Inhalten für eine ganze Website
Selbstverständlich können auch ganze Websites auf ihre JavaScript-Nutzung hin überprüft werden. An dieser Stelle eignet sich das SEO- und Crawler-Tool Screaming-Frog sehr gut. Der Screaming Frog ist ein leistungsstarkes SEO-Tool, mit dem sämtliche SEO-Kriterien einer Website geprüft werden können.
Hierfür muss unter den Crawl-Einstellungen zunächst das JavaScript-Rendering aktiviert werden, damit das verwendete JavaScript beim Crawl berücksichtigt wird.
Konfiguration -> Crawl-Konfiguration -> Rendering -> JavaScript
(Quelle: Eigener Screenshot)
Ist der Crawl durchgelaufen, findest Du im Bericht „JavaScript“ alle nützlichen Informationen zum Skript selbst, aber auch insbesondere darüber, welche Inhalte per JavaScript nachgeladen werden (gerendertes HTML) und welche bereits im Original-HTML vorhanden sind.
(Quelle: Eigener Screenshot)
In den meisten Fällen ist es sinnvoll, standardmäßig mit JavaScript-Rendering zu crawlen. Um bereits eine Tendenz zu erkennen, ist es nicht immer notwendig 100 % der URLs zu crawlen, besonders bei großen Websites. Nach dem Crawl weißt Du, wie viele und welche Inhalte durch JavaScript auf Deiner Website dynamisch eingebunden werden.
Wie im Ausschnitt zu erkennen ist, gibt es zahlreiche Elemente, die dynamisch eingebunden werden können. Zusätzlich stellt Screaming Frog Dir potenzielle Warnungen und Fehler dar, die durch Deine JavaScript-Dateien verursacht werden.
Wichtig: Die Art, wie Google die Website rendert, kann von der Vorgehensweise der Crawling-Tools abweichen. Daher solltest du immer die prüfen wie Google deine Website rendert.
Wie sieht Google meine Webseite?
Nun hast Du herausgefunden, wie Deine Webseite ohne JavaScript aussieht und welche Inhalte dynamisch eingebunden sind. Um Gewissheit zu haben, dass diese Inhalte auch von Google erfasst werden, solltest Du auf die Google Search Console zurückgreifen. Der Nachteil ist hier, dass sämtliche Seiten manuell geprüft werden müssen. Da sich die grundlegende Website-Architektur und die damit einhergehende JavaScript-Nutzung mit großer Wahrscheinlichkeit bei den meisten URLs ähneln, kann der Test jedoch auf bestimmte Seitentypen wie zum Beispiel Blogseiten oder Produktdetailseiten beschränkt werden.
Folgende Schritte sind nötig, um einzusehen, wie Google eine bestimmte URL rendert:
- Öffne die Google Search Console: Melde Dich in der Google Search Console an und wähle die entsprechende Property aus, für die Du das Rendering überprüfen möchtest.
- Navigiere zu “URL-Prüfung”: Füge die zu untersuchende URL in der Suchleiste oben ein.
- Prüfe die Anzeige der gerenderten Version: Nachdem die Seite überprüft wurde, kannst Du auf die Option „Gecrawlte Seite anzeigen“ klicken. Hier zeigt Dir Google die von seinem Bot gerenderte HTML- Version der Seite, einschließlich aller Inhalte, die durch JavaScript geladen werden.
URL-Prüftool Google Search Console (Quelle: eigener Screenshot)
- Lass Dir zusätzlich einen Screenshot anzeigen: Gehe auf „Screenshot“ und lass Dir eine Vorschau geben, wie Google die Webseite sieht. Da es sich hier lediglich um eine Vorschau handelt, ist der Anzeigebereich begrenzt. Wenn hier wichtige Inhalte oder Grafiken fehlen, solltest Du das Problem schnell angehen.
- Überprüfe Fehler und Probleme: Falls Google Probleme beim Rendern der Seite hat (z. B. wegen JavaScript-Fehlern oder Ressourcen, die nicht geladen werden können), wird dies in der Übersicht unter „weitere Informationen“ angezeigt. Hier kannst Du nach möglichen Problemen suchen, wie etwa nicht vollständig geladene Skripte oder Blockierungen durch die robots.txt-Datei. Das ist besonders wichtig, wenn Du sicherstellen möchtest, dass der Google-Bot alle relevanten Inhalte, die durch JavaScript erzeugt werden, korrekt erfassen kann.
- Überprüfe den Indexierungsstatus: Du kannst auch den Indexierungsstatus überprüfen, um sicherzustellen, dass die gerenderte Version der Seite korrekt in den Google-Index aufgenommen wurde. Bei Problemen mit der Indexierung gibt Google häufig Hinweise, wie Du die Seite für den Bot zugänglicher machen kannst.
Diese Schritte helfen Dir, potenzielle SEO-Probleme im Zusammenhang mit JavaScript-Inhalten zu identifizieren und sicherzustellen, dass die Seite von Google genauso gesehen wird wie von Nutzerinnen und Nutzern.
Tipp: Hast Du keinen Zugriff auf die Property in der Google Search Console, nutze einfach das Tool von Google zum Testen von strukturierten Daten. Die Funktionsweise ist dieselbe. Im Prüftool zum Testen von strukturierten Daten siehst Du auch das gerenderte HTML einer URL.
Eine weitere Möglichkeit stellt eine klassische Site-Abfrage dar. Damit kannst Du manuell überprüfen, ob Google JavaScript-basierte Inhalte indexiert. Gib dafür einfach in die Google-Suche folgendes ein: “Deine via JavaScript eingebundene Textpassage“ site:deinewebsite.xy . Jetzt solltest Du im besten Fall die JavaScript-Inhalte sehen.
Site-Abfrage (Quelle: Eigener Screenshot)
Typische SEO-Probleme durch JavaScript
Im Folgenden gehe ich auf typische Fallstricke ein, die im Zusammenhang von JavaScript und SEO entstehen können, und zeige, worauf dabei zu achten ist.
1. Probleme beim Crawling von JavaScript-Inhalten
Suchmaschinen-Bots crawlen Websites, indem sie Links und Inhalte im HTML finden. Bei JavaScript-basierten Websites können jedoch wichtige Inhalte und Links für Bots verborgen bleiben:
- Dynamisch generierte Inhalte, die erst durch Nutzeraktionen sichtbar werden (z. B. nach Scrollen oder Klicken), werden oft nicht gecrawlt.
- Inhalte, die von externen APIs geladen werden, können fehlen, wenn der Bot die API nicht ausführt. Beispiel: Eine E-Commerce-Website lädt Produktbeschreibungen über eine API nach. Auch wenn sie für Nutzer:innen sichtbar sind, bleiben sie Suchmaschinen verborgen, wenn diese die API nicht aufrufen.
Es ist wichtig, dass für Dich wichtige Inhalte bereits in der ersten HTML-Antwort verfügbar sind. Für eine E-Commerce-Website bedeutet das, dass wesentliche Produktinformationen wie Titel, Beschreibung und Preis direkt im vom Server gerenderten HTML enthalten sein sollten, anstatt diese ausschließlich über JavaScript nachzuladen. Auf diese Weise können Suchmaschinen und Nutzer:innen die relevanten Details schneller und effizienter erfassen.
Auch können z.B. dynamisch eingebundene H1-Überschriften, Meta-Tags, Canonicals oder hreflang-Attribute für Suchmaschinen unzugänglich sein, da wie eingangs beschrieben das JavaScript-Rendering für Suchmaschinen ressourcenintensiv ist und oft in einer zweiten Phase nach dem Crawling des statischen HTML erfolgt. Dann kann es passieren, dass sie entweder gar nicht, verspätet oder fehlerhaft erfasst werden. Eine Garantie, für eine korrekte Verarbeitung gibt es also nicht. Dies sollte immer mit den eingangs dargestellten Möglichkeiten überprüft werden.
2. JavaScript-basierte Weiterleitungen
JavaScript-basierte Weiterleitungen können für Suchmaschinen eine Herausforderung darstellen, da sie nicht immer sofort erkannt werden. Suchmaschinen bevorzugen serverseitige Weiterleitungen wie 301 oder 302, die direkt im HTTP-Header ausgeführt werden. Bei JavaScript-Weiterleitungen muss der Google-Bot zunächst den JavaScript-Code herunterladen und ausführen, bevor die Weiterleitung aktiviert wird, was den Prozess verlängert. Während serverseitige Weiterleitungen bereits in der Crawling-Phase verarbeitet werden, greifen JavaScript-Weiterleitungen erst in der Rendering-Phase.
Auch wenn der Google-Bot die Weiterleitung in der Regel erkennt und ausführt, ist diese Methode nicht optimal. Setze daher bevorzugt auf serverseitige Weiterleitungen, insbesondere auf permanente 301-Weiterleitungen. Falls JavaScript-Weiterleitungen unvermeidbar sind, sollten sie präzise implementiert werden, etwa durch klare window.location-Anweisungen. Überprüfe zudem alle Weiterleitungen daraufhin, ob sie verarbeitet wurden.
3. JavaScript-basierte interne Verlinkungen, Paginierung und Infinite Scrolling
Für gewöhnlich werden interne Verlinkungen im HTML mit einem href-Attribut deklariert. Es kann jedoch auch vorkommen, dass bestimmte CMS-Systeme JavaScript-Links einsetzen. Ist dies der Fall, kann es ähnlich wie bei den JavaScript-Weiterleitungen zu Problemen beim Crawling dieser Verlinkungen kommen.
JavaScript-Links identifizieren mit Screaming Frog (Quelle: Eigener Screenshot)
Links, die mit dem Schema „javascript:“ erstellt werden, werden vom Google-Bot nicht wie normale URLs behandelt, da er den JavaScript-Code nicht ausführt und nicht mit diesen Links interagiert. Allerdings kann der Google-Bot eine URL-ähnliche Zeichenfolge im Code erkennen und eigenständig versuchen, diese zu crawlen. Das bedeutet jedoch nicht, dass der Bot dem JavaScript-Link gefolgt ist, sondern lediglich, dass er die Zeichenfolge als potenzielle URL identifiziert hat.
Interne Links sollten daher möglichst als HTML-Link dargestellt werden und über eine gewöhnliche Auszeichnung im HTML erfolgen, zum Beispiel <a href=”/seite”>internerLink</a>.
Werden die internen Links standardmäßig durch JavaScript erzeugt, sollte gewährleistet werden, dass diese Links an anderen Stellen per ahref-Attribut verlinkt werden.
Hinsichtlich der Paginierung (insbesondere bei E-Commerce-Websites) können dynamisch geladene Inhalte für Probleme bei der Indexierung sorgen, beispielweise durch Infinite Scrolling oder einen „Mehr Laden“-Button auf den Kategorieseiten.
Inhalte, die nur durch Scrollen geladen werden, sind für den Google-Bot schwer zugänglich. Eine Möglichkeit, diesem Problem entgegenzuwirken, besteht darin, zusätzlich zu Infinite Scrolling Paginierungs-URLs zu implementieren, sodass jede Paginierungsstufe mit einer eindeutigen URL erreichbar ist, zum Beispiel: https://beispielshop.com/produkte?seite=1.
Die Verwendung von pushState oder replaceState kann dabei helfen, bei jedem Scrollen eine neue URL zu generieren. Wichtig ist auch, dass der gesamte Inhalt ohne JavaScript zugänglich bleibt, um sicherzustellen, dass er auch von Suchmaschinen problemlos indexiert werden kann.
4. Suchmaschinen-Bots interagieren nicht wie echte Nutzer:innen
Suchmaschinen-Bots interagieren nicht mit dynamischen Elementen wie Dropdown-Menüs oder Formularen. Inhalte, die erst durch Nutzerinteraktionen sichtbar werden, bleiben für den Bot deshalb oft unsichtbar, da er weder scrollt noch auf Links oder Buttons klickt.
Um sicherzustellen, dass alle Inhalte für den Bot zugänglich sind, sollten sie entweder direkt im anfänglichen HTML enthalten sein oder so per JavaScript geladen werden, dass keine Benutzerinteraktion erforderlich ist. Setze dabei, wenn möglich, auf serverseitiges Rendering (SSR), um Inhalte sofort bereitzustellen, und verwende statische HTML-Elemente für kritische Informationen. Auch hier ist eine sorgfältige Prüfung des tatsächlich gerenderten HTMLs wie eingangs dargestellt notwendig.
5. Blockiertes JavaScript in der Robots.txt-Datei
Bereits recht unauffällige Anweisungen in der robots.txt-Datei können häufig dazu führen, dass beim Aufsetzen der Robots.txt versehentlich wichtige JavaScript-Dateien vom Rendering ausgeschlossen werden, da sie nicht gecrawlt werden dürfen.
Ausschnitt einer robots.txt Datei mit einem Befehl, welcher JavaScript Dateien vom Crawling ausschließt (Quelle: eigener Screenshot)
In diesem Fallbeispiel könnten wichtige Inhalte, die dynamisch mit JavaScript eingebunden werden, nicht indexiert werden. Grund dafür ist, dass die eingesetzten JS-Dateinamen ein Fragezeichen beinhalten. Durch die robots.txt-Anweisung kann das Skript aber nicht gecrawlt und verarbeitet werden.
Um sicherzustellen, dass keine wichtigen JavaScript-Dateien in der robots.txt blockiert werden, solltest Du dies mit dem URL-Prüftool in der GSC überprüfen.
(Quelle: Google Search Console, URL-Prüftool)
In diesem Fall werden 41 von 188 Ressourcen nicht geladen. Es gilt daher zu verifizieren, ob (wie angenommen) für das Rendering essenzielle JavaScript-Dateien davon betroffen sein könnten.
(Quelle: Google Search Console, URL-Prüftool)
In diesem Beispiel werden sehr viele Skripte nicht geladen. Zu prüfen ist dann, ob die Skripte essenziell für die Darstellung der Inhalte der Website sind. Nutze hierfür die eingangs erwähnte Ansicht unter „Screenshot“ (Siehe Abschnitt „Wie sieht Google meine Webseite?“). Wenn dies der Fall sein sollte, passe die robots.txt-Datei an und wiederhole den Prozess.
Das Beispiel zeigt auf, dass Anweisungen in der robots.txt-Datei immer gut durchdacht und geprüft werden sollten, bevor diese dem Bot zur Verfügung gestellt werden.
6. Auswirkungen von JavaScript auf die Website-Geschwindigkeit
JavaScript ermöglicht die Realisierung von modernen, dynamischen und interaktionsfähigen Webseiten. Manche Webseiten oder CMS-Systeme haben schon grundsätzlich einen hohen Anteil an JavaScript-Dateien. So nützlich JavaScript auch für viele Funktionen auf der Website sind, so schädlich können sie auch für die Website-Geschwindigkeit sein. Eine hohe Anzahl an verwenden Plug-ins oder aufwendige JavaScript-Animationen sind oft die Ursache für hohe Ladezeiten. Ein vollumfängliches SEO-Reporting sollte daher auch stets ein Monitoring der Core Web Vitals beinhalten, um mögliche Website-Performance-Probleme zu identifizieren.
Mit dem Tool „Pagespeed Insights“ von Google können erste Hinweise und Probleme ausfindig gemacht werden, die mit möglichen Performance- und gegebenenfalls JavaScript-Problemen zusammenhängen können.
Eine genauere Auskunft über problematische JavaScript-Dateien liefert in der Regel ein Wasserfalldiagramm, bei dem Download, Rendering, Ausführung und damit die Gesamtzeit in der Ladezeit durch JS-Code beansprucht wird erkennbar ist. Eine einfache und verständliche Übersicht bietet das Wasserfall-Diagramm von webpagetest. WebPageTest.org ist ein Online-Tool, mit dem die Ladegeschwindigkeit und Performance von Webseiten aus verschiedenen Standorten und mit unterschiedlichen Browsern getestet werden können, um Optimierungspotenziale zu identifizieren.
Wasserfalldiagramm webpagetest.org (Quelle:. Eigener Screenshot)
Im Wasserfalldiagramm werden verschiedene Website-Ressourcen chronologisch nach Ausführungszeitpunkt aufgelistet. Dabei wird die Ausführungszeit in Millisekunden angegeben. In der Regel gibt es JavaScript-Dateien, die den gesamten Rendering-Prozess erheblich verlangsamen. Diese sogenannten Rendering blockierenden Ressourcen werden zusätzlich markiert und sollten optimiert werden.
Grundsätzlich kann die Verarbeitungsgeschwindigkeit von JavaScript-Dateien reduziert werden, indem unnötiger Code entfernt und die Dateien durch Minifizierung verkleinert werden. Hierbei werden beispielsweise Kommentare, Leerzeichen und ungenutzte Teile des Codes eliminiert, wodurch die Ladezeit sinkt und die Performance der Website steigt. Zusätzlich kann die Ausführung von JavaScript optimiert werden, indem Skripte asynchron oder mit dem defer-Attribut eingebunden werden. Während asynchrone Skripte unabhängig vom restlichen Seiteninhalt parallel geladen werden, stellt defer sicher, dass der Code erst nach dem Laden des HTML-Dokuments ausgeführt wird. Dadurch wird verhindert, dass wichtige Inhalte durch das Laden von Skripten blockiert werden.
Fazit und Ausblick: Auch zukünftig kommt es auf den richtigen Umgang mit JavaScript an
Die Anforderungen an Websites steigen zukünftig weiter – die Welt der Suchmaschinen ändert sich derzeit drastisch. Statt klassischer Suchergebnisse auf einer SERP (Search Engine Result Page) nehmen AI Overviews in der Google Suche oder der kürzlich veröffentlichte AI Mode immer mehr Raum ein. Auch die Zahl der Suchanfragen über die Suchfunktion der LLMs (Large Language Models) via Chat GPT, Gemini, Perplexity & Co. steigen rasant. Statt einer Reihe von Links zu Websites mit passenden Informationen erhält man nun ausformulierte Antworten mit Referenzierung der Website Quelle.
Derzeit analysieren LLMs Website Inhalte semantisch. Grundlage für ihr Verständnis ist also nach wie vor das initiale HTML, nicht jedoch dynamisch generierte Inhalte, die erst durch JavaScript geladen werden. Inhalte, die ausschließlich clientseitig eingebunden werden, laufen daher Gefahr, in KI-basierten Antworten unberücksichtigt zu bleiben.
Der Grund liegt in der Funktionsweise der Systeme: KI-gestützte Suchsysteme und LLMs führen kein JavaScript aus, sie greifen lediglich auf das statische HTML oder strukturierte Daten zurück. Dynamisch nachgeladene Inhalte, Inhalte hinter Tabs, Filtern oder „Mehr Laden“-Buttons sowie API-basierte Daten bleiben unsichtbar, da die Modelle keine Nutzerinteraktionen simulieren und keine vollständige Browserumgebung ausführen. Zwar wird an Lösungen gearbeitet, die eine JavaScript-Verarbeitung ermöglichen könnten, doch aktuell sind diese Ansätze noch nicht breit verfügbar.
Für Website-Betreiber:innen und SEOs bedeutet das: Die technische Struktur einer Website muss klar und nachvollziehbar sein. Dynamische Inhalte sollten stets mit Bedacht eingesetzt werden, zentrale Informationen bereits serverseitig oder im initialen HTML bereitgestellt werden. Serverseitiges Rendering (SSR) bleibt die zuverlässigste Methode, um Inhalte sowohl für klassische Suchmaschinen als auch für KI-gestützte Systeme sichtbar zu machen. Zusätzlich tragen sauber strukturierte HTML-Elemente und strukturierte Daten dazu bei, dass LLMs Inhalte korrekt erfassen und verarbeiten können.
Langfristig ist zu erwarten, dass LLMs komplexere JavaScript-Inhalte besser interpretieren können. Im aktuellen Status quo entscheidet jedoch die statische Sichtbarkeit darüber, ob Inhalte indexiert, verstanden und in generativen KI-Antworten berücksichtigt werden. SEO-Basics, eine saubere technische Umsetzung und die sorgfältige Kontrolle der JavaScript-Nutzung bleiben daher unverzichtbar – als Fundament für nachhaltige Sichtbarkeit und Reichweite im Zeitalter von KI.
Sie sehen gerade einen Platzhalterinhalt von YouTube. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.
Mehr Informationen
