AI-gegenereerde website herkennen: zo voorkom je dat je site eenheidsworst wordt

Open tien B2B SaaS-homepages in tien tabbladen en dek de logo’s af. De meeste worden inwisselbaar: dezelfde gecentreerde kop, dezelfde pill-badge erboven, dezelfde rij kaarten eronder, dezelfde blauw-paarse gloed achter de hero.

Elke pagina is degelijk. Geen enkele blijft hangen. Mensen herkennen de AI-gegenereerde look snel, zoals ze vroeger een Elementor-site of een standaard WordPress-thema herkenden, en veel mensen noemen het AI slop. Herkennen is niet hetzelfde als er schade van hebben, en ik vond geen enkel onderzoek dat laat zien dat het deals kost. Wat het wel kost, is onderscheidend vermogen. Het lijkt alsof niemand ergens over heeft nagedacht.

Ik bouw al meer dan 20 jaar websites en had ooit een webbureau, dus die look springt er voor mij meteen uit. Ik vind hem ook saai. Smaak is subjectief en de mijne is geen bewijs. Hieronder houd ik uit elkaar wat je zelf kunt controleren en wat gewoon mijn mening is.

Waarom AI-gegenereerde websites op elkaar lijken

Een model bouwt een pagina uit het gemiddelde van alle pagina’s die het ooit heeft gezien. Vraag om een SaaS-landingspagina en je krijgt de meest waarschijnlijke, tot en met het lettertype, het verloop en de volgorde van de secties.

Dezelfde trek zie je in tekst. In een experiment in Science Advances (2024) vonden Doshi en Hauser dat verhalen met door AI gesuggereerde ideeën creatiever werden beoordeeld, maar meetbaar meer op elkaar leken. Het gaat om korte verhalen en niet om websites, maar het beschrijft het mechanisme.

Mensen leveren deze standaardkeuzes ook zelf af. WordPress-thema’s en Elementor-kits deden dat jarenlang, en componentbibliotheken maken dezelfde keuzes tenzij iemand ze overschrijft. Een CHI-studie uit 2021 analyseerde zo’n 228.000 screenshots van ongeveer 10.500 websites uit de jaren 2003 tot en met 2019. Vanaf 2007 leken sites steeds meer op elkaar. Vooral in de layout. De studie is van vóór generatieve AI en gaat over het Amerikaanse web.

Lees de kenmerken hieronder dus als checklist en niet als leugendetector. De nuttige vraag is of iemand dit heeft gekozen, niet of een machine het heeft gemaakt.

Wat het bewijs zegt over AI slop-design

De meeste checklists zijn patroonherkenning van ontwerpers en developers. Een paar mensen hebben gemeten.

Developer Adrian Krebs liet een headless browser los op ongeveer 1.600 recente Show HN-landingspagina’s en paste per patroon één deterministische test toe. Hij zette 22% in de zware band (vier of meer patronen), 32% in het midden en 46% in de schone band. Zo’n 5 tot 10% waren valse positieven. Zijn steekproef bestaat uit indie-productlanceringen en niet uit B2B-sites, en hij zegt zelf duidelijk dat één patroon niets bewijst.

Een paper van IOV Labs uit juni 2026 bouwde een detector rond 27 kenmerken en scoorde 202 goed beoordeelde sites. De mediane site scoorde 0, waarbij lager beter is. Pagina’s uit AI-standaardinstellingen scoorden 35 tot 59. De paper vond ook dat merkpaars geen kenmerk is, want Stripe gebruikt het veel en scoort toch 0. Inter is het ook niet: Linear gebruikt het met een echt typografisch systeem. Wat een pagina verraadt, zijn standaardkeuzes zonder iets bewusts ernaast.

Ga voorzichtig om met beide. De paper is een concept van één auteur en de drempels zijn afgesteld op dezelfde 202 sites, dus dat topsites bijna op nul uitkomen zit deels in de opzet ingebakken.

Kosten AI-achtige websites vertrouwen of conversie?

