Website-ontwerp: ‘de kunst van het vinden’

De heuristieken van Jakob Nielsen zijn een handige tool die u kunt gebruiken bij het ontwerp- of optimalisatieproces van een website. Ze zorgen er namelijk voor dat verschillende usability-problemen inzichtelijk worden.

Tekst: Jelle Bokma

Websites worden vaak vol gebouwd met allerlei technieken, maar sommige technieken zijn lang niet altijd functioneel. Het is belangrijk om tijdens het ontwerpproces de gebruiker centraal te zetten en het liefst nog te gebruiken tijdens dit proces.

Wat zijn heuristieken?
Vandaag de dag worden heuristieken (al dan niet automatisch) nog altijd veel gebruikt. Maar zijn deze eigenlijk nog wel zo actueel? Ze stammen namelijk uit 1994! In dit artikel leest u over de functie van heuristieken en hoe u ze tegenwoordig het best kunt gebruiken.

De heuristieken van Nielsen zijn de meestgebruikte usability-heuristieken bij user interface design. Heuristieken zijn een soort wetenschap, het gaat om de leer of de kunst van het vinden. Simpel gezegd gaat het om het voorkomen van veelvoorkomende problemen. Het handige van de heuristieken is dat u een bepaalde maatstaf heeft met aandachtspunten tijdens een ontwerpproces. Als u namelijk niet weet waar u op moet letten, wordt het een lastig verhaal.

Heuristieken van Nielsen
De heuristieken die Nielsen heeft gepubliceerd in zijn boek Usability Engineering zijn als volgt:

1. Visibility of system status (zichtbaarheid van de status)
Dat een bezoeker soms moet wachten tot een pagina is geladen omdat de meest recente data moet worden opgehaald, is helemaal niet erg. Belangrijk hierbij is om uw bezoeker niet in het onwetende te laten. Laat uw bezoeker altijd zien waarom hij moet wachten. Dit kan heel simpel door het tonen van een loader. Hetzelfde geldt voor het wachten bij een stoplicht. Als stoplichten de wachttijd aftellen, staat de fietser veel geduldiger voor het stoplicht te wachten dan wanneer dat niet het geval is.

2. Match between system and the real world (relatie tussen website en bezoeker)
U kunt het beste communiceren wanneer u elkaars taal spreekt. Een relatie met iemand beginnen die uw taal niet kent, is lastig. Dit is ook het geval bij websites. Zorg ervoor dat u de taal van de bezoekers spreekt. Wanneer de website niet bij de beleving van de bezoeker past, is de kans veel kleiner dat hij iets gaat doen op de website.

3. User control and freedom (zekerheid en controle)
Zorg dat de bezoeker de touwtjes in handen heeft. Hierdoor wordt de bezoeker gerustgesteld. Laat daarnaast de bezoeker belangrijke beslissingen zelf ongedaan kunnen maken. Is er bijvoorbeeld een product te veel in het winkelmandje geplaatst? Zorg er dan voor dat de bezoeker dit zelf kan verwijderen, dat geeft de bezoeker meer zekerheid en controle.

Dit is te vergelijken met een pinautomaat. Wanneer uw pinpas hierin wordt opgeslurpt, is het altijd even spannend of u de pas wel terugkrijgt. Vandaar dat veel pinautomaten tegenwoordig de pas niet helemaal meer innemen. Hierdoor wordt een stukje zekerheid gecreëerd bij degene die geld pint.

4. Consistency and standards (consistentie en standaarden)
Mensen willen houvast en consistentie. Sommige zaken worden altijd op een website terugverwacht. Denk aan het logo linksboven en een zoekfunctie rechtsboven. Ook het gebruik van bepaalde woorden zijn soms zo vanzelfsprekend, verander hier dus niks aan. Dit alles valt onder de categorie: if it ain’t broke, don't fix it!

5. Error prevention (voorkom fouten)
Een fout kan in een klein hoekje zitten, zeker op een website. Voorkom fouten voordat ze kunnen gebeuren. Het klinkt als een open deur, maar als de bezoeker bij een formulier bijvoorbeeld een geboortedatum kan selecteren in 2018, weet hij dat het niet klopt. Zorg er simpelweg voor dat mensen dit niet kunnen selecteren. Hetzelfde geldt bij het ontwerpen van een wastafel. Het gaatje dat onder de kraan zit, zit er om fouten te voorkomen. Wanneer de kraan te lang blijft lopen en de wastafel dreigt over te lopen, zorgt het gaatje er immers voor dat het water op de juiste manier weggaat. Op deze manier wordt een overstroming voorkomen.

