Vernieuwen in de praktijk: zo bouwden wij onze nieuwe website

Bij Giraffes4Zebras werken we vanuit vier kernwaarden: Voortreffelijk, Verbazen, Vermenigvuldigen en Vernieuwen. Vooral die laatste, vernieuwen, stond in dit project centraal. Voor ons betekent dat niet alleen meebewegen met trends, maar vooral: kritisch blijven kijken naar hoe dingen beter, slimmer en toekomstbestendiger kunnen. Toen we besloten om onze website volledig op de schop te gooien, zagen we dat dan ook als de perfecte kans om niet alleen het uiterlijk te vernieuwen, maar óók de onderliggende technieken grondig tegen het licht te houden. 

In plaats van te kiezen voor een veilige, bekende route, hebben we onszelf uitgedaagd: hoe bouwen we een platform dat niet alleen vandaag werkt, maar ook klaar is voor de komende jaren? Het antwoord daarop lag in het maken van bewuste keuzes voor moderne technologieën en een nieuwe manier van ontwikkelen. 

Onze vernieuwde website moest meer zijn dan een digitaal visitekaartje. We hadden een duidelijke visie: een platform bouwen dat flexibel, snel en schaalbaar is, en tegelijkertijd eenvoudig te beheren blijft. 

Daarbij stelden we onszelf een aantal concrete doelen: 

• Performance 
  De website moest razendsnel laden en prettig werken op alle apparaten. Snelheid is niet alleen fijn voor bezoekers, maar ook essentieel voor vindbaarheid en conversie. 

• Flexibiliteit in content 
  Onze content moest eenvoudig aan te passen zijn, zonder technische afhankelijkheden. Pagina’s modulair opbouwen, snel inspelen op campagnes en actualiteit, en content hergebruiken over meerdere kanalen heen. 

• Onderhoudbaarheid 
  Geen log systeem meer waarin elke wijziging risico’s met zich meebrengt, maar een duidelijke, component-based structuur die overzichtelijk blijft, ook na jaren doorontwikkelen. 

• Toekomstbestendigheid 
  De website moest voorbereid zijn op groei: nieuwe functionaliteiten toevoegen, koppelingen met externe systemen maken en inspelen op technologische innovaties, zonder dat alles opnieuw gebouwd hoeft te worden. 

• Samenwerking versterken 
  Ontwerp, content en techniek moesten beter in elkaar grijpen. Door met modulaire bouwstenen te werken, kunnen teams sneller samenwerken en blijven wijzigingen beheersbaar. 

Deze doelen vormden de basis voor al onze technische keuzes. Niet omdat we zo graag met nieuwe tools werken, maar omdat ze direct bijdragen aan de kwaliteit, flexibiliteit en duurzaamheid van het platform precies wat “Vernieuwen” voor ons betekent in de praktijk. 

Een van de nieuwe technieken die al even op ons lijstje stond om uit te proberen, was het Astro Framework. Waarom we dit framework willen gebruiken? Zoals Astro het zelf omschrijft: “Het web framework voor content gedreven websites”. Laat dat nou precies zijn wat onze website, en die van veel van onze klanten, is. 

Wat je tegenwoordig heel veel ziet bij het ontwikkelen van websites en webapplicaties, is het “Headless” principe, ook wel bekend als component-based bouwen. 
Waar vroeger complete systemen als één groot geheel werden ontwikkeld, zogenaamde monolithische systemen, kiezen we nu steeds vaker voor een opzet waarbij onderdelen los van elkaar functioneren en via API’s met elkaar communiceren. 

In een monolithisch systeem zit alles in één pakket: de database, de businesslogica, de weergave van content en de frontend. Dat werkte jarenlang prima, maar kent ook duidelijke beperkingen. Elke aanpassing of uitbreiding raakt het hele systeem. Nieuwe functionaliteit toevoegen betekent vaak dat delen van de bestaande code aangepast moeten worden, met het risico op nieuwe bugs en complex onderhoud als gevolg. Ook ben je meestal gebonden aan één vaste manier waarop content wordt getoond: op de website, in dat ene systeem. 