Ik vond geen onderzoek dat dit test voor AI-achtige sites, en ook geen voor B2B. Wat er is, is ouder en grenst er alleen aan.

Consumentenonderzoek zegt dat de look van een site de geloofwaardigheid beïnvloedt, maar niets daarvan gaat over AI-achtige sites:

• Fogg en collega’s van Stanford. 2.684 mensen beoordeelden de geloofwaardigheid van echte websites. Het uiterlijk was de meest genoemde factor in hun commentaar, met 46,1%. Dat waren consumentensites.
• Een replicatie uit 2015. Die analyseerde 15.750 opmerkingen van 2.041 mensen en vond ontwerptermen in 12 tot 19% van de beoordelingen van financiële sites die zij onderzocht, veel minder dan 46%. Ze zocht op trefwoorden in plaats van opmerkingen met de hand te coderen, dus de getallen zijn niet rechtstreeks vergelijkbaar.
• Lindgaard en collega’s meldden dat mensen de visuele aantrekkelijkheid van een pagina in zo’n 50 milliseconden beoordelen. Dat zegt iets over een eerste indruk en niets over aankopen.
• Everard en Galletta. In hun experiment bezochten 272 studenten proefwebwinkels. Waargenomen gebreken in de presentatie verlaagden de waargenomen kwaliteit, daarna het vertrouwen en daarna de koopintentie.

Het dichtstbijzijnde bewijs gaat over tekst. In een CHI-experiment uit 2019 vonden Jakesch en collega’s dat Airbnb-hosts minder werden vertrouwd als hun profielen verdacht werden van AI-teksten, maar alleen als deelnemers een mix van door AI en door mensen geschreven profielen zagen. Een paper uit 2025 van Schilke en Reimann liep 13 experimenten en vond dat mensen die AI-gebruik melden minder worden vertrouwd, een effect dat volgens de auteurs kan verdwijnen naarmate AI gewoon wordt. Niets hiervan gaat over hoe een site eruitziet. Als een bezoeker een generieke look als teken van AI leest, kan dezelfde argwaan gelden, maar dat is een gevolgtrekking en niemand heeft het voor websites getest.

B2B verandert de volgorde van gebeurtenissen. In het rapport van 6sense uit 2025, dat gebaseerd is op bijna 4.000 kopers, stond de winnende leverancier in 95% van de gevallen al op de shortlist van de koper op dag één. AI-zoekopdrachten helpen die shortlist nu mee te vormen, zoals ik uitleg in mijn artikel over zichtbaar zijn in ChatGPT, Perplexity en Google AI. Het rapport komt van een leverancier. De methode is onduidelijk. Als het klopt, bevestigt of ondermijnt je site vooral een reputatie die er al was vóór het bezoek.

Is een AI-gegenereerde website herkennen gewoon een kwestie van smaak?

Deels wel. Wat mij saai lijkt, kan een ander prima vinden, en smaak is niet te bewijzen. Maar smaak is niet willekeurig. Het is patroonherkenning die je opbouwt door veel werk te zien, en wat je hebt gezien bepaalt hoeveel je kunt zien.

Waarom ervaring helpt om een AI-gegenereerde website te herkennen

Tien jaar sites bouwen voor kleine lokale winkels leert je één bereik van wat een website kan zijn. Werk voor grote en kleine merken in meerdere landen leert je een breder bereik. Bij muziek en kunst is dat volgens mij hetzelfde. Tastemakers hebben veel meer gehoord dan de meeste mensen, en art directors blijven galeries en musea bezoeken om te zien wat er leeft en om geïnspireerd te raken. Na verloop van tijd ontwikkel je een gevoel voor wat goed is, en kun je steeds minder goed uitleggen waarom.

Wat onderzoek zegt over hoe getrainde ogen webdesign beoordelen

Er is onderzoek dat dezelfde kant op wijst, al gaat het over schilderijen en niet over websites. Hekkert en van Wieringen deden in 1996 een studie, zoals latere artikelen die beschrijven, waarin mensen zonder kunstopleiding originele postimpressionistische schilderijen verkozen boven bewerkte, abstracte versies. Kunststudenten in hun laatste jaar zagen weinig verschil. Opleiding veranderde wat ze zagen en wat ze mooi vonden.