6. Recognition rather then recall (erken fouten, los ze op en informeer de gebruikers)
Fouten maken doet iedereen. Zeker online is het belangrijk dat die fouten ook worden toegegeven. Denk hierbij aan een goede 404-pagina. Het kan voorkomen dat een pagina niet meer bestaat of een link niet goed is ingevoerd. Leg nooit de schuld bij de gebruiker, maar zorg ervoor dat het wordt opgelost. Op de 404-pagina kunt u bijvoorbeeld een zoekbalk plaatsen, zodat gebruikers kunnen doornavigeren. Ook het plaatsen van relevante links kan de uitstap op de pagina verkleinen.

7. Flexibility and efficiency of use (flexibiliteit en efficiency)
Bezoekers willen altijd zo veel mogelijk flexibiliteit. Online moet het meestal ook sneller dan snel. Zorg er dus voor dat dit mogelijk is. Denk bijvoorbeeld aan het bestellen als ‘gastbezoeker’. Vaak willen mensen uw producten wel bestellen, maar ze willen niet altijd een waslijst aan gegevens bij u achterlaten omdat ze – voorlopig - maar één keer willen bestellen. Wees flexibel en bied deze optie. Stem de website af op zo veel mogelijk individuele wensen van de doelgroep. Een andere manier om flexibiliteit te integreren in de website is personalisatie. Laat de gebruikers bijvoorbeeld hun eigen omgeving zo stylen dat het voelt alsof het van hun zelf is.

8. Aesthetic and minimalist design (vorm en minimalisme)
‘Schrijven is schrappen’, wordt er altijd gezegd. Zo is het ook tijdens het ontwerpproces. Zorg dat alle overbodige informatie is weggelaten. Dit kan namelijk voor verwarring zorgen en het kan zijn dat de boodschap niet meer duidelijk overkomt.

Zie onderstaande afbeelding van een Nutella-pot. Komt de merkbeleving nog over als er alleen Nutella staat? Of komt de beleving beter over met afbeeldingen van een rijk gesmeerde boterham?

9. Help users recognize, diagnose, and recover from errors (help gebruikers herkennen, herstellen en diagnosticeren van fouten)
Bepaalde zaken herkennen is soms makkelijker dan ze te onthouden. Zorg dat het voor gebruikers zo gemakkelijk mogelijk wordt gemaakt en dat ze niet te veel dingen moeten onthouden. Denk hierbij aan een verkleurde link die ze al hebben aangeklikt, zodat het duidelijk is dat ze die link al hebben gehad. Zorg er dus voor dat de website dingen onthoudt die belangrijk zijn of geef die informatie nog een keer daar waar het nodig is.

10. Help and documentation (bied een helpende hand)
Soms is het voor bezoekers niet altijd duidelijk wat ze moeten doen. Bied daarom een helpende hand. Doe dit wel alleen als het nodig is. Een website moet uiteraard duidelijk zijn zonder hulp, maar soms komt u hier niet onderuit en hebben bezoekers hulp nodig. Denk hierbij aan de subtiele hulp die u krijgt bij een peper- en zoutvaatje. De P staat voor peper en de S voor salt. Ga maar eens na hoe lastig het kan zijn als deze letters er niet op zouden staan.

Hoe zit dit anno 2013?
De heuristieken van Nielsen bestaan dus al een tijdje. Maar zien we ook verandering in het gebruik van deze heuristieken in de loop der jaren? Niet echt. Wat wel opvalt, is dat de heuristieken vaak niet meer als aandachtspunten worden gezien, maar als vuistregels. Veel webbouwers nemen een aantal heuristieken vaak al mee, al dan niet onbewust. Toch zou elke websitebouwer en -designer de tien punten moeten kennen en meenemen in het realisatieproces van een website.

Heuristieken hebben ook een aantal kanttekeningen. Ze kunnen namelijk geen nieuwe problemen opsporen, maar alleen bekende problemen voorkomen. Om achter nieuwe problemen te komen, moet u gebruikerstests inzetten. Omdat er zo veel verschillende doelgroepen zijn, zullen niet alle heuristieken een-op-een werken. Om te kijken wat voor uw gebruikers werkt, kunt u een A/B-test opzetten.

Continue ontwikkeling
Zorg dat de gebruiker te allen tijde centraal staat en zorg dat de heuristieken goed zijn verwerkt in het design en de techniek zodat de eerste en belangrijkste kinderziektes eruit zijn. Vanuit dat startpunt gaat u door met het houden van gebruikerstests en doet u analyse naar de websitestatistieken. Op deze manier weet u hoe de gebruikers zich gedragen op uw website en waar er nog te optimaliseren valt. Vanuit die situatie kunt u weer verder met het doen van usability-testen en A/B-testen. Op deze manier blijf u continu bezig met het optimaliseren van uw website.

Jelle Bokma is online marketeer bij Invest Online.