Wireframes maken voor je website

Wireframes zijn in onze ogen onmisbaar bij het maken van een website of webapplicatie. Nadat je de sitestructuur hebt vormgegeven, is wireframing de volgende stap om tot een goed webdesign te komen. Wireframen is als het ware het digitaal lijnschetsen van de website. Je zou wireframen kunnen vergelijken met een bouwtekening, waarin je de onderdelen van een website visueel maakt.

Naar overzicht

Wat zijn wireframes? 

Wireframes zijn dus schetsen van een website. Het is onderdeel van het user experience design en user interface design. Bij wireframing ligt de focus voornamelijk bij de functionaliteiten en indeling van de layout. De sitestructuur heb je in een eerder stadium al in grote lijnen vormgegeven. Bij het wireframen ligt de focus dus meer op de indeling en functionaliteiten van de website. Later in het webdesign zal je meer de focus leggen op de uitstraling. 

De focus bij een wireframe ligt vooral op: 

  • Functionaliteit
  • Layout
  • Navigatie 
  • Structuur

Waarom wireframes maken? 

Het wireframen van de pagina’s van je website hebben als voordeel dat je eenvoudig aanpassingen kan doen aan de indeling. Zo zijn er tijdens het wireframen nog geen uren gestoken in de details van het design. Doordat het een visueel proces is, kan je dit ook nog eens gebruiken als communicatiemiddel, waarmee je interactie creëert. 

Voordat je begint met het wireframen is het belangrijk dat je eerst de sitestructuur hebt uitgedacht. Zo weet je met welke navigatie je rekening moet houden in bijvoorbeeld het menu. Bovendien weet je op deze manier ook welke pagina’s ontworpen moeten worden. Vervolgens kan je beginnen met het digitaal lijnschetsen. 

Manieren van wireframen 

Er zijn meerdere manieren van wireframen. Zo kan je zoals vanouds met pen en papier lijnschetsen, maar kan je ook een van de Adobe programma’s hiervoor gebruiken. Denk bijvoorbeeld aan PhotoshopSketch of Illustrator. Ben je op zoek naar een gratis alternatief? Op Google zijn er genoeg alternatieven te vinden! 

De volgende stap 

Nadat de wireframes voor je website zijn goedgekeurd, begin je aan het webdesign. Hier leg je de focus meer op de uitstraling. Om een ijzersterk webdesign te ontwikkelen laat je nu elementen uit je branding terugkomen. In dit proces zal je merken dat het meeste tijd gaat zitten. Als je het proces van ontwikkelen van het webdesign goed wilt laten doen, dan raden we je aan dit door een ervaren en professioneel webdesign bureau te laten doen.