JavaScript-SEO-Audit-Vorlage

Prüfen Sie JS-gerenderte Seiten, damit der Googlebot Ihre Inhalte, Links und Metadaten zuverlässig crawlen, rendern und indexieren kann.

JavaScript ermöglicht großartige Nutzererlebnisse, doch Suchmaschinen ranken nur, was sie rendern und lesen können. Diese Vorlage führt Sie durch das Audit, wie der Googlebot Ihre JS-gerenderten Seiten sieht, damit Ihre Inhalte, Links und Metadaten das Rendering überstehen. Arbeiten Sie jede Prüfung durch und halten Sie fest, was das gerenderte DOM tatsächlich enthält, nicht nur, was in Ihrem Quellcode ausgeliefert wird.

6 einsatzbereite Varianten

Rendering-Prüfung: Roh-HTML vs. gerendertes DOM

Bestätigen Sie, was der Googlebot nach der Ausführung von JavaScript sieht, nicht nur die erste Serverantwort.

Vergleichen Sie den Quellcode mit dem gerenderten DOM

Google ruft zuerst Ihr Roh-HTML ab und rendert die Seite dann vor der Indexierung mit einem Headless-Browser. Da das Rendering aufgeschoben und ressourcenintensiv ist, kann es dem Crawling hinterherhinken, weshalb letztlich die gerenderte Ausgabe für die Indexierung zählt.

Sehen Sie sich zunächst die Roh-HTML-Antwort an (den Quelltext, den der Server zurückgibt) und notieren Sie, welche Inhalte, Links und Metadaten vorhanden sind, bevor JavaScript ausgeführt wird. Untersuchen Sie dann das gerenderte DOM nach der Skriptausführung und vergleichen Sie beides.

  • [Seiten-URL] geprüft
  • Sind zentrale Inhalte des Bodys im Roh-HTML vorhanden?
  • Sind Überschriften, Text und Produktdaten im gerenderten DOM vorhanden?
  • Sind Navigation und interne Links nach dem Rendering vorhanden?
  • Sind Title, Meta-Description und Canonical nach dem Rendering vorhanden?

Markieren Sie alles, was erst nach der Ausführung von JavaScript erscheint. Solche Inhalte hängen vollständig vom erfolgreichen Rendering ab und tragen daher das größte Risiko. Dokumentieren Sie jede Abweichung zwischen Roh-HTML und gerendertem DOM als zu behebenden Befund.

Crawlbare Inhalte & Links

Stellen Sie sicher, dass Hauptinhalte und Navigation echte, crawlbare Links im DOM verwenden.

Verwenden Sie echte Links und im DOM vorhandene Inhalte

Suchmaschinen folgen Links über standardmäßige <a>-Elemente mit einem href-Attribut, das auf eine echte URL verweist. Links, die nur durch einen onclick-Handler, einen Button oder ein span ausgelöst werden, werden nicht zuverlässig entdeckt, sodass wichtige Seiten ungecrawlt bleiben können.

Gehen Sie Ihre wichtigsten Templates durch und bestätigen Sie, dass jeder navigierende und kontextuelle Link ein echter Anker mit crawlbarem href ist.

  • Die Hauptnavigation nutzt [a href]-Links
  • Paginierung und Filter geben crawlbare URLs preis
  • Verwandte und interne Links sind echte Anker, kein onclick
  • Hauptinhalte werden ins DOM gerendert, nicht hinter Interaktionen versteckt

Verlassen Sie sich nicht auf Klick-Ereignisse, Infinite Scroll ohne paginierte URLs oder Inhalte, die erst nach Nutzeraktionen laden, die der Googlebot nicht ausführt. Wenn Inhalte erst nach Tippen oder Scrollen erscheinen, behandeln Sie sie als gefährdet und stellen Sie einen crawlbaren Pfad dorthin bereit. Halten Sie fest, welche Links und Bereiche bestehen und welche einen echten href oder DOM-Präsenz benötigen.

Indexierbarkeit: Metadaten nach dem Rendering

Erkennen Sie per JS eingefügte noindex-, Canonical- oder robots-Überraschungen, die die Indexierung blockieren oder fehlleiten.

