Niets is zo complex als de schoonheid van de eenvoud

Niets is zo complex als de schoonheid van de eenvoud

Eenvoud. Het klinkt eenvoudig. Maar voordat een ontwerp écht eenvoud uitstraalt, zijn daar doorgaans heel wat stevige discussies, onzekere keuzes en pijnlijke beslissingen aan vooraf gegaan. Voor mij is die ultieme eenvoud in een website, zowel in vorm als in functie, altijd het doel. Dit proces vergt tijd maar dat is het dubbel en dwars waard. De ingrediënten die je daarvoor nodig hebt zijn een flinke dosis lef en het vertrouwen in de designer.

“Eenvoud is de ultieme verfijning”,
Leonardo da Vinci

‘Download hier de whitepaper’, ‘Klik hier voor meer info’, ‘Ons laatste nieuws’

Ja, natuurlijk wil je zoveel mogelijk nieuwsbriefinschrijvingen ontvangen. Die whitepaper? Die moet in de downloadmap van iedere bezoeker terechtkomen. Je laatste bedrijfsnieuws? Tuurlijk joh, dat zetten we ook nog even rechts in de sidebar. Maar hoe kun je zorgen dat je bezoeker een specifiek koekje kiest, als je etalage er vol mee ligt? En ja, ik trap ook nog dikwijls in deze valkuil.

Kill your darlings

Het doet pijn als je moet gaan strepen om je ontwerp eenvoudiger te maken. Maar als het geen pijn doet, doe je iets niet goed. Om echt tot de kern van je verhaal, je boodschap te komen, zul je moeilijke keuzes moeten maken. Niet schieten met hagel, maar zorgvuldig richten op je doel. Dit geldt in het bijzonder voor online communicatie. De valkuil van overprikkelen is nergens zo groot als op het web. Eén animatie te veel, één knop op de verkeerde plek, en je conversie zakt weer een aantal procenten.

Niet omdat het kan, maar omdat het moet…

Bij de ontwikkeling van een website (vul gerust elk ander communicatiemiddel in) is een schatkist aan mogelijkheden in te zetten. Maar de hoeveelheid aan tools heeft een vernietigende werking als deze niet op de juiste wijze en op het juiste moment wordt ingezet. Dus: waar beginnen we? Hoe kunnen we eenvoud uit chaos distilleren? Tatatadaaaaa… – een episch trompetgeschal – : Wireframes to the rescue.

‘Wireframes are go!’

Wireframes zijn een schetsmatige weergave van een webpagina. Zie het als een constructietekening van een website, waar per pagina wordt aangegeven welke informatie, onderdelen en functies er nodig zijn om de boodschap op die pagina het best tot zijn recht te laten komen. Een belangrijk kenmerk daarbij is dat er geen enkele vorm van design aan te pas komt.

Door afwezigheid van enige vormgeving ben je beter in staat om een optimale structuur te bepalen. Een structuur die maar één hoofddoel dient (dat je vooraf bepaald hebt).

That’s been one of my mantras — focus and simplicity. Simple can be harder than complex: you have to work hard to get your thinking clean to make it simple. But it’s worth it in the end because once you get there, you can move mountains.

Steve Jobs, BusinessWeek, 25 mei 1998

KISS me

Hoe simpel kunnen we het maken? Wanneer gaan we te ver in die eenvoud? Natuurlijk is er geen standaard voor structuur en design. Om toch deze zoektocht naar eenvoud te -uhm- vereenvoudigen, maak ik gebruik van KISS. Dit staat voor Keep It Simple Stupid / Short*.

* Doorstrepen wat niet van toepassing is

Ik pik er een aantal uit die voor mij altijd – OK, niet altijd, soms wel, soms niet, af en toe, enz.- houvast bieden:

1 Verminder het aantal keuzes

Hick’s wet onderschrijft dat hoe meer keuzes je de bezoekers voorlegt, hoe langer het duurt voordat de beslissing gemaakt wordt. Klinkt logisch toch? Maar dat houdt dan ook in dat hoe langer een bezoeker bezig is met beslissen, hoe lastiger het wordt om in te spelen op intuïtie.

2 Minimaliseer kleurgebruik

Kleur is top, kleur zorgt voor contrasten, accenten en aandachtsprikkels. Gebruik echter een beperkt palet en gebruik de kleuren consistent. Mijn collega Kathrin heeft daar een mooi blog over geschreven. Aanrader!

3 Verwijder elementen waar niet op geklikt wordt

Elk element dat niet converteert (doorgaans is dat een klik) op een pagina, neemt kostbare ruimte in, en kan een negatieve invloed hebben. Met tools kun je deze elementen opsporen en vervolgens verbeteren of uitschakelen.

4 Maak gebruik van beeld

Beelden zijn eenvoudiger te verwerken dan tekst. Let wel, de interpretatie van beelden kan nogal uiteenlopen, dus onderbouwing met tekst is geen overbodige luxe.

5 Hou de structuur eenvoudig

Minimaliseer de navigatie tot maximaal 7 items en houd de menubenaming herkenbaar ten opzichte van de pagina’s die daaraan gekoppeld zijn. Vermijd dropdown-menu’s en ga niet meer dan 2 niveau’s de diepte in.

6 Maak gebruik van veel witruimte

Nee, ik heb het niet over de letterlijke zin van wit, maar de ruimte om een element heen. Zie het als muziek. Het gaat niet om de noten die je speelt, maar de stilte er omheen.

7 Minimaliseer gebruik van sidebars

Een sidebar kan erg nuttig zijn om metadata in weer te geven, navigatie in te plaatsen, en zelfs Call to Actions in te plaatsen. Diverse onderzoeken wijzen uit dat sidebars een stuk minder converteren. Dus houd je data goed in de gaten en wees niet bang om rigoureuze maatregelen te nemen.

Non of the above

Nu is je website live, maar blijkt uit de data dat hij voor geen meter converteert. Wat is er gebeurd? We hebben ons toch aan KISS gehouden? Maar KISS is een richtlijn, geen handboek. Iedere bezoeker is anders en zal anders reageren op design, layout en functionaliteit. Hou je data dus goed in de gaten en grijp in waar nodig. Welke tools je daarbij in moet zetten en hoe je die optimaal gebruikt, leg ik in een volgend blog aan je uit.