Waarom een webdesigner een eigen site moet bouwen
Een webdesigner met een sjabloonsite is als een kapper met een slordig kapsel. Je kunt het uitleggen, maar het overtuigt niet. Toen we DesignCheck begonnen, wilden we een site die zelf het bewijs is: als een bezoeker binnen twee seconden denkt "dat ziet er anders uit", hebben we het halve gesprek al gehad.
Twan bouwt, Lorenzo ontwerpt. De site is met de hand geschreven, zonder WordPress, zonder paginabouwer en zonder thema. Dat kost meer tijd, maar het betekent dat elk onderdeel precies doet wat we willen en niets laadt wat we niet nodig hebben.
De opening: vier foto's en een verfstrook
De bovenkant van de homepage bestaat uit vier vlakken: een grote foto van een bloem met dauwdruppels, een smalle strook blauwe verf, een donkere oceaan en een glazen figuur. Twan koos de foto's zelf, alle vier in hetzelfde blauw. Op die vlakken staan twee woorden: "design the future".
Het detail waar we het langst aan gewerkt hebben, zie je bijna niet. "Design the" staat met zijn onderkant precies op de bovenrand van de verfstrook. De staart van de g hangt over de strook heen. De strook loopt tot het einde van de e van "the", niet verder. En tussen de strook en de f van "future" zit twee millimeter.
Dat klinkt als pietepeuterig werk, en dat is het ook. Letters hebben geen vaste grondlijn in een webpagina; die hangt af van het lettertype, de grootte en de browser. Daarom meet een script in de browser waar de onderkant van de letters staat en zet het de strook daarop. We hebben het gecontroleerd op acht schermmaten, van een kleine telefoon tot een groot scherm: overal nul pixels verschil.
Op de telefoon gedraagt de opening zich anders. Daar staat alles stil terwijl je scrolt, behalve de woorden "design the future", die uit elkaar schuiven. In Safari loopt de opening door tot de onderrand van het scherm, ook achter de werkbalk die over de pagina zweeft.
Een laadscherm dat geen nep is
Veel sites hebben een laadscherm met een draaiend rondje of een percentage dat sneller oploopt dan de pagina laadt. Dat is nep, en bezoekers voelen dat. Wij wilden een laadscherm dat iets laat zien wat echt gebeurt.
De oplossing was de verfstrook zelf. Als je de homepage opent, is het scherm zwart en loopt de strook van links naar rechts vol. Hij loopt mee met het echte laden: de vier foto's en het lettertype. Is alles binnen, dan schrijft de strook "design the", daarna verschijnt "future", en dan gaan de foto's open als oogleden. Het duurt ongeveer tweeënhalve seconde, minstens driekwart seconde en nooit langer dan vier.
Er zit een technische keuze onder die je niet ziet. De foto's liggen tijdens het laden onder zwarte vlakken die wegschuiven, in plaats van dat ze worden uitgeknipt. Zo tekent de browser de grote foto meteen en ziet Google dat de pagina snel in beeld staat. Met uitknippen duurde dat in onze meting anderhalve seconde in plaats van een halve.
Sinds 24 oktober 2026 testen we een eigen versie voor de blogpagina's: dezelfde foto's, en de verfstrook schrijft de titel van het artikel.
Knoppen die reageren zoals een iPad
Een knop op een website is meestal een gekleurd vlak dat bij aanwijzen iets donkerder wordt. Wij hebben gekeken hoe de aanwijzer op een iPad zich gedraagt en dat nagebouwd. Een knop komt iets naar voren als je hem aanwijst, kantelt hooguit drie pixels mee met je muis en krijgt een licht dat je cursor volgt. Druk je erop, dan veert hij in, met een lichtflits vanaf het punt waar je drukte.
In rust zie je daar niets van. Het is pas als je over de site beweegt dat je merkt dat er iemand over heeft nagedacht.
Geen cookies, wel een chatbot
Designcheck.nl gebruikt geen cookies. Daarom staat er geen toestemmingsbalk die je moet wegklikken; onderin verschijnt alleen "Geen cookies. U hoeft dus niets te accepteren of te weigeren." Bezoekersaantallen meten we zonder iets op je apparaat op te slaan.
Rechtsonder staat wel een chatbot. Die beantwoordt vragen, plant een belafspraak en zegt dat hij een digitale assistent is. Hij zit afgeschermd van de rest van de pagina, zodat hij de site niet trager maakt. Toen zijn opmaak nog gewoon in de pagina zat, kostte dat bij het laden ruim een halve seconde aan herrekenen. Hoe we die bot bouwden, staat in het artikel over chatbots.
Doe de designcheck
Onder de opening staat een blok waar je het adres van je eigen website intypt. Binnen een paar seconden zie je je site op een laptop en een telefoon, zoals een bezoeker hem ziet. De beelden maakt een eigen server van ons, geen externe dienst.
In het begin duurde dat twintig seconden of meer. Door de server één warme browser te laten openhouden, een snel beeld te maken voor het scherpe beeld klaar is en de functie in Frankfurt te draaien in plaats van in Amerika, staat een gewone MKB-site er nu meestal binnen twee seconden. Duurt het langer, dan ligt dat soms aan de site die je intypt, bijvoorbeeld aan een trage server. Ook dat is informatie.
Snel, gemeten
Mooi en traag is geen goede website. Op 25 oktober 2026 hebben we de homepage gemeten met Lighthouse, het meetprogramma van Google. Op de computer: 98 voor snelheid, 97 voor toegankelijkheid, 100 voor goede werkwijze en 100 voor SEO. Op de telefoon: 91 voor snelheid en verder dezelfde scores. De opmaak verschuift niet tijdens het laden.
Die cijfers kwamen er niet vanzelf. We vonden een 3D-bibliotheek van bijna 700 kilobyte die werd geladen voor een effect dat niet meer bestond. Een script dat bij elke scrollstap de maten van de pagina opvroeg. Een effect dat bij elke scrollstap opnieuw ruis berekende. Elk van die dingen maakte de site een fractie trager; samen merkte je het. Ze zijn eruit of vervangen door iets lichters.
De 91 op de telefoon is goed, maar niet perfect. Bij een gesimuleerde trage verbinding staat het grootste onderdeel van de pagina na 2,4 seconde in beeld. Daar werken we nog aan.
Getest waar het misgaat
Een site die er in Chrome op een laptop goed uitziet, kan op een iPhone misgaan. Safari op iOS 26 tekent de pagina ook achter de balk met de tijd en de batterij, en dat ging bij ons in het begin mis: je zag de pagina boven de menubalk doorschuiven. Elke wijziging aan de bovenkant van de site testen we daarom in een iPhone-simulator met iOS 26 op een Mac in de cloud, voordat hij live gaat.
Elke wijziging gaat bovendien door een automatische controle voordat hij live kan. Breekt er iets, dan blijft de oude versie staan.
Is het de mooiste site van Mijdrecht?
Dat mag je zelf beoordelen. Wat we wel weten: elk onderdeel is met opzet zo gemaakt, gemeten en getest, en dezelfde aanpak gebruiken we voor de sites die we voor klanten bouwen. Geen sjabloon, een eigen ontwerp in de stijl van het bedrijf, binnen een week live. Een Refresh kost €995 en een compleet nieuwe site €1.495, allebei excl. btw. Kijk zelf op designcheck.nl, liefst op je telefoon.