Prüfen Sie gerenderte Metadaten, nicht nur den Quelltext

Indexierungsanweisungen werden aus dem gerenderten HTML gelesen, sodass JavaScript, das sie einfügt oder ändert, die Indexierung einer Seite unbemerkt beeinflussen kann. Ein sauberer Quelltext kann nach der Skriptausführung dennoch ein noindex oder ein falsches Canonical ausliefern.

Untersuchen Sie für jedes Template das gerenderte DOM und bestätigen Sie, dass die Indexierungssignale Ihrer Absicht entsprechen.

  • Robots-Meta im gerenderten DOM: [index/noindex]
  • Canonical-Tag genau einmal vorhanden und auf die beabsichtigte URL zeigend
  • Kein JavaScript, das das Canonical auf eine andere URL wechselt
  • Title und Meta-Description ergeben nach dem Rendering die richtigen Werte
  • Hreflang und strukturierte Daten dort vorhanden, wo erwartet

Per JS eingefügte noindex- oder Canonical-Änderungen sind riskant, weil Google auf den gerenderten Wert reagieren kann. Seien Sie besonders vorsichtig bei Frameworks oder Tag-Managern, die Head-Elemente umschreiben. Wenn sich eine Anweisung zwischen rohem und gerendertem Zustand ändern kann, behandeln Sie das als Defekt und setzen Sie sie stattdessen serverseitig. Protokollieren Sie die gerenderten Anweisungen jeder Seite und alle Abweichungen.

Rendering-Strategie: CSR vs. SSR vs. SSG

Wählen Sie einen Rendering-Ansatz, der Inhalte zuverlässig für Crawler verfügbar macht.

Wählen Sie eine Rendering-Strategie, die Crawlbarkeit begünstigt

Wie Sie rendern, entscheidet, wie verlässlich Inhalte Suchmaschinen erreichen. Da Googles Rendering aufgeschoben ist, verringern Strategien, die Inhalte im initialen HTML ausliefern, das Risiko.

  • Client-seitiges Rendering (CSR): Der Browser baut die Seite aus JavaScript auf. Der Inhalt hängt vollständig vom erfolgreichen Rendering ab und trägt daher das größte Indexierungsrisiko.
  • Server-seitiges Rendering (SSR): Der Server gibt bei jeder Anfrage vollständig aufgebautes HTML zurück. Inhalte, Links und Metadaten sind sofort vorhanden.
  • Statische Seitengenerierung (SSG) oder Prerendering: HTML wird vorab erzeugt oder aus einer Prerender-Schicht ausgeliefert, was Inhalte bei starker Performance zuverlässig verfügbar macht.

Bevorzugen Sie für SEO-kritische Seiten SSR, SSG oder Prerendering, damit Inhalte im initialen HTML stehen. Behalten Sie schweres CSR für Bereiche hinter Authentifizierung oder mit geringem SEO-Wert vor.

Dokumentieren Sie Ihren aktuellen Ansatz je Template, die dadurch entstehenden Lücken und die Zielstrategie.

  • Template: [Name]
  • Aktuelle vs. Ziel-Rendering-Methode

Performance-Auswirkung von JavaScript

Reduzieren Sie JS-Gewicht und Ausführungskosten, damit Seiten für Nutzer und Crawler schnell rendern.

Reduzieren Sie die JavaScript-Kosten

Schweres JavaScript verlangsamt das Rendering für Nutzer und erhöht den Aufwand, den Suchmaschinen zum Rendern Ihrer Seiten betreiben müssen. Da das Rendering ressourcenintensiv ist, rendern schlankere Seiten zuverlässiger und laden schneller, was sowohl das Erlebnis als auch die Indexierung unterstützt.

Prüfen Sie, wie viel Skript jedes wichtige Template ausliefert und was es blockiert.

  • Große oder ungenutzte JavaScript-Bundles identifiziert
  • Render-blockierende Skripte, wo möglich, aufgeschoben oder aufgeteilt
  • Kritische Inhalte nicht hinter langsamer Skriptausführung gesperrt
  • Drittanbieter-Skripte auf Gewicht und Notwendigkeit geprüft
  • Core Web Vitals auf wichtigen Templates geprüft

