Technisches SEO für Flutter und individuelle Web-Apps
Eine mit Flutter entwickelte oder vollständig individuell geschriebene Web-App bietet Nutzern oft eine flüssige Erfahrung. Bei Suchmaschinen zählt dagegen vor allem, ob der Inhalt der Seite bereits in der ersten Antwort an den Browser enthalten ist. In diesem Artikel beschreiben wir, worauf es bei technischem SEO für Flutter und individuelle Web-Apps ankommt.
Der Unterschied zwischen App und Website
Ein Dashboard, in das man sich einloggt, und eine Landingpage, die jeder über die Suchergebnisse erreichen soll, haben unterschiedliche Anforderungen. Das Dashboard muss in keiner Suchmaschine erscheinen. SEO-Sorgen gibt es dort deshalb nicht. Landing-, Blog- und Produktseiten dagegen müssen crawlbar sein, sonst findet sie niemand. Wer diese Trennung zu Projektbeginn trifft, weiß sofort, welche Technologie wo eingesetzt wird.
Flutter Web und Suchmaschinen
Flutter-Web-Apps zeichnen die Oberfläche in der Regel auf eine Zeichenfläche, der Text der Seite liegt also nicht als gewöhnliche HTML-Tags vor. Flutter kann für die Barrierefreiheit einen Semantikbaum erzeugen, der ersetzt aber kein einfaches HTML vom Server. Wer nur auf Flutter Web setzt, geht deshalb ein Risiko ein, wenn es wichtig ist, dass die Inhalte in den Suchergebnissen erscheinen. Das aktuelle Verhalten ändert sich womöglich mit der Flutter-Version. Ein Blick in die offizielle Dokumentation lohnt sich.
Praktische Lösung: Inhaltsseiten trennen
Viele Teams veröffentlichen die Seiten, die in der Suche erscheinen müssen (Landing, Blog, Preise, Kontakt), als serverseitig erzeugtes oder statisches HTML. Die App selbst läuft mit Flutter unter einem Unterpfad oder einer Subdomain. Das nutzt sowohl die Entwicklungsgeschwindigkeit von Flutter als auch die Crawlbarkeit von HTML-Seiten.
Dieselbe Frage bei individuellen Single-Page-Apps
Bei Single-Page-Apps mit React, Vue oder Angular sehen manche Bots den Inhalt nie, wenn er erst nach der Ausführung von JavaScript im Browser entsteht. Serverseitiges Rendering beseitigt dieses Risiko, ebenso vorab erzeugte statische Seiten. Werkzeuge wie Next.js, Nuxt und Angular SSR unterstützen das.
Adressen, Titel und Links
Jede Seite sollte eine eigene, aussagekräftige Adresse haben. Adressen mit Hash (#) innerhalb der Seite sind keine gute Wahl. Besser ist die normale Pfadstruktur, und in Flutter Web lässt sich dafür eine pfadbasierte URL-Strategie verwenden. Titel und Beschreibung sollten pro Seite einzigartig sein. Interne Links sollten echte Link-Tags sein, denn Schaltflächen, die nur über ein JavaScript-Klickereignis funktionieren, zählen für Bots nicht als Links.
Richtige Statuscodes und Sitemap
Für eine nicht existierende Adresse gehört der Code 404 in die Antwort. Single-Page-Apps liefern oft für jede Adresse dasselbe Grundgerüst mit dem Code 200 aus, was in Suchmaschinen zu Soft-404-Problemen führen kann. Die Sitemap sollte die Adressen auflisten, die gecrawlt werden sollen, und aktuell gehalten werden.
Messen und Überprüfen
Das URL-Prüftool in der Search Console zeigt, wie die Suchmaschine Ihre Seite sieht. Fehlt dort der Haupttext, liegt ein Problem vor. Ein Blick in den Quelltext der Seite ist eine einfache erste Kontrolle. Er kostet nichts.
Fazit
Technisches SEO für Flutter und individuelle Web-Apps beginnt damit, dass der Inhalt fertig im Browser ankommt. In unserem Service für mobile Apps planen wir Flutter-Projekte mit dieser Trennung im Blick. Kontaktieren Sie uns, wenn Sie Ihr Projekt gemeinsam bewerten möchten.
Übrigens: Sie sind gerade der Beweis.
Wenn Sie diesen Artikel über eine Suche gefunden haben, sind Sie ein lebendiges Beispiel für genau das, worüber wir hier schreiben – sichtbar sein, wenn es darauf ankommt. Wir erreichen das nicht nur für uns selbst, sondern auch für unsere Kunden. Lassen Sie uns besprechen, wie wir das für Ihr Unternehmen erreichen →
Häufig gestellte Fragen
Ist SEO mit Flutter Web möglich?
Nur eingeschränkt und abhängig von der Version. Muss Ihr Inhalt auffindbar sein, ist es der sicherere Weg, ihn mit crawlbaren HTML-Seiten zu ergänzen.
Sind Single-Page-Apps schlecht für SEO?
Nicht von sich aus. Kommt der Inhalt fertig vom Server, gibt es kein Problem, ein Risiko besteht nur, wenn er erst im Browser entsteht.
Verursachen Adressen mit Hash (#) Probleme?
Ja, bei dieser Struktur behandeln Suchmaschinen die Seiten in der Regel nicht als getrennte Adressen. Die normale Pfadstruktur sollte bevorzugt werden.
Muss ich meine bestehende App neu schreiben?
Meistens nicht. Es kann genügen, die Seiten, die in der Suche erscheinen müssen, auszugliedern oder ihnen serverseitiges Rendering hinzuzufügen.