Website mit KI erstellen: was die Werk­zeuge gut können und wo sie zu kurz greifen.

Mit KI-Werkzeugen lässt sich eine Website heute an einem Abend online stellen. Dieser Leitfaden erklärt, was diese Werkzeuge gut können und wo sie zu kurz greifen – mit den Zahlen aus unserer Studie, in der wir 40 KI-gebaute Websites gemessen haben. Am Ende steht eine Liste mit zehn Punkten, die Sie vor der Veröffentlichung prüfen sollten.

Welche Arten von Werkzeugen gibt es?

Es gibt drei Familien. Die erste sind Plattformen, die per Chat eine Website oder App bauen: Bei Werkzeugen wie Lovable, Bolt, Base44 und Create schreiben Sie, was Sie möchten, das Werkzeug erzeugt den Code und veröffentlicht die Website auf einer Subdomain seiner eigenen Domain. Die zweite sind KI-Programmierassistenten, die im Editor eines Entwicklers arbeiten; Code und Veröffentlichung verwaltet der Entwickler. Die dritte ist der KI-Modus fertiger Website-Baukästen: Baukästen wie Wix beginnen die Website mit einem Chat und lassen sie im eigenen Editor bearbeiten. Bei Wix ist der Einstieg mit KI kostenlos; um Ihre eigene Domain zu verbinden, ist ein Premium-Tarif nötig.

Die Zahlen in diesem Leitfaden stammen aus der ersten Familie: In unserem Messbeitrag haben wir 40 Websites, die auf den Subdomains dieser Werkzeuge veröffentlicht sind, am selben Tag nach denselben neun Kriterien gemessen.

Was können sie gut?

Sie sind schnell beim Entwurf. Sie bauen Seitenaufbau, Text und Bildplatzierung nach Ihrer Beschreibung auf und veröffentlichen die Website in einem Schritt; bei Lovable ist die Veröffentlichung in jedem Tarif möglich, und die Website erscheint unter der eigenen Adresse des Werkzeugs (projekt-name.lovable.app). Um eine Idee zu testen, für eine Kampagnenseite oder ein internes Werkzeug ist diese Geschwindigkeit ein echter Gewinn.

Auch die grundlegenden Tags sind meist vorhanden: Alle gemessenen Websites hatten einen Seitentitel und eine Sprachangabe, 98 % eine Meta-Beschreibung. Die Gesamtzeit, in der JavaScript den Hauptthread blockierte (TBT), war mit einem Median von 44 Millisekunden niedrig; das Problem liegt also nicht im schweren Code, sondern an den unten beschriebenen Stellen.

Wo greifen sie zu kurz?

• Inhalt im ersten HTML. Bei 45 % der Websites standen vor dem Ausführen von JavaScript weniger als 50 Wörter auf der Seite. Ein Browser oder Bot, der kein JavaScript ausführt, sieht diese Seiten leer. Die Frage ist, ob das Werkzeug die Seite vorrendert: Ein Teil der gemessenen Lovable-Websites war vorgerendert, ein Teil nicht.
• Barrierefreiheit. Die automatische Prüfung fand nur bei 23 % der Websites keinen Verstoß; das häufigste Problem war unzureichender Farbkontrast (68 %).
• Tempo. Der Median des mobilen PageSpeed-Insights-Werts lag bei 76; bis der größte Inhalt erschien (LCP), vergingen im Median 5,8 Sekunden, und nur 25 % blieben unter Googles Schwelle „gut“ von 2,5 Sekunden.
• KVKK. 8 der 40 Websites setzten Analyse- oder Werbe-Cookies, bevor der Besucher irgendetwas berührte; ein Datenschutzlink fand sich nur bei 53 % der Websites. Was eine Website veröffentlichen muss, erklären wir in den Leitfäden zur Cookie-Richtlinie und zu den Datenschutzhinweisen.
• Sprache und Mehrsprachigkeit. 2 der 11 türkischen Websites gaben die Seite als englisch aus. Erscheint die Website in mehreren Sprachen, braucht jede Sprache ihre eigene Adresse, und die Sprachen müssen aufeinander verweisen; das erklären wir im hreflang-Leitfaden.
• Strukturierte Daten. JSON-LD fand sich bei 65 % der Websites; bei den übrigen müssen Suchmaschinen und KI-Assistenten selbst aus der Seite ableiten, wer das Unternehmen ist.
• Sicherheits-Header. HSTS war auf allen Websites vorhanden, eine Content Security Policy (CSP) auf keiner. Bei einer Website auf einer Subdomain ist das die Einstellung der Plattform.
• Code-Eigentum und Portabilität. Lovable kann das Projekt in beide Richtungen mit einem Repository auf GitHub synchronisieren, das Ihnen gehört, und das in jedem Tarif; den Code direkt herunterzuladen ist in den bezahlten Tarifen möglich. Bolt erlaubt, das Projekt als ZIP-Datei herunterzuladen und außerhalb des Werkzeugs auszuführen. Bei Base44 gibt es die bidirektionale GitHub-Synchronisierung ab dem Builder-Tarif. Eine eigene Domain zu verbinden, erfordert bei Lovable einen bezahlten Tarif. Ob sich die Website eines Tages umziehen lässt, hängt davon ab, was Werkzeug und Tarif erlauben; fragen Sie das, bevor Sie beginnen.