Bevorzugen Sie Code-Splitting, das Entfernen ungenutzten Codes und das spätere Laden nicht kritischer Skripte, damit der Hauptinhalt schnell erscheint. Blockieren Sie niemals JavaScript- oder CSS-Dateien in der robots.txt, da dies Google daran hindert, die Seite so zu rendern, wie Nutzer sie sehen. Halten Sie Bundle-Größen, blockierende Ressourcen und die geplanten Korrekturen für jedes geprüfte Template fest.

Testen & Überwachen

Validieren Sie das Rendering mit echten Tools und behalten Sie es über die Search Console langfristig im Blick.

Testen Sie die gerenderte Seite und überwachen Sie sie

Überprüfen Sie Ihre Korrekturen an dem, was Google tatsächlich rendert. Das URL-Prüftool in der Search Console zeigt das gerenderte HTML und einen Screenshot der gecrawlten Seite und lässt Sie bestätigen, dass Inhalte, Links und Metadaten nach dem Rendering vorhanden sind.

Führen Sie jedes wichtige Template durch die Prüfung und erfassen Sie die Ergebnisse.

  • Das gerenderte HTML im URL-Prüftool enthält den Hauptinhalt
  • Der gerenderte Screenshot zeigt das erwartete Layout
  • Navigation und interne Links sind im gerenderten HTML vorhanden
  • Indexierungsanweisungen sind in der gerenderten Ausgabe korrekt
  • Während des Renderings wurden keine Fehler gemeldet

Gehen Sie dann von einmaligen Prüfungen zur laufenden Überwachung über.

  • Verfolgen Sie Abdeckungs- und Indexierungsberichte in der Search Console
  • Prüfen Sie nach größeren Framework- oder Template-Änderungen erneut
  • Achten Sie auf Seiten, die aus dem Index fallen

Protokollieren Sie jede getestete URL [URL], ihren Rendering-Status und alle nötigen Folgeschritte, damit Probleme früh erkannt werden und nicht erst, wenn die Rankings sinken.

So verwendest du diese Vorlage

  1. Listen Sie Ihre SEO-kritischen Templates auf (Startseite, Kategorie, Produkt, Artikel) und wählen Sie je eine repräsentative URL zum Prüfen aus.
  2. Sehen Sie sich für jede URL die Roh-HTML-Antwort an und notieren Sie, welche Inhalte, Links, Title, Meta-Description und Canonical vor der Ausführung von JavaScript vorhanden sind.
  3. Untersuchen Sie das gerenderte DOM nach der Skriptausführung und vergleichen Sie es mit dem Roh-HTML; markieren Sie alles, was erst nach dem Rendering erscheint.
  4. Bestätigen Sie, dass Hauptinhalte im DOM stehen und jeder navigierende und kontextuelle Link ein echter Anker mit crawlbarem href ist, kein onclick-Handler.
  5. Prüfen Sie die gerenderten Metadaten jeder Seite und verifizieren Sie die robots-Anweisung, ein einziges korrektes Canonical und kein JavaScript, das noindex- oder Canonical-Überraschungen einfügt.
  6. Überprüfen Sie die Rendering-Strategie je Template (CSR, SSR, SSG oder Prerender) und bevorzugen Sie serverseitig gerendertes oder prerender­tes HTML für SEO-kritische Seiten.
  7. Führen Sie jede URL durch das URL-Prüftool der Search Console und prüfen Sie das gerenderte HTML und den Screenshot, um Inhalte, Links und Anweisungen zu bestätigen.
  8. Halten Sie Befunde und Korrekturen je Template fest, stellen Sie sicher, dass die robots.txt kein JavaScript oder CSS blockiert, und richten Sie die Überwachung in der Search Console ein, um nach Änderungen erneut zu prüfen.

