Next.js & SEO: Entscheidend ist, was im HTML ankommt.

01 / GRUNDLAGE

Viele Dateien sind nicht automatisch ein SEO-Problem.

Bei einem Next.js-Build entstehen häufig mehrere JavaScript- und CSS-Dateien. Diese Chunks sind technische Ressourcen. Google bewertet eine Website nicht danach, ob im Hosting drei oder dreißig Dateien liegen. Relevant ist, welche URLs indexierbar sind, welche Inhalte auf diesen URLs vorkommen und ob Google die Seite zuverlässig crawlen und verarbeiten kann.

Eine klassische statische Website kann aus index.html, style.css und script.js bestehen. Eine Next.js-Seite kann denselben sichtbaren Inhalt auf mehrere Build-Dateien verteilen. Für die Suchintention ist die Dateizahl zunächst zweitrangig.

02 / RENDERING

Next.js kann Inhalte bereits vor dem JavaScript bereitstellen.

Next.js unterstützt Pre-Rendering. Dabei entsteht HTML, bevor der Browser die interaktive JavaScript-Schicht startet. Genau das ist für Inhaltsseiten interessant: Überschriften, Text, Links und Seitennavigation können schon in der ersten HTML-Antwort vorhanden sein.

Danach kann die sogenannte Hydration die vorhandene Oberfläche interaktiv machen. Das ist technisch sinnvoll, wenn eine Seite Formulare, Filter, dynamische Daten oder komplexe Anwendungen benötigt. Für eine reine Leistungs- oder Wissensseite ist jedoch oft weniger Client-JavaScript nötig.

Pre-Rendering und Interaktivität sind kein Widerspruch

Eine Seite kann also statisch lesbar und trotzdem interaktiv sein. Problematisch wird es erst, wenn zentrale Inhalte ausschließlich nachträglich über JavaScript entstehen oder wenn die Hydration fehlschlägt.

03 / RISIKEN

JavaScript wird dann relevant, wenn der Hauptinhalt davon abhängt.

Google kann JavaScript verarbeiten. Gleichzeitig macht ein JavaScript-Framework technische SEO komplexer als eine rein statische Seite. Aus Entwicklersicht sind vor allem vier Situationen relevant:

04 / PRAXIS

Bei VanillaDev haben wir Marketing-Inhalt und Anwendung bewusst getrennt.

Die Startseite von VanillaDev war ursprünglich stärker an einen Next.js-Build gekoppelt. Der Website-Checker und die Referenzen wurden dynamisch geladen. Für die organische Seitenstruktur war das nicht notwendig: Die Startseite sollte vor allem erklären, einordnen und zu klaren Zielseiten führen.

Deshalb wurde die Architektur getrennt. Die Startseite, Leistungsseiten, Fallstudien und Wissensinhalte liefern ihre relevanten Texte und Links direkt als HTML aus. Der interaktive Website-Checker besitzt dagegen eine eigene URL und behält dort die JavaScript-Logik, die für die Analyse tatsächlich gebraucht wird.

Diese Trennung ist kein allgemeines „Next.js ist schlecht“-Urteil. Sie ist eine Architekturentscheidung passend zum Seitentyp.

05 / PRÜFUNG

Vier einfache Tests zeigen, wie abhängig eine Seite von JavaScript ist.

1. Seitenquelltext ansehen: H1, Haupttext und wichtige interne Links sollten bei einer vorgerenderten Inhaltsseite bereits im ursprünglichen HTML zu finden sein.
2. JavaScript testweise deaktivieren: Die Seite muss nicht vollständig interaktiv bleiben. Der Kerninhalt sollte bei einer statisch gedachten Seite aber weiterhin verständlich sein.
3. Direkte URL aufrufen: Jede wichtige Seite sollte ohne vorherige Navigation direkt erreichbar sein und einen erfolgreichen HTTP-Status liefern.
4. Google Search Console nutzen: Mit der URL-Prüfung lässt sich kontrollieren, welche Seite Google abrufen und verarbeiten kann.

Zusätzlich lohnt sich der Blick auf Canonical, Meta-Robots, Sitemap, interne Verlinkung und Core Web Vitals. Keine einzelne Kennzahl ersetzt die Gesamtprüfung.

06 / SEO · GEO · KI

Für Googles KI-Suche gelten weiterhin die SEO-Grundlagen.

Google beschreibt für AI Overviews und AI Mode keine zusätzliche technische Pflicht, die klassische SEO ersetzen würde. Inhalte müssen weiterhin indexierbar und für die Suche geeignet sein. Google empfiehlt unter anderem crawlbare interne Links und wichtigen Inhalt in textlicher Form.

Auch eine besondere „AI-Datei“ oder ein spezielles GEO-Markup ist für Googles generative Suchfunktionen nicht erforderlich. Sinnvoller sind klare Themenstrukturen, nachvollziehbare Aussagen, sichtbarer Inhalt und strukturierte Daten, die zum sichtbaren Text passen.

Für VanillaDev bedeutet das: Leistungsseite, Fallstudie und Wissensartikel werden nicht isoliert aufgebaut. Sie verlinken sich thematisch gegenseitig. Dadurch entsteht eine nachvollziehbare Struktur für Menschen, Suchmaschinen und Systeme, die Inhalte maschinell einordnen.

07 / ENTSCHEIDUNG

Wann Next.js bleiben darf – und wann eine statische Seite sinnvoller ist.

Der Framework-Name ist nicht die SEO-Strategie. Die Architektur muss zum Inhalt und zur Funktion der jeweiligen URL passen.