Bij een headless architectuur werkt dat fundamenteel anders. De backend, bijvoorbeeld een CMS, is volledig losgekoppeld van de frontend. De backend beheert alleen de content en data en stelt die beschikbaar via API’s. De frontend is vervolgens vrij om die data op elke gewenste manier te gebruiken: voor de website, een app, een interne tool of zelfs schermen op locatie. Elk onderdeel is als het ware een zelfstandig component dat zijn eigen rol vervult, maar samen één geheel vormt. 

Naast het Astro framework hebben we gekozen voor het Storyblok CMS als basis voor ons contentbeheer. Storyblok is een modern, volledig headless CMS dat perfect aansluit bij onze manier van werken. In plaats van vaste pagina-templates  werkt Storyblok met contentblokken die één-op-één gekoppeld zijn aan onze frontend componenten. Hierdoor kan content exact worden opgebouwd zoals het design dat bedoeld heeft, zonder technische beperkingen. 

Wat Storyblok voor ons en voor onze klanten vooral krachtig maakt, is de combinatie van flexibiliteit en gebruiksgemak. Marketingspecialisten en contentbeheerders kunnen zelfstandig pagina’s samenstellen, blokken hergebruiken en content aanpassen via een visuele editor, zonder tussenkomst van development. Tegelijk blijft de technische structuur strak en schaalbaar, zodat developers zich kunnen focussen op performance, veiligheid en uitbreidingen. 

Doordat Storyblok volledig API-gedreven is, is de content niet gebonden aan één platform. Alles wat we in de backend beheren, kan eenvoudig opnieuw ingezet worden voor toekomstige kanalen zoals mobiele apps, interne dashboards of campagne-landingspagina’s. Zo voorkomen we dubbel werk en bouwen we aan een platform dat écht meegroeit met nieuwe behoeften. 

Storyblok vormt de perfecte brug tussen creativiteit en techniek, het geeft contentteams maximale vrijheid, terwijl het developers de ruimte biedt om te bouwen aan een robuuste, snelle en toekomstvaste website. 

1. Maximale flexibiliteit 

Doordat frontend en backend gescheiden zijn, zit je niet vast aan één technologie of presentatievorm. De content is herbruikbaar op meerdere kanalen en kan eenvoudig op nieuwe plekken worden ingezet zonder dat de hele backend aangepast hoeft te worden. 

2. Snellere ontwikkeling 

Teams kunnen parallel werken. Terwijl designers en frontend developers werken aan de gebruikerservaring, kan de backend onafhankelijk doorontwikkelen. Dit verkort ontwikkeltijden en maakt sneller testen en bijsturen mogelijk. 

3. Betere performance 

Moderne frontends zoals Astro of React maken gebruik van technieken zoals static generation en server-side rendering. Hierdoor laden pagina’s sneller dan bij traditionele CMS-oplossingen, wat direct bijdraagt aan een betere gebruikerservaring én SEO-resultaten. 

4. Toekomstbestendig 

Techniek ontwikkelt zich razendsnel. Met een component-based headless structuur kun je afzonderlijke onderdelen vervangen of upgraden zonder bestaande functionaliteit omver te hoeven halen. Zo bouw je een platform dat meegroeit met nieuwe eisen en technologieën, in plaats van dat het veroudert als één geheel. 

5. Schaalbaarheid 

Wil je nieuwe functionaliteiten toevoegen, extra kanalen aansluiten, of specifieke modules uitbreiden? Dan kan dat zonder impact op andere onderdelen van het systeem. Dit maakt headless bij uitstek geschikt voor organisaties die willen blijven doorontwikkelen. 

6. Onderhoud en veiligheid 