Profi-Tipps

  • Behandeln Sie das gerenderte DOM als maßgebliche Quelle für SEO, denn Google indexiert die gerenderte Seite, nicht nur das Roh-HTML, das Ihr Server zuerst zurückgibt.
  • Setzen Sie kritische Indexierungssignale wie Canonical und robots-Anweisungen serverseitig, da JavaScript, das sie nach dem Rendering einfügt oder ändert, riskant und leicht fehleranfällig ist.
  • Sperren Sie niemals JavaScript- oder CSS-Dateien in der robots.txt, sonst kann Google Ihre Seiten nicht so rendern, wie Nutzer sie sehen, und Inhalte könnten übersehen werden.
  • Führen Sie das URL-Prüftool auf wichtigen Templates nach jedem Framework-Upgrade oder jeder Template-Änderung erneut aus, da sich das Rendering-Verhalten verschieben und die Indexierung unbemerkt brechen kann.

Haeufige Fragen

Kann Google Inhalte indexieren, die mit JavaScript gerendert werden?

Ja. Google kann JavaScript ausführen und Inhalte indexieren, die im gerenderten DOM erscheinen. Allerdings ist das Rendering aufgeschoben und ressourcenintensiv, sodass es später als das Crawling erfolgen kann. Alles, was erst nach der Ausführung von JavaScript erscheint, hängt vom erfolgreichen Rendering ab, weshalb serverseitig gerendertes oder prerender­tes HTML für SEO-kritische Inhalte verlässlicher ist.

Was ist der Unterschied zwischen Roh-HTML und dem gerenderten DOM?

Roh-HTML ist die erste Antwort, die Ihr Server vor der Ausführung von JavaScript zurückgibt. Das gerenderte DOM ist die Seite, nachdem Skripte sie ausgeführt und verändert haben. Der Googlebot ruft das Roh-HTML ab, rendert dann die Seite und indexiert, was er in der gerenderten Ausgabe sieht. Ein Audit bedeutet, beides zu vergleichen, damit Sie wissen, welche Inhalte tatsächlich in den Index gelangen.

Warum müssen meine Links echte Anker-Tags sein?

Suchmaschinen entdecken und verfolgen URLs über standardmäßige Anker-Elemente, die einen href zu einer echten URL enthalten. Links, die nur über einen onclick-Handler, einen Button oder ein span funktionieren, werden nicht zuverlässig gecrawlt, sodass die dahinterliegenden Seiten möglicherweise nie gefunden werden. Stellen Sie wichtige Navigations- und Inhaltslinks stets als echte crawlbare Anker im DOM bereit.

Warum wären per JavaScript eingefügte noindex- oder Canonical-Tags ein Problem?

Google liest Indexierungsanweisungen aus dem gerenderten HTML, sodass eine per JavaScript hinzugefügte oder geänderte Anweisung wirksam werden kann, selbst wenn der Quelltext in Ordnung aussieht. Ein Skript, das noindex einfügt oder das Canonical auf die falsche URL umschreibt, kann eine Seite deindexieren oder fehlleiten. Diese Signale serverseitig zu setzen, vermeidet Überraschungen zwischen rohem und gerendertem Zustand.

Welche Rendering-Strategie ist die beste für SEO?

Bevorzugen Sie für SEO-kritische Seiten server-seitiges Rendering, statische Generierung oder Prerendering, damit Inhalte, Links und Metadaten im initialen HTML vorhanden sind und nicht davon abhängen, dass der Browser die Seite aufbaut. Client-seitiges Rendering ist riskanter, weil der Inhalt vollständig vom Rendering abhängt. Behalten Sie schweres client-seitiges Rendering für Bereiche mit geringem SEO-Wert oder authentifizierte Bereiche vor.

Wie bestätige ich, was der Googlebot tatsächlich rendert?

Verwenden Sie das URL-Prüftool in der Google Search Console. Es zeigt das gerenderte HTML und einen Screenshot davon, wie Google die Seite gecrawlt hat, sodass Sie verifizieren können, dass Inhalte, interne Links und Indexierungsanweisungen nach dem Rendering vorhanden sind. Stellen Sie außerdem sicher, dass die robots.txt kein JavaScript oder CSS blockiert, und prüfen Sie Seiten nach Template- oder Framework-Änderungen erneut.