Waarom generiek AI-design prettig oogt en makkelijk te missen is

Vertrouwd is ook niet hetzelfde als lelijk. In een studie uit 2012 liet Tuch met collega’s mensen screenshots van echte websites zien, 119 in het eerste experiment, tussen 17 en 1.000 milliseconden. Pagina’s met lage visuele complexiteit en een typische indeling werden als zeer aantrekkelijk beoordeeld, al binnen de eerste 50 milliseconden. Een typische site is prettig. Iedereen heeft hem al eens gezien. Daarom komt generiek niet als slecht over en is het zo makkelijk te missen.

Waar de AI-design-checklist voor dient

De checklist hieronder doet dus één ding. Hij maakt iemands smaak controleerbaar voor een ander. Het oog vervangt hij niet: je moet nog steeds naar de pagina kijken. Lees mijn oordelen als geïnformeerde mening en niet als meting.

18 ontwerpkenmerken van een AI-gegenereerde website

Deze lijst bundelt patronen uit meerdere checklists, de detectors van Krebs en IOV en de open catalogus achter Impeccable, een tool die AI-standaardkeuzes in design signaleert. Zie het als dingen om naar te kijken en niet als score.

Identiteit en layout

• Geen herkenbare visuele identiteit. Dek het logo af en de pagina kan van een concurrent zijn.
• Een standaardpagina: een gecentreerde hero met een pill-badge boven de kop, een strook logo’s, featurekaarten en een rij cijfers waarvan niemand de bron kent.
• Tekstsecties die op elkaar gestapeld staan, zonder eigen visueel idee.
• Spacing, uitlijning, radius en componentstijlen die van sectie tot sectie een beetje verschillen, of dezelfde grote radius en zachte schaduw op elke kaart.
• Koppen en lopende tekst die bijna even groot zijn, zodat niets een rangorde heeft.
• Genummerde stappen “1, 2, 3” die niet echt een volgorde zijn.

Lettertype en kleur

• Eén lettertype overal, of te veel stijlen zonder logica voor wanneer welke verschijnt.
• Eén woord in een kop dat gekleurd, onderstreept of cursief in een serif is gezet, en dat op elke kop terugkomt.
• Een uppercase label boven bijna elke titel. Het is geen structuur meer zodra het boven elke sectie staat.
• Verlopen op de hero, de knoppen en soms de kop zelf, met gekleurde gloed onder kaarten of een vage halo achter de hero.

Componenten en beeld

• Dezelfde kaarten, icoontegels en dashboardmockups die je al op tientallen andere sites zag.
• AI-beelden, zachte vormen en zwevende 3D-tegels waar een echte productscreenshot hoort.
• Frosted-glass-panelen, of een gekleurde streep langs de linkerrand van een kaart of een citaat.
• Emoji’s als iconen en een sparkle bij alles waar AI op staat. Nielsen Norman Group testte die sparkle en ontdekte dat niemand hem met kunstmatige intelligentie associeerde.
• Testimonials van John Smith, met een stockavatar en zonder getal.

Beweging en tekst

• Dezelfde fade-up op elke sectie met dezelfde timing, zodat de pagina ademt als een metronoom.
• Een logostrook die zelf scrolt, een statusstip die pulseert terwijl er niets te melden is, of bounce-easing op gewone knoppen.
• Koppen die op 10.000 andere sites kunnen staan, slogans in de vorm “Niet dit. Dat.” en een gedachtestreepje in bijna elke zin. Een punt of een komma leest meestal beter, en op zichzelf is het streepje een zwak signaal, want veel mensen die zelf schrijven gebruiken het ook.

Geen van deze punten is op zichzelf een probleem. Samen lezen ze als netjes en niet als bedoeld.

Hoe het er samen uitziet