Die acht oben genannten Lücken haben gemeinsam, dass keine davon auf dem Bildschirm sichtbar ist. Eine Seite, die ordentlich aussieht, kann ein leeres erstes HTML haben, Schaltflächen ohne Namen oder Cookies, die ohne Rückfrage gesetzt werden; das zeigt die Messung, nicht das Auge. Keine der 40 gemessenen Websites erfüllte alle neun Kriterien zugleich: Eine Content Security Policy hatte keine einzige. Prüfen Sie die Website, die das Werkzeug erzeugt hat, deshalb vor der Veröffentlichung mit den zehn Punkten unten, einmal im Browser und einmal mit Messwerkzeugen. Keine der Prüfungen erfordert Programmierkenntnisse; die meisten gelingen mit den Werkzeugen des Browsers, mit PageSpeed Insights oder mit den kostenlosen Werkzeugen dieser Website.

Wann reicht es, wann nicht?

Um eine Idee zu testen, für eine kurzlebige Kampagnenseite, ein internes Werkzeug oder einen Prototyp für das erste Kundengespräch reichen diese Werkzeuge oft aus. Für eine Unternehmenswebsite, die Kunden über Suchmaschinen und KI-Assistenten erwartet, ein Formular, das personenbezogene Daten erhebt, eine mehrsprachige Exportwebsite oder eine Organisation mit Barrierefreiheitspflichten ist das Werkzeug ein Anfang. Jede der oben genannten Lücken muss gesondert gemessen und geschlossen werden; ohne Messung sollte nichts als „fertig“ gelten.

Zehn Prüfungen vor der Veröffentlichung

1. Öffnen Sie den Seitenquelltext (im Browser „Seitenquelltext anzeigen“): Steht Ihr Text dort, oder nur ein leerer Container? Unser Werkzeug Maschinenlesung stellt dieselbe Frage.
2. Stimmt die Sprachangabe der Seite: auf einer türkischen Website lang="tr"?
3. Hat jede Seite ihren eigenen Titel, ihre eigene Beschreibung und kanonische Adresse?
4. Sind robots.txt und eine XML-Sitemap online?
5. Gibt es strukturierte Daten (JSON-LD), die Ihr Unternehmen beschreiben?
6. Ist der Kontrast von Text und Schaltflächen ausreichend, und hat jede Schaltfläche und jeder Link einen Namen? Der Kontrastprüfer beantwortet die erste Frage.
7. Liegt der mobile LCP in PageSpeed Insights unter 2,5 Sekunden?
8. Werden beim ersten Laden ohne Einwilligung Analyse- oder Werbe-Cookies gesetzt? Sind Datenschutzhinweise und Cookie-Richtlinie verlinkt?
9. Ist Ihre eigene Domain verbunden, und erlaubt Ihr Tarif das?
10. Liegt der Code in einem Repository, das Ihnen gehört, oder lässt er sich herunterladen; was geschieht mit der Website, wenn Sie das Werkzeug verlassen?

Unser Ansatz

Auch diese Website entwickeln wir mit KI-Unterstützung; der Unterschied liegt in Messung und Test: Jede Änderung wird vor der Veröffentlichung an den Kriterien dieser Liste gemessen.

Wenn Sie die Antworten auf diese Fragen auf Ihrer eigenen Website sehen möchten: Corporate Webdesign liefert Design, Code und technisches SEO aus einer Hand, mit einem messbaren Budget.