Kayzen Web
De website van het bureau is zijn eerste referentie: die wordt strenger geaudit dan die van klanten.
- Jaar
- 2026
- Ontwerp
- continue verbetering
- Stack
- React · Vite · Tailwind · TypeScript · Vercel
- Strategie
- Design system
- Ontwikkeling
- SEO
- Toegankelijkheid
- Copywriting
- Lighthouse-toegankelijkheid
- 100/100
- Lighthouse-SEO
- 100/100
- routes geprerenderd bij de build
- 79
- gedocumenteerde realisaties, elk met een eigen casestudy
- 37
Wat er opgelost moest worden.
De context
kayzen-lyon.com is de etalage van het bureau: 79 geprerenderde routes, waaronder 21 dienstenpagina's, 4 geografische pagina's, een openbare tarieflijst, een changelog, een pagina over de technische stack en een open design system.
De beperking
Een webbureau wordt beoordeeld op zijn eigen website nog vóór zijn realisaties. Het kleinste gebrek — een middelmatige performancescore, een ontoereikend contrast, ongeldige gestructureerde gegevens — wordt een argument tegen het bureau. De website moest dus de technische inspectie van een veeleisende prospect doorstaan.
Het antwoord
We hebben openbaar gemaakt wat bureaus doorgaans verbergen: de tarieven, de stack, het design system en een changelog met de correcties die aan de website zelf zijn aangebracht. De transparantie dient twee doelen — ze stelt de prospect gerust, en ze verplicht ons het niveau vast te houden.
De scores bij oplevering.
Lighthouse-scores van de website in productie. Wij publiceren ze zoals ze zijn: als een score laag is, staan de oorzaak en het verbeterplan hieronder beschreven in plaats van verzwegen.
Elke keuze, en de reden erachter.
Een gedocumenteerd en openbaar design system
Kleurtokens, vloeiende typografische schaal, vier schaduwniveaus, één verticaal ritme. De pagina /design-system toont ze. Een zichtbaar systeem is een systeem dat niet ontspoort.
Al het contrast gemeten
Elk kleurenpaar is berekend. De randen van invoervelden halen 3:1, de focusring is losgekoppeld van de actiekleur om zichtbaar te blijven op een gekleurde knop, en tekstverlopen zijn vervangen door egale kleurvlakken.
Alleen animaties bij het binnenkomen
Geen enkele oneindige lus buiten de laadindicator: permanente GPU-kosten, batterijverbruik en vestibulaire hinder. De systeemvoorkeur voor verminderde beweging wordt strikt gerespecteerd.
Kleurenpalet van het project
Navy
#1F3B61
Koppen, structuur
Terracotta
#B7481F
Actie — 5,3:1 op wit
Wit
#FFFFFF
Paginaoppervlak
Koel grijs
#F8FAFC
Afwisselende secties
Typografisch systeem
Koppen
Outfit 800
Lopende tekst
Plus Jakarta Sans 400
Twee zelf gehoste variabele families, met font-display: optional — geen layoutverschuiving bij het laden.
Wat er onder de motorkap zit.
- React
- Vite
- Tailwind
- TypeScript
- Vercel
Alle routes geprerenderd bij de build
Een SPA serveert dezelfde HTML voor alle URL's: de metadata per pagina zijn onzichtbaar voor elke robot die geen JavaScript uitvoert. Een prerenderscript bezoekt elke route en schrijft een volledig HTML-bestand — titel, beschrijving, canonical, Open Graph, JSON-LD.
De build weigert door te gaan bij een fout
De build faalt als een route geen metadata heeft, als de 404-pagina haar noindex verliest, als een beeld breder is dan 1440 px, als de CSP verouderd is, of als een vermelding “nog aan te vullen” in de gegenereerde HTML terechtkomt. Vangrails zijn meer waard dan waakzaamheid.
Opsplitsing per route
Elke pagina is een afzonderlijke chunk, ook de homepage. Een colofonpagina heeft geen enkele reden om de animatiebibliotheek van de homepage te downloaden.
Hoe de website vindbaar wordt.
Eén ingang per intentie
17 dienstenpagina's en 4 geografische pagina's, elk gericht op een afzonderlijke zoekopdracht. Geen enkele is een zoekwoordvariant van een andere: het is verschillende inhoud.
Samenhangende gestructureerde gegevens
Organization, LocalBusiness, ProfessionalService, WebSite, WebPage en BreadcrumbList, allemaal verbonden via @id. Tegenstrijdige duplicaten zijn verwijderd — twee concurrerende broodkruimelpaden op dezelfde URL zijn beter dan geen, maar maar net.
Geen zelf toegekende beoordeling
De aggregateRating is verwijderd: beoordelingen die een bedrijf zichzelf toekent, zijn verboden door de richtlijnen van Google en stellen bloot aan een handmatige actie. We verliezen liever de ster dan het domein.
Bruikbaar voor iedereen.
Sinds juni 2025 verplicht de Europese toegankelijkheidsrichtlijn (European Accessibility Act) digitale toegankelijkheid voor een groot deel van de onlinediensten. Wij regelen dat in het ontwerp, niet achteraf.
100/100 in Lighthouse, en een handmatige audit
Skiplink, focus verplaatst en aangekondigd bij elke routewissel, aanraakdoelen van 44 px, een modus met verhoogd contrast, een OLED-modus en een dyslexievriendelijk lettertype, aangeboden in een apart paneel.
Wat er is opgeleverd.
- Home
- 17 dienstenpagina's
- 4 geografische pagina's
- Portfolio en 37 casestudy's
- Tarieven, subsidies, quiz, afspraak
- Stack, design system, changelog
- Juridische pagina's
Het verloop van het project.
Design system
Tokens, contrasten, typografische schaal, schaduwen.
Inhoud
17 diensten, 4 regio's, openbare tarieven.
Technische SEO
Prerendering, gestructureerde gegevens, sitemap, vangrails in de build.
Continue verbetering
Opeenvolgende audits, vastgelegd in de openbare changelog.
Wat ons vaak gevraagd wordt.
Andere projecten
AVG/GDPR-compliance & SaaSKonsent by Kayzen
Een bannerleverancier die banners audit, is rechter en partij: onafhankelijkheid wás het product.
Offensieve cybersecurity & SaaSSentinel by Kayzen
Een securityproduct verkopen aan engineers: elke bewering moest aantoonbaar zijn.
Data & WeerdienstMétéo Climat France
358 indexeerbare pagina's, een geanimeerde kaart over 72 tijdstappen — en geen enkele regel framework.
Hetzelfde niveau van zorg, voor uw website.
Gratis audit van uw huidige website, offerte binnen 24 uur en een schriftelijke onderbouwing — zoals die u net hebt gelezen. Betaling in drie termijnen zonder extra kosten; lokale subsidies gecontroleerd vóór ondertekening.