Twee voorbeelden laten de kenmerken op één plek zien, in twee kleurenschema’s. Het eerste is een mockup van een fictief bedrijf. Het is paars en indigo. Het tweede is een hero die ik met Lovable maakte voor een gids over GEO, in donkerblauw en teal.

Een mockup van de homepage van een fictief bedrijf, gemaakt om de kenmerken te laten zien. De nummers horen bij de lijst hieronder. De tekst in het beeld is Engels.

De ergste kenmerken zitten net zo goed in de woorden als in de layout:

1. Een hero met een paars-indigo verloop en zachte, gloeiende vlekken.
2. Een pill-badge met een sparkle-emoji (“AI-Powered Platform”) boven een gecentreerde kop.
3. Een kop en subkop die op 10.000 andere sites passen: “Transform your paper with AI”, “cutting-edge machine learning to supercharge your paper procurement”, “unlock your full potential”.
4. Een getal waarvan niemand de bron kent (“Trusted by 2,400+ forward-thinking paper companies worldwide”) en een strook logo’s die alleen grijze vakjes zijn.
5. Een klein uppercase label boven een generieke kop (“Everything you need to succeed”).
6. Drie identieke kaarten met emoji in plaats van iconen en beweringen die niets bewijzen (“Lightning Fast”, “Seamless Integrations”).
7. Een vinklijst met beloftes zonder bewijs (“99.9% uptime SLA”, “24/7 priority support”).

Het tweede voorbeeld is de hero die ik met Lovable maakte:

Een hero gemaakt met Lovable. Tel de kenmerken. De tekst in het beeld is Engels.

Geteld met dezelfde lijst zie je ten minste dit:

• Een pill-badge met een sparkle-icoon boven de kop (“Complete Guide”), en dezelfde sparkle nog een keer op de “AI Answer”-kaart.
• Accentkleur op de sleutelwoorden van de kop, de subkop en het citaat, in elk herhaald.
• Een donkere achtergrond met een fijn raster en een gloed achter de antwoordkaart.
• Twee mockupkaarten met dezelfde afgeronde hoeken, en genummerde cirkels 1, 2, 3.
• Een klein uppercase label (“SHIFT”) tussen de kaarten.
• Tekst opgebouwd als “Niet dit. Dat.”: “Stop chasing Page 1. Start optimizing for the AI shortlist.”

Volgens mijn telling van de 16 kenmerken die een screenshot kan laten zien (alle 18 behalve de fade-up en de anonieme testimonials) scoort deze hero 10, even hoog als de hoogste van de acht B2B-sites die ik verderop heb bekeken. Tussen de twee voorbeelden veranderden de kleuren, van paars en indigo naar donker en teal. De gewoonten bleven. Een label, een accent, een gloed, een mockup en een slogan. Een verzorgde pagina kan er nog steeds uitzien alsof niemand hem heeft gemaakt.

Tekenen van AI in de broncode van een website

Sommige kenmerken zitten onder de oppervlakte: in de basis die een snelle build overslaat, in de stack, en in de paginabron en scripts die je in de browsertools kunt openen.

Gaten die bij snelle builds horen

Deze gaten zijn op zichzelf geen teken van AI. Genoeg handgemaakte sites hebben ze, en ik vond geen onderzoek dat vergelijkt hoe vaak AI-sites en handgemaakte sites ze hebben. Ze wijzen op een site die snel is gebouwd en nooit is nagelopen. Iedereen kan er in een paar minuten op controleren:

• Een contactadres dat niet op het eigen domein van het bedrijf staat, of helemaal geen.
• Zwakke SEO-basis, zoals een ontbrekende meta description, een ontbrekende of tweede H1, of ontbrekende OpenGraph-gegevens.
• Koppen die van H1 naar H4 springen.
• Afbeeldingen zonder alt-tekst.
• Console-logs die in de build zijn blijven staan.
• Pop-ups die inhoud bedekken, zwak contrast op donkere achtergronden en layouts die niet meeschalen naar een telefoon.

