Ik bouwde een AI-generator voor bedrijfswebsites: dit gebeurt er echt onder de motorkap
Ik zit achter WebSir (websir.fr), een SaaS-platform dat uit een brief in gewone taal een complete bedrijfswebsite genereert, gedeployd en bereikbaar in minder dan 30 minuten. Dit artikel is een technisch verslag: waarom ik de tool heb gebouwd, hoe de generatiepipeline werkt, en waarom een door AI gegenereerde website een handgemaakte Webflow-site kan verslaan op Web Vitals. Bonus aan het eind: een kortingscode van 20%.
De landingspagina van WebSir, de gebruiker beschrijft zijn project in het Frans aan de conversationele assistent, en de generatie start. Voorgestelde alt-tekst: “Homepage van WebSir met de chatinterface om in gesprek met een AI een bedrijfswebsite te maken”.
Waarom nog een AI-generator voor bedrijfswebsites?
Als ontwikkelaar kreeg ik jarenlang dezelfde vraag van ambachtslieden, freelancers en kleine bedrijven: “ik wil gewoon een simpele site, die snel laadt, waarop ik zelf een telefoonnummer kan wijzigen zonder iemand te bellen”. Het antwoord van de industrie was WordPress plus een Elementor-thema, of recenter Wix, Webflow en consorten. In beide gevallen blijft het probleem hetzelfde: de stack is zwaar, de client-side gerenderde DOM is opgeblazen, en de kleinste tekstwijziging vraagt dat je je een weg zoekt door een visuele interface met de complexiteit van een goedkope Photoshop.
Zodra LLM’s goed genoeg werden om gestructureerde HTML en CSS te produceren, wilde ik het probleem omdraaien: in plaats van de gebruiker te leren omgaan met een builder, vraag je hem in eigen woorden te beschrijven wat hij wil. En daarachter niet nóg een WordPress-site genereren, maar pure statische HTML, geserveerd vanaf de edge, zonder JavaScript-framework aan de clientkant. Zo ben ik bij WebSir uitgekomen.
De gebruikersreis, van buitenaf gezien
De gebruiker maakt een account aan (e-mail + wachtwoord, Google, Facebook of Apple), typt een zin als “ik ben osteopaat in Lyon, ik wil een sobere site, eerder saliegroen, met een pagina over mij, een tarievenpagina, een contactpagina en een pagina met juridische vermeldingen” en de chat doet de rest. De agent verzamelt de details die hij nodig heeft (kleuren, toon, sector, gewenste structuur) en start dan de generatie. De voortgang wordt live gestreamd: de gebruiker ziet de AI stap voor stap werken, structuur, content, design, code, assets, validatie, zonder te moeten raden wat er in de blackbox gebeurt.
Na een paar minuten is de site klaar om te bekijken. De gebruiker kan dan wijzigingen vragen (altijd via chat, nooit via een opgelegde visuele editor) en de afbeeldingen, de kleuren en de paginastructuur bijstellen. Is hij tevreden, dan gaat hij een deploytraject van 5 stappen in: SEO, domein, social, betaling, contact. En pas bij de stap betaling komt Stripe in beeld: een complete site genereren is volledig gratis, alleen de effectieve deployment start de facturatie. Een radicaal en bewust freemiummodel: lukt het de AI niet om een site te maken die bevalt, dan heeft de gebruiker niets uitgegeven.
Onder de motorkap: WebForge, de generatie-engine
Hier wordt het interessant voor ontwikkelaars. WebForge is een zelfstandige Node.js / TypeScript-binary die ik speciaal voor dit gebruik heb ontworpen. Hij orkestreert de volledige generatie van de site: analyse van de brief, schrijven van de content, keuze van het design, assemblage van de code, optimalisatie van de assets en de eindvalidatie. Alles wordt intern aangestuurd en de voortgang gaat live naar de webapplicatie, zodat de gebruiker nooit voor een zwijgende spinner zit.
De WebSir-editor tijdens een generatie: de linkerkolom toont live de WebForge-fasen (code schrijven, template valideren, QA), het middenpaneel toont de site die in elkaar wordt gezet. Voorgestelde alt-tekst: “WebSir-editor die live de WebForge-generatiefasen toont en de preview van de bedrijfswebsite die de AI aan het maken is”.
Meerdere fasen die je tijdens de generatie ziet
In plaats van één monolithische call te vragen om een complete site te produceren (het klassieke recept voor een teleurstellend resultaat), ketent WebForge meerdere gespecialiseerde fasen aan elkaar. Je ziet ze letterlijk voorbijkomen in het linkerpaneel terwijl de site wordt gegenereerd.
Een deel van die fasen wordt door de AI aangestuurd, de fasen die creatief of redactioneel oordeel vragen (het project kaderen, de content schrijven, het design kiezen, de code produceren). Andere fasen zijn volledig deterministisch, zonder ook maar één LLM-call: die nemen de build, de validatie en de autocorrectie voor hun rekening. Zij vangen de typische fouten van een AI-generatie op, een CSS-klasse die niet bestaat, een vergeten slot, een inconsistent kleurenpalet, een paginaritme dat twee keer dezelfde sectie stapelt.
Het resultaat van die verdeling is simpel: de creativiteit blijft bij de AI, de strengheid bij geteste code. Dat is de sleutel om een door AI gegenereerde bedrijfswebsite te leveren die niet hallucineert, en die met een reproduceerbaar kwaliteitsniveau uit de pipeline komt in plaats van op goed geluk.
Een eigen toolbox voor de agent
De AI-agent schrijft de site niet “met de hand” in ruwe completion. Hij beschikt over een getypeerde toolbox die ik specifiek voor het maken van bedrijfswebsites heb gedefinieerd: bestanden lezen, schrijven en bewerken, componenten instantiëren uit een interne bibliotheek, templates valideren, en een hele reeks beeldtools (illustraties genereren, logo genereren, favicon genereren, afbeelding bewerken, achtergrond verwijderen).
De agent kiest zelf de relevante tools op basis van de fase waarin hij zit, en een deel van de tools is per context afgeschermd, je wilt bijvoorbeeld niet dat een kritische reviewfase stiekem code begint te herschrijven. Die discipline in de tooling is het verschil tussen een Twitter-demo en een product dat het in productie volhoudt.
Zodra de site is gegenereerd, kan de gebruiker uiteraard verder chatten met de AI, maar hij kan ook rechtstreeks op elk blok van de pagina klikken om het in context aan te passen: een titel wijzigen, een call to action bijstellen, een afbeelding vervangen. De editor houdt kennis van de structuur (hero, diensten, testimonials, footer…) en stelt de wijzigingen voor die bij het geselecteerde bloktype passen.
Rechtstreekse visuele selectie van een “hero”-blok op een gegenereerde site: de gebruiker klikt op de zone die hij wil wijzigen en de editor past de wijziging toe zonder de structuur te breken. Voorgestelde alt-tekst: “Bewerking in context van een heroblok op een door AI gegenereerde bedrijfswebsite in de WebSir-editor”.
Waarom statische HTML in 2026?
Veel vergelijkbare platformen produceren een monsterlijke JavaScript-applicatie (Wix laadt makkelijk 2 tot 3 MB JS op de eerste pagina). WebSir doet radicaal het omgekeerde: de gegenereerde sites zijn HTML / CSS / vanilla JS ES2022+. Nul framework aan de clientkant. Geen React, geen Vue, geen Alpine.js, geen jQuery. De CI dwingt de regel af: een script blokkeert elke merge die een verboden dependency opnieuw zou binnenhalen.
Meetbare gevolgen:
- Minimale LCP, geen hydration, geen JS-bundle om te parsen voordat de content verschijnt
- Onmiddellijke FID, weinig JavaScript op de main thread
- Lichte bundle, een paar kilobytes JS voor de interacties (mobiel menu, accordeons), niet meer
- Vanzelfsprekende toegankelijkheid, geen virtuele DOM, de HTML is zoals ze is leesbaar voor schermlezers en SEO-crawlers
- Robuustheid, een site die perfect blijft werken, ook als JS uitstaat
Aan de infrastructuurkant wordt de site geserveerd via een wereldwijd distributienetwerk (edge CDN). Concreet wordt elke pagina uitgeleverd vanaf het point of presence dat het dichtst bij de bezoeker ligt, waar ter wereld hij ook zit. Geen applicatieserver om te schalen, geen cache om met de hand te invalideren: de upload, het injecteren van de metatags, de DNS-configuratie en het legen van de cache zijn bij elke herdeployment volledig geautomatiseerd. Eigen domeinen regel je in een paar klikken, met automatisch SSL-certificaat.
Getypeerde variabelen: een voorsprong op de AVG
Dit is waarschijnlijk het deel waar ik technisch het trotst op ben, en het deel dat andere platformen niet doen. Elk terugkerend openbaar gegeven van een site, telefoonnummer, e-mail, adres, SIRET, naam van de hoster, huidig jaar, loopt via een tag <var data-key="…"> of een attribuut data-bind-{attr}="key".
Het LLM ziet nooit de echte waarde. WebForge krijgt alleen de sleutels en de metadata (label, type, verplicht of niet). De echte substitutie gebeurt achteraf, op het moment van de deployment, door een renderengine die de waarden vlak voor publicatie injecteert.
Concrete voordelen: de echte persoonsgegevens passeren niet langs een externe AI-leverancier, je wijzigt een telefoonnummer voor de hele site in één handeling, en je kunt een vlag “gevoelig gegeven” aanzetten die extra versleuteling activeert op variabelen die niet voor publicatie bedoeld zijn. Voor wie een professionele bedrijfswebsite met AI wil genereren en tegelijk AVG-conform wil blijven, is die scheiding tussen content en data doorslaggevend.
Beveiliging en operationele hygiëne
Een paar details die tellen op een blog voor ontwikkelaars:
- 2FA met TOTP verplicht
- Anti-brute-force op twee niveaus: 5 mislukte pogingen zetten het account 15 minuten op slot
- Contactformulieren beschermd door meerdere lagen, waaronder honeypot, minimale invultijd, weigering van wegwerpdomeinen, MX-controle en Turnstile, 100% geautomatiseerd
- Bestandsupload in de formulieren: MIME-whitelist, maximale grootte per inzending, ClamAV aan de serverkant
Waarom een door AI gegenereerde site een handgemaakte kan verslaan
Het intuïtieve argument luidt: “een mens doet het op het creatieve vlak altijd beter dan een machine”. Voor design klopt dat nog gedeeltelijk, maar voor technische performance steeds minder, en dat is het echte speelveld van moderne SEO.
Een freelancer die een Webflow-site of een in elkaar geknutseld WordPress-thema oplevert, maakt weinig kans om op de Core Web Vitals een pipeline te kloppen die vanaf het begin is ontworpen om geoptimaliseerde statische HTML te genereren, gevalideerd door een reeks deterministische checks en uitgerold op een wereldwijde edge. Tel daarbij op:
- Schema.org-tags die systematisch voor elke pagina worden geïnjecteerd (LocalBusiness, Article, BreadcrumbList naargelang de context)
- Een sitemap.xml die automatisch wordt gegenereerd en ingediend
- Open Graph-metatags en Twitter Cards, ingesteld bij de stap “Social” van het traject
- Ingebouwde analytics zonder externe SDK om te laden
- Afbeeldingen die in WebP of AVIF worden geserveerd zodra de browser dat ondersteunt
…en je krijgt een site die zonder extra werk al de belangrijkste aanbevelingen van Google Page Experience afvinkt. Komt er een crawler langs, dan vindt die leesbare HTML en geen React-skelet dat nog gehydrateerd moet worden. Klikt een bezoeker, dan staat de pagina er in een paar honderd milliseconden, vanaf het dichtstbijzijnde point of presence.
Google Lighthouse-audit van een door WebSir gegenereerde bedrijfswebsite: 100/100 op Performance, Toegankelijkheid, Best practices en SEO. Geen enkele handmatige optimalisatie, de score komt zo uit de generatiefase. Voorgestelde alt-tekst: “Google Lighthouse-score 100/100/100/100 op een door de AI van WebSir gegenereerde bedrijfswebsite, gemeten op Performance, Toegankelijkheid, Best practices en SEO”.
Prijzen en kortingscode (het stuk waar je op wachtte)
Het actieve aanbod heet gewoon Site vitrine. 39,90 € excl. btw per maand, met een jaaroptie van 430,92 € excl. btw per jaar die 10 % scheelt. Inbegrepen:
- Tot 20 pagina’s, juridische vermeldingen en privacybeleid meegerekend
- Een eigen domein of een subdomein op
*.websir.fr - Het SSL-certificaat, automatisch beheerd
- Een wereldwijd CDN aan de edge
- Een ingebouwde analytics zonder cookiebanner
- Onbeperkte contactformulieren, met bestandsupload en antispam
- Onbeperkt wijzigen via chat (de AI blijft ook na publicatie beschikbaar)
- E-mailsupport
En dan het stuk waarvoor ik dit artikel vandaag schrijf: voor de lezers van deze blog heb ik een kortingscode van 20 % op het eerste abonnement klaargezet.
Kortingscode: SITE20
20 % korting, in te voeren bij de stap Checkout van het deploytraject.
Ter herinnering: de site genereren is gratis. Je maakt een account aan, brieft de AI, bekijkt het volledige resultaat, vraagt alle wijzigingen die je wilt, en gebruikt de code SITE20 pas op het moment dat je echt beslist om de site online te zetten. Bevalt het resultaat niet, dan heb je niets uitgegeven.
Wat er (nog) niet in WebSir zit
Voor de eerlijkheid: dit bestaat vandaag niet. De aanbiedingen dynamische site en e-commerce staan op de planning maar zijn nog niet beschikbaar. De doeltechnologie ligt niet vast, ik weet al wat ik niet ga gebruiken (geen WordPress, geen PrestaShop, geen Shopify) maar nog niet waar ik voor kies. Heb je vandaag al een webshop of een backoffice nodig, dan is WebSir niet het juiste antwoord, ik zeg het je liever voordat je je bankkaart intikt dan erna.
WebSir richt zich ook in de eerste plaats op de Franstalige markt. De gegenereerde content is standaard in het Frans, de juridische pagina’s zijn op het Franse recht geënt, en de conversationele agent begrijpt briefings in het Frans beter dan in andere talen. Meertalige ondersteuning komt eraan, maar is nu niet de prioriteit.
Conclusie: wat dit verandert voor een ontwikkelaar
Ben je ontwikkelaar en vragen je niet-technische vrienden je nog steeds “kun je niet even een siteje voor me in elkaar knutselen”, dan weet je hoe vervelend het wordt om dat gratis te blijven doen. WebSir aanraden voor de behoefte “professionele bedrijfswebsite snel online, met een domein en contactformulieren die werken” geeft je je weekend terug. En ben je zelf freelancer en neem je opdrachten voor bedrijfswebsites aan in onderaanneming, dan kun je WebSir als versneller gebruiken: laat de AI de basis produceren en factureer de personalisatietijd aan je eindklant.
De code SITE20 blijft geldig voor alle lezers van deze blog. Ga naar websir.fr, maak een account aan, beschrijf wat je wilt en kijk de pipeline aan het werk. Wil je dieper in het technische deel duiken, dan verdient WebForge waarschijnlijk een eigen artikel, laat het weten in de comments en ik werk het templatesysteem en het autocorrectiemechanisme uit in een volgende post.
Artikel geschreven door de maker van WebSir, voor ontwikkelaars die willen begrijpen wat er in 2026 echt gebeurt als je een bedrijfswebsite met AI genereert.
