Waarom we zo vroeg mogelijk in de browser ontwerpen.

In een ontwerpbestand klopt alles. Elke kop past op één regel, elke foto heeft de juiste verhouding en het scherm is precies zo breed als de ontwerper wilde. Een echte website heeft die luxe niet. Daarom brengen we een ontwerp zo vroeg mogelijk naar de browser, en bouwen we in code in plaats van met een template of paginabouwer. Hier leggen we uit waarom, wat het je oplevert en waar de grenzen liggen.

Een plaatje laat het belangrijkste weg

Een klassiek webontwerp is een reeks stilstaande beelden. Eén voor desktop, soms één voor mobiel, en alles daartussen vult iemand later in. Hoe een menu opent, hoe snel een animatie gaat en wat er gebeurt op een tablet of een smal laptopscherm, zie je er niet in. Die keuzes worden dan pas tijdens het bouwen gemaakt, vaak door iemand die jouw gesprekken niet heeft gevoerd.

In de browser hoeft niemand iets in te vullen. Je scrolt, klikt en draait je telefoon een kwartslag. Een beweging die op een plaatje elegant leek, blijkt soms traag. Een layout die op een groot scherm rust geeft, kan op mobiel voelen als een lange gang. Dat wil je weten voordat je ermee akkoord gaat, niet erna.

Echte inhoud, echte omstandigheden

Ontwerpen met voorbeeldtekst is een kast inrichten zonder te weten wat erin moet. Een kop van drie woorden past overal. Een kop van twaalf woorden, of een vertaling die net wat langer uitvalt, laat zien of de typografie overeind blijft. Daarom werken we zo vroeg mogelijk met echte teksten, echte namen en echte beelden.

Bij een site die iets moet uitleggen, telt dat dubbel. De website van STEQ legt in gewone taal uit hoe beleggen in vastgoed werkt: wat je koopt, wat je krijgt en wanneer. Je begint vanaf €100 en zit in vijf klikken op je eerste belegging. Of zo’n route helder voelt, beoordeel je niet op een stilstaand ontwerp. Dat merk je pas als je er zelf doorheen klikt.

Sommige kwaliteiten zie je in een ontwerpbestand helemaal niet. Hoe snel een pagina laadt op een trage verbinding. Of je de site met alleen een toetsenbord kunt gebruiken, en of een schermlezer begrijpt wat er staat. In code zijn dat eigenschappen van het ontwerp zelf, geen controle aan het eind. Een zware video op de homepage is een keuze met een prijs, en die prijs zien we meteen.

We beslissen liever op de website zelf dan op een plaatje ervan.

Waarom dit nu kan

Bouwen was lang duur, en daarom kwam het pas aan het eind. Eerst werd alles op plaatjes goedgekeurd, daarna pas gebouwd. AI heeft die volgorde veranderd. Een werkende versie van een idee hebben we nu snel staan, dus de browser is geen eindstation meer, maar een werkplek vanaf het begin.

Wat AI niet doet, is kiezen. Positionering, richting en de kern van het ontwerp maken we zelf. AI geeft ons meer versies om te vergelijken en sneller iets om op te reageren. Welke versie goed is, blijft een kwestie van smaak, en die ligt bij ons.

Geen template, en waarom dat ertoe doet

WordPress, Webflow en Framer zijn goed in wat ze doen. Je zet er snel een nette site mee neer, en je kunt hem zelf bijhouden. Voor een bedrijf dat drie pagina’s nodig heeft en weinig verwacht te veranderen, is een goed template een prima keuze. Dat menen we.

Alleen bepaalt het platform dan wat je website kan: de templates, de plug-ins en wat de editor toelaat. De bedrijven waarmee wij werken, lopen juist tegen die grens aan. Ze hebben een uitgebreide website nodig, een platform of een interactieve tool. Achter de website van STEQ zit een beleggersplatform waar je je posities, het aanbod en je documenten overziet. Zoiets past niet in een template.

Bouwen in code vraagt wel iets. Een wijziging in de structuur doe je niet zelf met slepen en neerzetten. Daarom maken we vooraf heldere afspraken over beheer en overdracht: wat je team zelf aanpast, en wat via ons loopt.

Het merk woont in dezelfde code

Een merk is een verzameling afspraken: kleuren, letters, ruimte, hoe een knop eruitziet en hoe iets beweegt. Wij leggen die vast in design tokens, benoemde bouwstenen die de richtlijnen en de website allebei gebruiken. Een kleur heeft dan één naam en één waarde, overal waar hij voorkomt. Omdat merk en website in dezelfde sprint ontstaan, hoeft niemand ze achteraf op elkaar af te stemmen.

Dat houdt de site ook later consistent. Een nieuwe pagina bouw je met dezelfde componenten als de eerste. Voor STEQ gingen we een stap verder en bouwden we een eigen tool die stenen stapelt tot torens, trappen en piramides. STEQ maakt er zelf nieuwe beelden en animaties mee, en die blijven altijd binnen het merk. De richtlijnen staan online in twee versies: een voor mensen en een brand.md voor AI-agents.

Wat het jou oplevert

Voor een founder of marketingteam is dit geen technische kwestie. Het verandert hoe je beslist, en wat je na de lancering met je site kunt.

1. Minder verrassingen. Je beoordeelt vanaf het begin iets dat werkt, dus wat live gaat, heb je al gezien en geprobeerd.
2. Beslissingen op het echte ding. Een gesprek over smaak wordt concreet als je kunt scrollen en klikken.
3. Een site die kan groeien. Van uitgebreide website tot platform of interactieve tool, zonder eerst van systeem te wisselen.
4. Heldere afspraken. Je weet vooraf wat je team zelf aanpast en wat je bij de overdracht krijgt.

Merk je dat je website achterloopt op je bedrijf, vertel ons dan waar je staat. We reageren binnen één werkdag.