Parnav Studio

Waarom vanaf nul bouwen?

Ik verkoop digitale producten op maat. Verschijnen met een template zou de pitch ondermijnen nog voordat die begonnen was. De studiowebsite moest het bewijs zijn: als ik niet iets indrukwekkends voor mezelf kan bouwen, waarom zou iemand mij dan zijn project toevertrouwen?

Dus behandelde ik het als een echte klantopdracht. Doelen gesteld, ontwerpbeslissingen met intentie genomen, een tech stack gekozen om specifieke redenen, en iets opgeleverd waar ik trots mijn naam op zet.

De briefing

De website moest drie dingen doen:

1. Iemand overtuigen om contact op te nemen binnen één bezoek. Niet door agressieve CTA’s of pop-ups, maar door de kwaliteit van het werk voor zich te laten spreken.
2. Veelzijdigheid tonen zonder te overdrijven. Ik ben een eenpersoonsstudio. De website moest laten zien dat één persoon strategie, design en development aankan zonder eruit te zien als het portfolio van een freelancer.
3. Snel laden en soepel aanvoelen. Als de website over het bouwen van digitale producten een trage, houterige gebruikerservaring heeft, is de pitch al voorbij voordat die begint.

De visuele identiteit

Ik heb een compleet merksysteem opgebouwd voordat ik ook maar één regel code schreef. Twee achtergrondkleuren, één accent, twee lettertypen. Simpele regels die elke beslissing makkelijker maken.

Het beperkte kleurenpalet dwingt tot goede layout. Als je maar twee achtergrondkleuren en één accent hebt, moet elk element zijn plek verdienen door witruimte, typografie en hiërarchie in plaats van te leunen op kleur.

Hoe het aanvoelt in gebruik

Het verschil tussen een goede website en een geweldige zit in de details die mensen voelen maar niet kunnen benoemen. Zo ziet dat eruit in beweging:

Fullscreen videohero. De homepagina opent met een loopende video achter de kop. Een donkere overlay houdt de tekst leesbaar op elk frame. De scroll-indicator verdwijnt zodra je begint te scrollen.

Smooth scrolling. De hele website draait op Lenis voor een vloeiend, bijna gewichtloos scrollgevoel. Het is een van die dingen die je pas opvalt als je op een website komt die het niet heeft.

Scroll-getriggerde animaties. Secties komen tevoorschijn zodra je ze bereikt. Processtappen, servicekaarten en projectgrids animeren bij het verschijnen. Houdt de pagina levendig zonder afleidend te zijn.

Interactieve knoppen met schaduweffecten. De oranje box-shadow-offset op CTA’s is een klein detail dat de website een tastbaar gevoel geeft. Hoverstates verschuiven en vullen. Alles wat klikbaar is, laat je weten dat het klikbaar is.

Een mobiele ervaring die ontworpen is, niet alleen verkleind. De telefoonversie is geen samengedrukte desktoplayout. De navigatie wordt een fullscreen geanimeerd menu. De typografie past zich aan. De witruimte verandert. Alles is vanaf het begin gebouwd voor touch.

Prestaties

Waarom dit belangrijk is voor je bedrijf

Google gebruikt paginasnelheid als rankingfactor. Een trage website frustreert niet alleen bezoekers, hij wordt begraven in zoekresultaten. Wanneer iemand jouw branche googelt en twee websites dezelfde dienst aanbieden, rankt de snellere hoger. Dat is geen mening, zo werkt het algoritme.

53% van mobiele bezoekers verlaat een website die langer dan 3 seconden laadt. Elke seconde vertraging verlaagt conversies met ongeveer 7%. Een perfecte Lighthouse-score betekent dat Google niets te klagen heeft, je bezoekers krijgen waar ze voor kwamen zonder te wachten, en je website is zo goed mogelijk ingericht om te ranken.

Ik heb niet geoptimaliseerd voor een testscore. Ik heb de website gebouwd met prestaties als randvoorwaarde vanaf dag één: minimale code, geen onnodige bibliotheken, afbeeldingen die progressief laden, en een serverconfiguratie die pagina’s levert vanuit het dichtstbijzijnde datacenter. De score is het resultaat van die beslissingen, niet een doel op zich.