Bouwers op Reddit noemen deze gaten als ze het over AI-sites hebben, en kaplich, die 100 vibe-coded sites op dev.to analyseerde, vond dezelfde soort. Zijn steekproef bestond uit showcasepagina’s en hij gebruikte zijn eigen tool, dus lees het als een patroon en niet als een percentage. Zie een cluster als reden om beter te kijken. Eén los exemplaar betekent niets.

De stack die gegenereerde sites delen

Voor nieuwe apps raadt de GPT-5 prompting guide van OpenAI Next.js, Tailwind en shadcn/ui of Radix voor componenten aan, met iconen van Lucide, Heroicons of Material Symbols, en lettertypen als Inter, Geist of Manrope. Dat is een redelijke gereedschapskist. Het is ook een aannemelijke reden waarom zoveel gegenereerde sites dezelfde kaarten, dezelfde iconen en hetzelfde lettertype delen, al heeft niemand dat verband gemeten.

Commentaar in de broncode

Commentaar is nog een plek om te kijken. Het gaat mee naar elke bezoeker, dus open de paginabron of de scriptbestanden in de browsertools en je kunt het lezen. Ik opende de broncode van een Nederlandse bureausite die er volledig handgemaakt uitziet. Er stonden 32 opmerkingen in de pagina. Acht waren langer dan 250 tekens. Ze legden beslissingen uit met gemeten getallen en noteerden wat de code eerst deed. Ze verwezen naar de eigen controlescripts van het team. Generieke labels als “Header”, “Main Content” en “Footer” stonden ernaast.

Zo schrijft een AI-codeerassistent notities aan zichzelf. Een zorgvuldige developer kan ook zo schrijven, dus ik lees het als een aanwijzing en niet als bewijs. Het laat wel iets nuttigs zien: een site kan er door een mens gemaakt uitzien en toch met AI zijn gebouwd. Daarom zijn ontwerp en code twee aparte controles.

Dezelfde gewoonte kwam terug in de JavaScript-bestanden van de andere sites die ik bekeek. Van de acht homepages hadden er drie tientallen uitleg-opmerkingen in hun eigen scripts, en één had zijn notities gedateerd in de week voordat ik keek.

Wat Anthropic en OpenAI zeggen over hun eigen AI-designstandaarden

Zowel Anthropic als OpenAI publiceert richtlijnen die de standaardkeuzes van hun modellen benoemen. De tabel laat zien welk ontwerpkenmerk elk van beide noemt, op basis van de pagina’s die ik las. Een gat betekent dat ik het daar niet vond. Het is geen ontkenning.

Een korte tijdlijn:

