Wat is webdesign?
Webdesign is het ontwerpen van de vormgeving en de gebruikersinterface van een website: hoe een site eruitziet, hoe pagina’s zijn ingedeeld en hoe een bezoeker zich erdoorheen beweegt. Het gaat om kleurgebruik, typografie, beeldtaal, de opbouw van pagina’s en de manier waarop knoppen, menu’s en formulieren zijn vormgegeven. Webdesign gaat niet over de technische bouw van een website. De code, het CMS, de koppelingen en de werking achter de schermen vallen onder webdevelopment. Een ontwerper levert een blauwdruk voor hoe de site eruitziet en werkt; een developer bouwt die blauwdruk om tot een werkende website.
De kerngedachte achter webdesign is dat een website twee dingen tegelijk moet doen: een merk overtuigend presenteren en een bezoeker moeiteloos naar zijn doel leiden. Dat is voortdurend een balans tussen esthetiek en bruikbaarheid. Een site die er verzorgd uitziet maar onduidelijk is in de navigatie, verliest bezoekers net zo snel als een site die functioneel in elkaar zit maar oogt als een kale lijst. Goed webdesign brengt beide kanten samen: het oog en de gebruikerservaring.
Webdesign staat zelden op zichzelf. Het bouwt voort op een bestaande huisstijl of merkidentiteit en legt tegelijk de basis waarop development, content en latere optimalisatie verder werken. Bij een nieuwe website is het ontwerp doorgaans de eerste zichtbare stap na de conceptvorming, en de keuzes die daarin worden gemaakt, bepalen voor een groot deel hoe soepel de rest van het traject verloopt.
Wat valt er precies onder?
Webdesign bestaat uit een reeks deelactiviteiten die na elkaar of gedeeltelijk gelijktijdig worden uitgevoerd, van de eerste indeling van een pagina tot de laatste details in kleur en beeld.
- Informatiearchitectuur: de indeling van pagina’s en de menustructuur, zodat een bezoeker logisch van de ene naar de andere pagina navigeert zonder te hoeven zoeken.
- Wireframes: schetsen van de opbouw van een pagina zonder kleur of definitief beeld, gericht op indeling, volgorde en hiërarchie van de inhoud.
- Visueel ontwerp (UI): het kleurenpalet, de typografie, iconen en het beeldgebruik: de concrete uitstraling die een bezoeker daadwerkelijk ziet.
- Responsive ontwerp: hoe pagina’s zich aanpassen aan verschillende schermformaten, van een smartphone tot een groot beeldscherm.
- Interactieontwerp: hoe knoppen, menu’s, formulieren en kleine animaties reageren op een klik of tik, en wat een bezoeker daarbij te zien krijgt.
- Prototyping: een klikbaar model van de website waarin de werking al getest kan worden voordat er een regel code geschreven is.
- Toegankelijkheid: voldoende contrast, leesbare tekst en bediening die ook werkt voor bezoekers met een visuele of motorische beperking.
- Stijlgids of design system: vastgelegde regels voor kleuren, lettertypes en herbruikbare onderdelen, zodat nieuwe pagina’s later consistent blijven.
Hoe verloopt een ontwerptraject?
Een ontwerptraject verloopt zelden in één sprong van idee naar eindresultaat. Het bouwt zich op in lagen, waarbij elke stap de volgende stap mogelijk maakt en eerdere keuzes toetst voordat er verder wordt gewerkt.
- Intake en briefing. Doelgroep, doelen van de website, concurrenten en een eventuele bestaande huisstijl worden in kaart gebracht. Dit bepaalt de kaders waarbinnen het ontwerp tot stand komt.
- Research en sitemap. Er wordt gekeken naar hoe vergelijkbare sites zijn opgebouwd en wat bezoekers nodig hebben, waarna de paginastructuur van de nieuwe site wordt vastgelegd.
- Wireframes. De indeling van de belangrijkste pagina’s wordt geschetst zonder opmaak, met de nadruk op wat waar staat en in welke volgorde.
- Visueel ontwerp. Op basis van een stijlrichting worden kleur, typografie en beeld uitgewerkt tot pagina’s die er daadwerkelijk uitzien zoals de uiteindelijke website.
- Prototype en feedbackrondes. Een klikbaar model laat zien hoe de site aanvoelt in gebruik. Opdrachtgever en soms ook toekomstige gebruikers geven feedback, die verwerkt wordt voordat het ontwerp wordt vastgesteld.
- Overdracht aan development. Bestanden, specificaties en beeldmateriaal worden aangeleverd zodat een developer het ontwerp kan omzetten in een werkende website.
Wanneer heb je webdesign nodig?
De meest voor de hand liggende aanleiding is een nieuwe website, waarbij er nog geen ontwerp bestaat of het bestaande ontwerp niet meer aansluit bij wat een bedrijf wil uitstralen. Ook een rebranding is een vast moment: als de huisstijl verandert, moet de website meestal mee, omdat een verouderd ontwerp naast een vernieuwd logo of vernieuwde kleuren al snel ongemakkelijk oogt.
Een andere reden is een website die simpelweg gedateerd aanvoelt, ook al functioneert hij technisch nog prima. Bezoekers vormen razendsnel een eerste indruk, en een verouderde uitstraling kan afbreuk doen aan het vertrouwen dat een bedrijf probeert te wekken. Ook klachten over de bruikbaarheid zijn een signaal: als bezoekers vaak de weg kwijtraken, snel weer wegklikken of formulieren niet afmaken, ligt de oorzaak regelmatig in de indeling en interface van de site.
Tot slot komt webdesign in beeld bij uitbreiding: een nieuwe productlijn, een nieuw kanaal zoals een webshop naast een informatieve site, of de overstap naar een structuur die meer pagina’s en meer content aankan dan de oorspronkelijke opzet was bedoeld voor.
Wat levert het op?
Webdesign levert in de eerste plaats een website op die overtuigender oogt en makkelijker te gebruiken is. Een heldere indeling en een doordachte interface maken het voor bezoekers eenvoudiger om te vinden waar ze naar op zoek zijn, en een consistente uitstraling versterkt hoe een bedrijf wordt waargenomen. Of dat zich ook vertaalt in meer aanvragen, verkopen of ander gemeten resultaat, hangt af van veel meer dan het ontwerp alleen: de kwaliteit van de content, de techniek eronder, hoe gericht bezoekers naar de site worden geleid en hoe goed het aanbod aansluit bij wat een bezoeker zoekt.
Het is daarom eerlijker om de opbrengst te zien als het wegnemen van drempels dan als een garantie op resultaat. Een site die eerder onduidelijk of onaantrekkelijk was, kan na een herontwerp merkbaar prettiger werken voor bezoekers. Een site die al functioneel goed in elkaar zat, wint vooral op uitstraling en consistentie, en dat effect is minder scherp te meten. Wie een directe stijging in conversie verwacht als enig gevolg van een nieuw ontwerp, kijkt te smal: webdesign werkt samen met content, techniek en marketing, niet los daarvan.
Waar let je op als je dit uitbesteedt?
Bekijk eerst eerder werk van een ontwerper of bureau, en let daarbij niet alleen op of het mooi is, maar of de stijl uiteenlopende opdrachten aankan. Een portfolio met louter gelijkende sites zegt minder over het vermogen om iets passend voor jouw merk te maken dan een portfolio met duidelijk verschillende oplossingen voor verschillende opdrachtgevers.
Maak vooraf helder wat er precies geleverd wordt: alleen het ontwerp, of ook de bouw en oplevering van een werkende site. Spreek ook af hoeveel feedback- en aanpasrondes zijn inbegrepen, want dat is een veelvoorkomende bron van meerwerk als het niet vooraf is vastgelegd. Vraag daarnaast wie eigenaar wordt van de ontwerpbestanden na afronding; zonder toegang tot die bestanden ben je bij een volgende aanpassing afhankelijk van dezelfde partij.
Ga ten slotte na of het ontwerp rekening houdt met wat technisch haalbaar is binnen het gekozen CMS of platform. Een ontwerp dat losstaat van de mogelijkheden en beperkingen van de bouwomgeving leidt bijna altijd tot vertraging of concessies zodra het richting development gaat.
Veelgemaakte fouten
Een aantal valkuilen keert in webdesigntrajecten steeds terug, vaak omdat ontwerp en de rest van het traject onvoldoende op elkaar zijn afgestemd.
- Ontwerp los van bouwbaarheid. Een ontwerp dat technisch niet of alleen tegen hoge kosten te bouwen is binnen het gekozen platform, leidt tot vertraging of een verwaterde eindversie.
- Esthetiek zonder bruikbaarheid. Een site die er indrukwekkend uitziet maar waarin bezoekers de navigatie of een belangrijke knop niet vinden, mist alsnog zijn doel.
- Ontwerpen met placeholdertekst. Als het ontwerp is gemaakt met neptekst in plaats van echte content, past de indeling vaak niet meer zodra de daadwerkelijke teksten en beelden worden ingevoegd.
- Geen mobile-first aanpak. Een ontwerp dat begint op een groot scherm en pas achteraf voor mobiel wordt aangepast, terwijl een groot deel van de bezoekers juist op een telefoon binnenkomt.
Wat bepaalt de prijs?
De prijs van webdesign hangt sterk af van hoeveel unieke pagina’s er ontworpen moeten worden en hoeveel maatwerk daarbij komt kijken. Een site die grotendeels uit vergelijkbare paginatypes bestaat, is sneller te ontwerpen dan een site met veel verschillende onderdelen die elk een eigen indeling nodig hebben.
| Wat de prijs opdrijft | Waarom het meetelt |
|---|---|
| Aantal unieke paginatypes | Elke afwijkende indeling vraagt eigen ontwerptijd, ook als de stijl hetzelfde blijft. |
| Mate van maatwerk | Een volledig op maat ontworpen site kost meer tijd dan een ontwerp gebaseerd op een bestaand sjabloon. |
| Aantal revisierondes | Meer feedback- en aanpasrondes verlengen het traject en de bestede uren. |
| Toegankelijkheid en devices | Extra aandacht voor toegankelijkheid en voor meerdere schermformaten vraagt extra afstemming en controle. |
De vorm van de samenwerking telt daarnaast mee. Een eenmalig ontwerptraject voor een nieuwe of vernieuwde website is een afgebakend project met een vaste scope. Sommige bedrijven kiezen in plaats daarvan voor een doorlopende relatie met een ontwerper, bijvoorbeeld om regelmatig nieuwe landingspagina’s of campagne-uitingen te laten ontwerpen; dat is dan een terugkerende post in plaats van een eenmalig bedrag. Vraag bij een offerte altijd na of revisierondes, responsive ontwerp voor alle schermformaten en de aanlevering van bestanden voor development zijn inbegrepen.
Webdesign en aanverwante diensten
Webdesign richt zich op hoe een website eruitziet en werkt voor de bezoeker, en raakt daarmee aan een aantal diensten die er dicht tegenaan liggen maar een ander accent hebben. Webdevelopment bouwt het ontwerp om tot een werkende website en regelt alles wat achter de schermen gebeurt; ontwerp en bouw worden vaak los aanbesteed, maar moeten wel goed op elkaar aansluiten. Bij een webshop komt daar e-commerce platforms bij, waarbij het ontwerp rekening houdt met een productcatalogus, winkelwagen en afrekenproces. CRO en A/B-testen gaat over het na livegang verder verbeteren van een bestaand ontwerp op basis van gemeten gedrag, terwijl webdesign zich vooral richt op de eerste, doordachte versie. UX-onderzoek ten slotte levert vaak de input waarop een ontwerp wordt gebaseerd, door voorafgaand aan of tijdens een traject te onderzoeken hoe gebruikers daadwerkelijk denken en handelen.