Kleinere, losse componenten zijn beter beheersbaar dan één groot monolithisch systeem. Updates en bugfixes kunnen gericht worden doorgevoerd. Bovendien verklein je door de scheiding tussen backend en frontend het aanvalsoppervlak – wat een positief effect heeft op de veiligheid. 

Waar monolithische systemen lange tijd de standaard waren, sluit de headless aanpak veel beter aan bij de eisen van vandaag: snelheid, flexibiliteit, schaalbaarheid en kanaaloverstijgend werken. Precies die eigenschappen maken het voor ons dé logische keuze bij het bouwen van onze nieuwe website – en sluiten naadloos aan op onze kernwaarde “Vernieuwen”: blijven onderzoeken hoe we slimmer, beter en toekomstgerichter kunnen bouwen. 

Technische keuzes maken wij nooit “omdat het kan”, maar omdat ze direct waarde toevoegen voor onze klanten. De overstap naar een headless, component-based aanpak biedt duidelijke voordelen. 

Snellere websites 
Dankzij moderne frontend-technieken laden pagina’s merkbaar sneller. Dat zorgt niet alleen voor een prettigere gebruikerservaring, maar ook voor betere SEO-resultaten en hogere conversie. 

Meer flexibiliteit in contentbeheer 
Content kan eenvoudig worden aangepast, hergebruikt en gepubliceerd op meerdere kanalen tegelijk, zonder complexe bewerkingen of afhankelijkheid van vaste templates. Dit betekent sneller inspelen op campagnes, acties of actualiteit. 

Sneller ontwikkelen en doorbouwen 
Nieuwe functionaliteiten en pagina’s kunnen los worden toegevoegd zonder bestaande onderdelen te breken. Dat scheelt tijd, verkort doorlooptijden en houdt projecten wendbaar. 

Toekomstbestendige oplossing 
Onze klanten investeren niet in een “momentopname”, maar in een platform dat is voorbereid op groei. Denk aan uitbreidingen met apps, personalisatie, koppelingen met andere systemen of nieuwe marketingkanalen. Allemaal zonder volledige rebuilds. 

Betere veiligheid en stabiliteit 
Doordat het systeem is opgebouwd uit losse componenten, is het overzichtelijker te beheren en te beveiligen. Updates en verbeteringen zijn gerichter door te voeren, waardoor de kans op fouten en kwetsbaarheden kleiner wordt. 

Focus op resultaat 
Minder technische beperkingen betekent meer ruimte om te focussen op wat echt telt: content die converteert, gebruiksvriendelijke functies en digitale middelen die meebewegen met de doelen van de organisatie. 

De livegang van onze nieuwe website is geen eindpunt, maar juist een nieuw begin. Technologie staat nooit stil, en dat geldt ook voor de manier waarop organisaties online communiceren, verkopen en verbinden met hun doelgroep. Wat vandaag modern is, kan morgen alweer ingehaald zijn. Daarom zien wij vernieuwing niet als een eenmalig project, maar als een continu proces. 

Onze nieuwe technische basis stelt ons in staat om blijvend door te ontwikkelen. We kunnen sneller experimenteren met nieuwe functionaliteiten, testen wat werkt voor gebruikers en direct bijsturen waar nodig. Denk aan persoonlijke content op maat, slimmere automatiseringen, betere integraties met andere platformen en het verder inzetten van AI om processen efficiënter te maken. 

Doordat onze site component-based is opgebouwd, kunnen we onderdelen blijven vernieuwen zonder het hele platform overhoop te halen. Zo blijven we wendbaar en in staat om mee te bewegen met nieuwe inzichten, technologische ontwikkelingen en veranderende klantbehoeften. 

Vernieuwing betekent voor ons dan ook niet “altijd iets nieuws toevoegen”, maar blijven verbeteren. Elke optimalisatie, groot of klein, draagt bij aan een betere ervaring voor onze klanten en aan oplossingen die de toekomst aankunnen. 

“Vernieuwing is geen project met een einddatum, het is een mindset die alles wat we bouwen blijft vormen.”