• 7 augustus 2025. De GPT-5 prompting guide van OpenAI raadt de hierboven genoemde stack van Next.js, Tailwind en shadcn/ui aan.
• 12 november 2025. Anthropic legt uit waarom zijn modellen naar veilige standaarden convergeren (“distributional convergence”) en noemt de lettertypen en kleuren die het bedoelt.
• Maart 2026. De frontend-gids voor GPT-5.4 van OpenAI vertelt het model dezelfde standaarden te vermijden.
• Oktober 2026. De huidige frontend-design skill van Anthropic noemt crème, serif en terracotta een kenmerk, inclusief de accentkleur van Claude’s eigen interface (#D97757) als een opdracht daar uitkomt.

Lees de tabel als erkenning van de leveranciers en niet als detector. Een stijl die naar één tool wijst, bewijst niets, want ontwerpers combineren tools en elke leverancier vertelt zijn model nu zijn eigen standaarden te vermijden.

Voorbeelden van AI-gegenereerde websites: drie soorten in acht B2B-sites

Ik haalde acht B2B-homepages door dezelfde controles: de kenmerken hierboven, geteld in de eerste drie schermen van elke site, en het commentaar dat in de broncode staat. Acht sites zijn een steekproef en geen studie, en ik kan van geen enkele bewijzen dat hij met AI is gebouwd. Er kwamen drie patronen uit. Met “bewust” bedoel ik hieronder dat je iets kunt aanwijzen wat alleen dit bedrijf zou hebben gekozen: een kleur, een tekening, een foto of een zin die op de site van een concurrent niet zou werken.

Het ziet eruit als AI. Drie sites kwamen op 8 tot 10 van de 16 kenmerken die ik telde. Samen laten ze het grootste deel van de lijst zien: een serif-kop met één cursief woord, kleine uppercase of monospace labels boven de titels, kaarten met dezelfde radius en zachte schaduw, een dashboardmockup, een strook die zelf scrolt. Eén site zette een gedachtestreepje in zijn eigen kop. Die kwam gemiddeld op bijna negen per duizend woorden, terwijl de andere sites tussen nul en drie zaten.

Het ziet er bewust uit, maar is met AI gebouwd. Eén site scoorde 2,5 van de 16. Hij heeft een eigen kleur, een echte oprichter in beeld en een illustratie die erbij hoort. De broncode vertelt een ander verhaal. Lange opmerkingen leggen elke beslissing uit met gemeten getallen en een geschiedenis van wat de code eerst deed. Een tweede site heeft een eigen palet en echte foto’s, maar zijn scripts bevatten tientallen notities die gedateerd zijn in de week voordat ik keek. Op het ontwerp alleen mis je deze groep.

Het ziet er bewust uit, en ik vond niets dat naar AI wijst. Eén site scoorde 6,5, omdat hij de huidige donkere stijl met serif en monospace volgt. Hij heeft ook hoekmarkeringen rond zijn knoppen, eigen isometrische tekeningen en korte opmerkingen in de code met maten uit een ontwerpbestand. Een tweede site is lang en specifiek. Zijn scripts bevatten geen uitleg-opmerkingen.

De achtste site paste in geen van de drie: hij was strak en eenvoudig, en zijn code was lastig te beoordelen.

De site die 6,5 scoorde is de les: een hoge score maakt een site niet generiek als iemand de standaarden heeft gekozen. Daarom tel ik de kenmerken en kijk ik daarna naar de pagina.

Waarom een AI-achtige website ertoe doet voor een B2B SaaS-merk

Een buying committee zoekt redenen waarom een leverancier veilig is. Een site die op die van iedereen lijkt, zegt dat je competent en inwisselbaar bent.

Consistent genoeg om professioneel over te komen, zonder een standpunt dat sterk genoeg is om te onthouden: herkenbaar, maar vervangbaar.

Waarom het verbieden van kenmerken in je AI-prompt ze niet oplost

Zeg een AI-tool dat hij paars en Inter moet overslaan en dat doet hij. Daarna grijpt hij naar de volgende standaarden: een crèmeachtergrond met terracotta accent, een serif-kop met één cursief woord, kleine monospace labels, haarlijnen die uit een krant lijken te komen. Dat worden nu al kenmerken. De leveranciers hebben dezelfde cirkel opgemerkt: de tabel hierboven laat zien dat beide hun modellen vertellen dezelfde lettertypen en hetzelfde paars op wit te vermijden.

In een experiment op solodesign.cc verminderde geschreven anti-slop-richtlijn de kenmerken in gegenereerde pagina’s niet betrouwbaar, terwijl een mechanische controle dat wel deed. Het ging om 42 handmatig beoordeelde builds, gescoord met de eigen detector van de auteur, dus zie het als een aanwijzing.

Te veel corrigeren werkt ook niet. Parallax, aangepaste cursors en geanimeerde achtergronden maken een site niet onderscheidend. Onthoudbare sites zijn meestal ingetogen, met weinig keuzes die overal worden toegepast.

Zo vermijd je een AI-achtige website zonder brandbureau

Een volledig brandtraject lost een groter probleem op dan de meeste vroege SaaS-bedrijven hebben. Veel van de founders met wie ik werk kunnen er geen betalen, en ze hebben het vaak ook niet nodig.

Wat ze nodig hebben is kleiner: een handvol bewuste keuzes, één keer gemaakt en overal toegepast. Een palet met rollen, een lettertypepaar, één radius- en spacingschaal, één idee voor de opbouw van de pagina en één detail dat iemand onthoudt. Het is een lijst en geen merkidentiteit.

Het is ook de lijst die je een AI-tool geeft voordat hij iets bouwt, want de tool vult elk gat dat jij laat met zijn eigen standaard.

Zo zet je een website met AI op in 3 stappen

De meeste generieke sites zijn generiek omdat de tool niets specifieks had om mee te werken. Volgens mij los je dat met drie dingen op voordat de eerste pagina bestaat. Het is mijn lezing en geen gemeten effect.

1. Geef de tool een brein met twee lagen

Ik raad aan de tool een brein met twee lagen te geven:

• De kennislaag is de gezamenlijke kennis van jou, je team en je bedrijf: bestaande content en SOP’s, salesgesprekken, interviews en podcasts. Die wordt meestal één keer opgebouwd en daarna met rust gelaten. Hij werkt beter als hij gekoppeld blijft aan je AI-agents en het internet, zodat hij zichzelf blijft bijwerken.
• De contextlaag is waar veel founders tekortschieten. Ze hebben genoeg kennis, maar missen de context om er actie van te maken: positionering, ideaal klantprofiel, strategie en doelen. Met die laag begrijpt het systeem niet alleen wat het moet zeggen, maar ook wanneer het publiceert, wanneer het zich inhoudt en wanneer het een e-mail triggert.

Zonder beide schrijft de tool de gemiddelde pagina voor jouw categorie, en dat is de kop die op 10.000 andere sites kan staan. Hoe de snelst groeiende B2B SaaS-bedrijven founderkennis in alles stoppen wat ze publiceren, lees je in mijn artikel over founder-led marketing.

2. Schrijf een design system vóór de eerste pagina

Bouw je zelf met AI? Begin met het design system. Vraag Claude Code om de handvol keuzes uit de vorige sectie als bestanden uit te schrijven: het palet met rollen, het lettertypepaar, de radius- en spacingschaal. Voeg de componenten toe die je nodig hebt en een lijst met wat je niet wilt. Bouw de pagina’s daarna uit die bestanden. Niet uit een prompt.

Het werkt ook met Codex. Codex leest een projectbestand met de naam AGENTS.md voordat het aan het werk gaat, net zoals Claude Code CLAUDE.md leest, dus het design system kan in het project staan, welke tool je ook gebruikt.

3. Houd de site makkelijk bij te werken

Astro met een headless CMS zoals Sanity is een goede manier om dat bij te houden. Astro bouwt de pagina’s en Sanity bewaart de inhoud in een studio waarin een redacteur tekst kan wijzigen zonder het ontwerp aan te raken. Zo blijft het design system intact. In de documentatie van Astro staat een officiële Sanity-integratie.

Ik heb mijn eigen website gescand op AI-ontwerpkenmerken

Deze site heb ik in Astro herbouwd met Claude Code, en dat maakt hem een eerlijke test. Ik liet dezelfde scan als hierboven op mijn eigen broncode draaien.

De homepage had negen uppercase labels boven koppen, op twaalf secties. Op vier pagina’s had meer dan 4 op de 10 secties er een. Zo ging het door. Daarnaast stonden er vier sparkle-iconen, drie getallen met een verloop als vulling, dertien plekken met een blur-effect en drieëntwintig met een gekleurde gloed. Niets zag er op zichzelf verkeerd uit. Samen las het als een sjabloon.

Wat ik heb aangepast

Bij de labels bleven de hero, de succesverhalen, de Founder-Led GTM Engine en “Beperkte beschikbaarheid” staan. De nummering bij “Waarom met mij” ging weg. De sparkles kregen een icoon dat laat zien waar het over gaat, zoals een meter bij AI-efficiëntie. De cijfers met een verloop zijn nu vlak oranje.

Wat ik bewust heb laten staan

Het licht dat de cursor volgt bleef staan, omdat het van mij is en iets doet. Het label “Beperkte beschikbaarheid” bleef ook. Het is juist. Hetzelfde geldt voor de blockquote met een rand links, het handje in de footer en het verloop in de hero. Dat zijn keuzes die ik heb gemaakt, en ik blijf ze maken.

Een keuze die iemand heeft gemaakt is geen kenmerk, ook als hij op de lijst staat.

Wat ik leerde

• Een scan telt wat er in de code staat, niet wat een bezoeker ziet. De buildscan telt glas op klassenaam, en deze site gebruikt scoped CSS. De scan van de broncode was dus de maatstaf, en alleen die liet zien dat het aantal van 13 naar 7 ging.
• Ik veranderde per stap één ding en controleerde het. Na elke stap vergeleek ik de nieuwe build pagina voor pagina met de vorige, zodat alleen de bedoelde opmaak veranderde en geen enkele tekst, kop of URL.
• Het effect is klein. Een bezoeker merkt een verdwenen label niet. Wat verandert is het ritme van een pagina. Ik heb bezoek en aanvragen niet gemeten, dus ik claim geen effect.

Zo fix je een AI-achtige website in zes stappen

Neem ze in deze volgorde. De eerste twee kosten bijna niets en voorkomen samen het meeste van wat de rest moet herstellen.

1. Herstel wat kapot is of ontbreekt. Een layout die op een telefoon uit elkaar valt, een pagina zonder beschrijving of met een tweede H1, een contactadres dat niet op je eigen domein staat. Kopers maken meestal een shortlist voordat ze een site bezoeken, dus een kapotte pagina schaadt eerder dan smaak.
2. Schrijf de richting op voordat er iets wordt gegenereerd. Dat is de lijst met keuzes en het design system uit de secties hierboven. Zet ze waar je tool ze elke sessie leest, zoals CLAUDE.md, AGENTS.md of een DESIGN.md.
3. Kies referenties en vergelijk daarna drie layouts. Kies zo’n zes sites en schrijf per site het principe op dat je overneemt, niet de look, want onderzoekers noemen het kopiëren van het oppervlak van een voorbeeld fixatie. Vraag daarna om drie layouts, beschreven als structuur: wat staat waar en waarom. Beoordeel ze tegen elkaar in plaats van de eerste verder op te poetsen. Ik vraag Claude ook graag hoe een sectie premiumer kan aanvoelen. Dat werkt niet altijd, en het werkt beter als ik een voorbeeld geef van wat premium voor mij betekent. De suggesties zijn vaak goed, dus ik zie ze als een tweede mening en controleer het resultaat opnieuw tegen de kenmerken.
4. Tel de kenmerken. Loop de lijst hierboven pagina voor pagina langs. Krebs rekende vier of meer patronen op één pagina tot de zware band, dus lees dat als signaal om te schrappen. Wat je machinaal kunt tellen, zoals labels per sectie, blur-panelen, verloopteksten en sparkle-iconen, kan vóór elke release als controle draaien.
5. Schrap wat zijn plek niet heeft verdiend. Vraag bij elke keuze of je haar op elke vergelijkbare pagina zou hebben gemaakt. Is het antwoord ja, dan is het een standaard: verander haar, of zeg waarom ze past. Het label, de gloed, het verloop en de animatie gaan als eerste.
6. Zet echt materiaal in en laat iemand die het merk kent erna kijken. Gebruik een productscreenshot in plaats van een abstracte vorm, een klant met naam en getal in plaats van een anoniem citaat (zo zijn mijn succesverhalen opgebouwd), een foto van je team in plaats van een render. Controleer elke pagina op telefoonbreedte, want gegenereerde sites lopen het meest uit de pas waar niemand kijkt. Herhaal de ronde elk kwartaal.

Veelgestelde vragen over AI-gegenereerde websites

Check wat je site echt vertelt

Een herkenbare site beslist zelden alleen een deal. Als de jouwe van logo’s kon ruilen met die van een concurrent zonder dat iemand het merkt, ligt de oorzaak meestal eerder: in een positionering die nooit scherp genoeg werd om te laten zien. In een gratis strategiesessie kijk ik met je of je boodschap, je zichtbaarheid en je site hetzelfde verhaal vertellen.