Ich habe einen KI-Generator für Firmenwebsites gebaut: das steckt wirklich unter der Haube
Ich stehe hinter WebSir (websir.fr), einer SaaS-Plattform, die aus einem Briefing in natürlicher Sprache in weniger als 30 Minuten eine komplette Firmenwebsite erzeugt, deployt und online stellt. Dieser Artikel ist ein technischer Erfahrungsbericht: warum ich das Werkzeug gebaut habe, wie die Generierungs-Pipeline arbeitet und warum eine von KI erzeugte Website bei den Web Vitals eine handgebaute Webflow-Seite schlagen kann. Als Bonus am Ende: ein Rabattcode über 20 %.
Die Landingpage von WebSir, der Nutzer beschreibt sein Projekt auf Französisch im Chat-Assistenten, und die Generierung startet. Vorgeschlagener Alt-Text: „Startseite von WebSir mit der Chat-Oberfläche, über die im Gespräch mit einer KI eine Firmenwebsite entsteht“.
Warum noch ein KI-Generator für Firmenwebsites?
Als Entwickler habe ich jahrelang dieselbe Anfrage von Handwerkern, Freelancern und Kleinbetrieben gehört: „Ich will einfach nur eine schlichte Seite, die schnell lädt und auf der ich eine Telefonnummer ändern kann, ohne jemanden anzurufen.“ Die Antwort der Branche war WordPress plus ein Elementor-Theme, zuletzt eher Wix, Webflow und Konsorten. Das Problem bleibt in beiden Fällen dasselbe: Der Stack ist schwer, das clientseitig gerenderte DOM ist aufgebläht, und für die kleinste redaktionelle Änderung muss man sich durch eine visuelle Oberfläche klicken, die die Komplexität eines Photoshop für Arme hat.
Als die LLMs gut genug wurden, um strukturiertes HTML und CSS zu produzieren, wollte ich das Problem von hinten aufrollen: Statt dem Nutzer einen Builder beizubringen, lässt man ihn in seiner eigenen Sprache beschreiben, was er will. Und dahinter entsteht keine weitere WordPress-Seite, sondern reines statisches HTML, ausgeliefert vom Edge, ohne JavaScript-Framework auf dem Client. So kam WebSir zustande.
Der Ablauf aus Sicht des Nutzers
Der Nutzer registriert sich (E-Mail plus Passwort, Google, Facebook oder Apple), tippt einen Satz wie „Ich bin Osteopath in Lyon und möchte eine schlichte Seite, eher salbeigrün, mit einer Vorstellungsseite, einer Preisseite, einer Kontaktseite und einem Impressum“, und der Chat übernimmt den Rest. Der Agent fragt Details nach (Farben, Tonfall, Branche, gewünschte Struktur) und startet dann die Generierung. Der Fortschritt wird in Echtzeit gestreamt: Der Nutzer sieht die KI Schritt für Schritt arbeiten, Struktur, Inhalt, Design, Code, Assets, Validierung, statt raten zu müssen, was in der Blackbox vorgeht.
Nach wenigen Minuten lässt sich die Seite in der Vorschau ansehen. Der Nutzer kann Änderungen verlangen (immer im Chat, nie über einen aufgezwungenen visuellen Editor), Bilder, Farben und Seitenstruktur anpassen. Ist er zufrieden, folgt eine Deployment-Strecke in fünf Schritten: SEO, Domain, Social, Zahlung, Kontakt. Und erst im Schritt Zahlung kommt Stripe ins Spiel: Eine komplette Website zu generieren ist vollständig kostenlos, abgerechnet wird nur das tatsächliche Deployment. Ein radikales und bewusst gewähltes Freemium-Modell: Bringt die KI keine Seite zustande, die gefällt, hat der Nutzer nichts ausgegeben.
Unter der Haube: WebForge, die Generierungs-Engine
Hier wird es für Entwickler interessant. WebForge ist eine eigenständige Binary in Node.js und TypeScript, die ich genau für diesen Anwendungsfall gebaut habe. Sie orchestriert die gesamte Generierung: Analyse des Briefings, Schreiben der Inhalte, Wahl des Designs, Zusammenbau des Codes, Optimierung der Assets und die abschließende Validierung. Alles läuft intern, und der Fortschritt wird der Web-Anwendung in Echtzeit gemeldet, damit der Nutzer nie vor einer stummen Sanduhr sitzt.
Der WebSir-Editor während einer Generierung: Die linke Spalte zeigt die WebForge-Phasen in Echtzeit (Code schreiben, Template validieren, QA), das mittlere Panel die Seite im Aufbau. Vorgeschlagener Alt-Text: „WebSir-Editor mit den Generierungsphasen von WebForge in Echtzeit und der Vorschau der Firmenwebsite, die gerade von der KI erstellt wird“.
Mehrere sichtbare Phasen während der Generierung
Statt einen einzigen monolithischen Aufruf eine komplette Website produzieren zu lassen (das klassische Rezept für ein enttäuschendes Ergebnis), reiht WebForge mehrere spezialisierte Phasen aneinander. Du siehst sie im linken Panel buchstäblich durchlaufen, während die Seite entsteht.
Ein Teil dieser Phasen wird von der KI gesteuert, die, die kreatives oder redaktionelles Urteilsvermögen verlangen (Projekt einordnen, Inhalte schreiben, Design wählen, Code produzieren). Andere Phasen sind vollständig deterministisch, ganz ohne LLM-Aufruf: Sie kümmern sich um Build, Validierung und Selbstkorrektur. Sie fangen die typischen Fehler einer KI-Generierung ab, eine CSS-Klasse, die es nicht gibt, ein vergessener Slot, eine unstimmige Farbpalette, ein Seitenrhythmus, der dieselbe Sektion zweimal stapelt.
Das Ergebnis dieser Aufteilung ist einfach: Die Kreativität bleibt bei der KI, die Strenge bei getestetem Code. Genau das ist der Schlüssel zu einer KI-generierten Firmenwebsite, die nicht halluziniert und die die Pipeline mit reproduzierbarer Qualität verlässt statt auf gut Glück.
Ein eigener Werkzeugkasten für den Agenten
Der KI-Agent schreibt die Seite nicht „von Hand“ im reinen Completion-Modus. Er hat einen typisierten Werkzeugkasten, den ich eigens für die Produktion von Firmenwebsites definiert habe: Dateien lesen, schreiben und bearbeiten, Komponenten aus einer internen Bibliothek instanziieren, Templates validieren, dazu eine ganze Reihe von Bild-Tools (Illustrationen erzeugen, Logo erzeugen, Favicon erzeugen, Bilder bearbeiten, Hintergrund entfernen).
Der Agent wählt die passenden Werkzeuge je nach laufender Phase selbst aus, und ein Teil der Werkzeuge ist je nach Kontext gesperrt, man will zum Beispiel nicht, dass eine kritische Review-Phase heimlich anfängt, Code umzuschreiben. Diese Disziplin beim Tooling macht den Unterschied zwischen einer Twitter-Demo und einem Produkt, das in der Produktion hält.
Ist die Seite einmal generiert, kann der Nutzer natürlich weiter im Chat mit der KI sprechen, er kann aber auch direkt auf einen beliebigen Block der Seite klicken und ihn im Kontext ändern: eine Überschrift austauschen, einen Call-to-Action anpassen, ein Bild ersetzen. Der Editor kennt die Struktur weiterhin (Hero, Leistungen, Referenzen, Footer …) und schlägt die Änderungen vor, die zum ausgewählten Blocktyp passen.
Direkte visuelle Auswahl eines „Hero“-Blocks auf einer generierten Seite: Der Nutzer klickt auf den Bereich, den er ändern will, und der Editor übernimmt die Änderung, ohne die Struktur zu zerlegen. Vorgeschlagener Alt-Text: „Bearbeitung eines Hero-Blocks im Kontext auf einer KI-generierten Firmenwebsite im WebSir-Editor“.
Warum statisches HTML im Jahr 2026?
Viele vergleichbare Plattformen produzieren eine monströse JavaScript-Anwendung (Wix lädt auf der ersten Seite locker 2 bis 3 MB JS). WebSir macht das radikale Gegenteil: Die generierten Seiten sind HTML, CSS und Vanilla JS ab ES2022. Null Framework auf dem Client. Kein React, kein Vue, kein Alpine.js, kein jQuery. Die Regel wird von der CI durchgesetzt: Ein Skript blockiert jeden Merge, der eine verbotene Abhängigkeit wieder einschleusen würde.
Messbare Folgen:
- Minimaler LCP, keine Hydration, kein JS-Bundle, das vor der Anzeige des Inhalts geparst werden muss
- Sofortiger FID, kaum JavaScript auf dem Main Thread
- Leichtes Bundle, ein paar Kilobyte JS für die Interaktionen (mobiles Menü, Akkordeons), mehr nicht
- Barrierefreiheit von Haus aus, kein virtuelles DOM, das HTML ist für Screenreader und SEO-Crawler direkt lesbar
- Robustheit, eine Seite, die auch bei deaktiviertem JS noch einwandfrei funktioniert
Auf der Infrastrukturseite wird die Website über ein weltweites Auslieferungsnetz (Edge-CDN) bereitgestellt. Konkret heißt das: Jede Seite wird am Point of Presence ausgeliefert, der dem Besucher am nächsten liegt, egal wo auf der Welt er sitzt. Kein Application Server, der skaliert werden muss, kein Cache, der von Hand invalidiert wird: Upload, Einspielen der Meta-Tags, DNS-Konfiguration und Cache-Purge laufen bei jedem Redeployment vollautomatisch. Eigene Domains sind mit wenigen Klicks eingerichtet, samt automatischem SSL-Zertifikat.
Typisierte Variablen: ein Schritt voraus bei der DSGVO
Auf diesen Teil bin ich technisch wahrscheinlich am meisten stolz, und andere Plattformen machen das nicht. Jede wiederkehrende öffentliche Angabe einer Website, Telefonnummer, E-Mail, Adresse, SIRET-Nummer, Name des Hosters, laufendes Jahr, läuft über ein <var data-key="…">-Tag oder ein Attribut data-bind-{attr}="key".
Das LLM sieht den echten Wert nie. WebForge bekommt ausschließlich die Schlüssel und die Metadaten (Label, Typ, Pflichtfeld oder nicht). Ersetzt wird erst danach, beim Deployment, durch eine Render-Engine, die die Werte unmittelbar vor der Veröffentlichung einsetzt.
Der konkrete Nutzen: Echte personenbezogene Daten laufen nicht über einen fremden KI-Anbieter, eine Telefonnummer lässt sich in einem einzigen Vorgang für die gesamte Website ändern, und es gibt ein Flag „sensible Daten“, das für nicht zur Veröffentlichung bestimmte Variablen eine zusätzliche Verschlüsselung auslöst. Wer eine professionelle Firmenwebsite von einer KI erstellen lassen und dabei DSGVO-konform bleiben will, für den ist diese Trennung von Inhalt und Daten entscheidend.
Sicherheit und Betriebshygiene
Ein paar Details, die in einem Entwicklerblog zählen:
- TOTP-2FA verpflichtend
- Brute-Force-Schutz auf zwei Ebenen: Nach 5 Fehlversuchen wird das Konto 15 Minuten lang gesperrt
- Kontaktformulare mit mehreren Schutzschichten: Honeypot, Mindestausfüllzeit, Ablehnung von Wegwerfdomains, MX-Prüfung, Turnstile, zu 100 % automatisiert
- Datei-Uploads in den Formularen: MIME-Whitelist, maximale Größe je Einsendung, ClamAV auf dem Server
Warum eine KI-generierte Website eine handgebaute schlagen kann
Das intuitive Argument lautet: „Ein Mensch macht bei der Kreation immer noch alles besser als eine Maschine.“ Beim Design stimmt das teilweise, bei der technischen Performance aber immer weniger, und die ist das eigentliche Spielfeld des modernen SEO.
Ein Freelancer, der eine Webflow-Seite oder ein zusammengeschustertes WordPress-Theme abliefert, hat bei den Core Web Vitals wenig Chancen gegen eine Pipeline, die von Anfang an auf optimiertes statisches HTML ausgelegt ist, von einer Reihe deterministischer Checks geprüft und auf ein weltweites Edge-Netz deployt wird. Dazu kommen:
- Schema.org-Auszeichnungen, die für jede Seite systematisch eingespielt werden (LocalBusiness, Article, BreadcrumbList je nach Kontext)
- Eine sitemap.xml, die automatisch erzeugt und eingereicht wird
- Open-Graph-Meta-Tags und Twitter Cards, konfiguriert im Schritt „Social“ der Strecke
- Eine eingebaute Analytics ohne externes SDK, das geladen werden müsste
- Bilder in WebP oder AVIF, sobald der Browser das unterstützt
… und schon hast du eine Seite, die ohne weiteres Zutun die wichtigsten Empfehlungen von Google Page Experience erfüllt. Kommt ein Crawler vorbei, findet er lesbares HTML statt eines React-Skeletts, das erst hydriert werden muss. Klickt ein Besucher, erscheint die Seite in wenigen hundert Millisekunden vom nächstgelegenen Point of Presence.
Google-Lighthouse-Audit einer mit WebSir generierten Firmenwebsite: 100/100 bei Performance, Barrierefreiheit, Best Practices und SEO. Ohne manuelle Optimierung, der Score kommt direkt aus der Generierungsphase. Vorgeschlagener Alt-Text: „Google-Lighthouse-Score 100/100/100/100 für eine von der KI WebSir generierte Firmenwebsite, gemessen bei Performance, Barrierefreiheit, Best Practices und SEO“.
Preise und Rabattcode (der Teil, auf den du gewartet hast)
Das aktive Paket heißt schlicht Firmenwebsite. 39,90 € netto pro Monat, wahlweise 430,92 € netto pro Jahr, was 10 % spart. Enthalten sind:
- Bis zu 20 Seiten, Impressum und Datenschutzerklärung inbegriffen
- Eine eigene Domain oder eine Subdomain unter
*.websir.fr - Das automatisch verwaltete SSL-Zertifikat
- Ein weltweites CDN am Edge
- Eine eingebaute Analytics ohne Cookie-Banner
- Unbegrenzte Kontaktformulare, mit Datei-Upload und Spamschutz
- Unbegrenzte Änderungen per Chat (die KI bleibt auch nach der Veröffentlichung erreichbar)
- Support per E-Mail
Und jetzt der Teil, wegen dem ich diesen Artikel heute schreibe: Für die Leser dieses Blogs habe ich einen Rabattcode über 20 % auf das erste Abonnement hinterlegt.
Rabattcode: SITE20
20 % Nachlass, einzugeben im Checkout-Schritt der Deployment-Strecke.
Zur Erinnerung: Die Generierung der Website ist kostenlos. Du kannst ein Konto anlegen, die KI briefen, das komplette Ergebnis ansehen, beliebig viele Änderungen verlangen und den Code SITE20 erst dann einsetzen, wenn du dich wirklich entscheidest, die Seite online zu stellen. Gefällt dir das Ergebnis nicht, hast du nichts ausgegeben.
Was (noch) nicht in WebSir steckt
Der Ehrlichkeit halber: Das hier gibt es heute nicht. Die Pakete dynamische Website und E-Commerce sind geplant, aber noch nicht verfügbar. Die Zieltechnologie steht nicht fest, ich weiß schon, was ich nicht nehmen werde (weder WordPress noch PrestaShop noch Shopify), aber noch nicht, worauf es hinausläuft. Wer heute einen Onlineshop oder ein fachliches Backoffice braucht, ist mit WebSir falsch beraten, das sage ich lieber, bevor du deine Kreditkartennummer eintippst, als danach.
Ebenso zielt WebSir in erster Linie auf den französischsprachigen Markt. Die generierten Inhalte sind standardmäßig auf Französisch, die Rechtsseiten sind am französischen Recht ausgerichtet, und der Chat-Agent versteht französische Briefings besser als andere Sprachen. Mehrsprachigkeit kommt, hat aber gerade keine Priorität.
Fazit: was sich für Entwickler ändert
Wenn du Entwickler bist und deine nicht-technischen Freunde dich immer noch fragen „kannst du mir nicht schnell eine kleine Seite basteln“, dann weißt du, wie mühsam es wird, diese Bitte gratis zu erfüllen. WebSir für den Bedarf „professionelle Firmenwebsite schnell online, mit Domain und funktionierenden Kontaktformularen“ zu empfehlen, gibt dir dein Wochenende zurück. Und wenn du selbst Freelancer bist und Aufträge für Firmenwebsites im Unterauftrag annimmst, kannst du WebSir als Beschleuniger nutzen: Die KI liefert die Basis, und du stellst deinem Endkunden die Zeit für die Individualisierung in Rechnung.
Der Code SITE20 gilt für alle Leser dieses Blogs. Geh auf websir.fr, leg ein Konto an, beschreibe, was du willst, und sieh der Pipeline bei der Arbeit zu. Wer tiefer in die Technik einsteigen will: WebForge verdient wahrscheinlich einen eigenen Artikel, schreib es in die Kommentare, dann gehe ich im nächsten Beitrag auf das Template-System und den Mechanismus zur Selbstkorrektur ein.
Geschrieben vom Entwickler hinter WebSir, für Entwickler, die verstehen wollen, was 2026 wirklich passiert, wenn eine KI eine Firmenwebsite generiert.
