Wat zijn wireframes?
Je hebt vast wel eens de term ‘wireframe’ voorbij horen komen. Online marketeers en IT’ers gebruiken de term voortdurend, maar wat is een wireframe nu precies? Het concept van een wireframe is niet zo lastig als je denkt. In principe is het gewoon de interface of indeling van een website. Als je bijvoorbeeld naar Digital Wizards website gaat, dan zie je dat de website is opgedeeld in verschillende blokken. De indeling van deze blokken en de verschillende elementen die daarbij horen, kunnen omgezet worden in een schets. Deze schets wordt een wireframe genoemd.
Waarom is een wireframe belangrijk?
Een wireframe bepaalt hoe een website eruitziet. Een potentiële bezoeker van je website komt als eerste in aanraking met de indeling en het uiterlijk van je website. Een slordige of onoverzichtelijke indeling kan de bezoeker afschrikken. En je wilt natuurlijk ook niet dat je features of functies vergeet tijdens de bouw. Het is als het ware de blauwdruk van een website die alles goed in kaart brengt zoals de bouwtekening van een architect. Een aantrekkelijk en overzichtelijk wireframe is dus zéér belangrijk voor jouw uiteindelijke website.
Lees hier ons artikel: 5 redenen om wireframes te gebruiken
Hoe komt een wireframe tot stand?
Een wireframe is een ruwe schets van je website. Deze schets wordt door een webdesigner gemaakt, vaak komen er dus nog weinig technische aspecten aan te pas. De webdesigner zal verschillende wireframes voor je maken, want er zijn natuurlijk veel verschillende mogelijkheden om je website in te delen. Daarnaast heb je meerdere Wireframes nodig.
We adviseren om een wireframe op te maken van iedere belangrijke paginasoort, denk bijvoorbeeld aan:
Wireframes voor een Website
- Homepage
- Contactpagina
- Blog en/of nieuws – detailpagina
- Blog en/of nieuws – overzichtspagina
- Dienstverlening – detailpagina
- Dienstverlening – overzichtspagina
- Standaard tekstpagina (voor bijvoorbeeld je content pagina’s)
Wireframes voor een webshop
Naast de bovenstaande wireframes komt er voor een maat webshop vaak nog deze selectie pagina’s bij:
- Product overzichtspagina
- Product detailpagina
- Check-out: winkelwagen stappen
- Check-out: betaalproces stappen
Wat doet een wireframe voor jouw website?
Een wireframe is essentieel voor de indeling van je website. Wat is het doel dat je wilt bereiken? Wil je ervoor zorgen dat bezoekers snel op een bepaald product klikken, of wil je juist zorgen voor interactie? Dit zijn allemaal factoren waar je rekening mee moet houden. Een interactief plaatje met jouw product erop kan ervoor zorgen dat mensen hier sneller op klikken, terwijl een groot tekstvak er juist voor kan zorgen dat de interactie verhoogt. De webdesigner zal altijd meerdere wireframes voor jou ontwerpen, zodat je het juiste frame kunt kiezen.
Wat voor wireframes zijn er?
Wireframes kunnen grofweg worden opgedeeld in drie types. Hieronder zullen we kort de verschillende types beschrijven.
- Low-fidelity Wireframe
Een low-fidelity wireframe is een wireframe in zijn basisvorm. Er zijn nog weinig details toegevoegd en het is een zeer ruwe schets.
- Medium-fidelity wireframes
Dit type wireframe begint al meer op een daadwerkelijke website te lijken. Er zijn al veel details toegevoegd en de structuur is duidelijk zichtbaar.
- High-fidelity Wireframe
High-fidelity wireframes zijn zeer gedetailleerd en kunnen daadwerkelijke content van jouw nieuwe site bevatten. Uiteraard kost het maken van dit frame ook meer tijd.
Wil je graag meer weten over Wireframes?
Ben je op zoek naar een webdesign voor jouw nieuwe website? Neem dan contact op met Digital Wizards om te kijken wat wij voor jou kunnen betekenen. Digital Wizards is gespecialiseerd in maatwerk websites en maatwerk webshops.
