Boeksignalement en samenvatting: Steve Krug, Don’t Make Me Think. Een nuchtere kijk op webusability, Zaltbommel 2011 (oorspronkelijke uitgave 2006). 179 pagina’s. ISBN 978 90 5871 439 8.

Bezoekers van websites verwachten van iedere website min of meer vergelijkbare structuren. Een paar voorbeelden: de plaats van het logo en de merknaam (linksboven), de navigatie (linksboven of bovenzijde onder het logo), een zoekveldje rechtsboven.  Door het bezoeken van duizenden site zit dit visuele patroon er bij de gebruikers van website ingebakken. Van deze gewoontes en conventies afwijken, betekent dat je jouw websitebezoekers in verwarring brengt, als is het maar een paar seconden. De gebruiker van een website moet plotseling gaan nadenken: “Hoe zit deze site in elkaar? Waar moet ik zijn? Waar moet ik op klikken?” Waarom dat onverstandig is, legt Krug helder en zonder pretenties uit. Bondig ook. Een verademing tussen alle  vijfhonderd pagina’s lange verhalen over SEO, Landingpage Optimization, Usability en Webdesign. Wij (Steve Krug, jij en ik) zitten als website gebruiker allemaal – ongeveer – hetzelfde in elkaar. Het gebruikersgemak van websites verbeteren is, dan ook volgens Krug vooral een kwestie van logisch denken, niet van ingewikkelde hogere wetenschap. “Dat kunnen wij allemaal”, zegt Krug. Wat een verademing dit vertrouwen….

Wijk niet af van gebruikspatronen: “conventies zijn je vrienden”
Waarom zouden wij niet lekker creatief mogen zijn en van de gebaande paden van het webdesign mogen afwijken? Het antwoord daarop is eenvoudig, zeker in de wereld van de fast moving consumer goods: iedere seconde denkkracht die de gebruiker nodig heeft om de werking van een website te doorgronden, leidt er toe dat je je bezoekers frustreert en zij hun heil elders zoeken (p. 25). Een milliseconde is daarvoor vaak al voldoende. De boodschap van Krug is helder: een webpagina moet voor zich zelf spreken! Een knop moet er als een knop om op te drukken uitzien en niet anders.

Creativiteit meestal niet effectief
Waarom je niet van webconventies moet afwijken, legt Krug in hoofdstuk twee uit. Of wij het leuk vinden of niet, er zijn drie wetmatigheden waar iedere websitebouwer mee rekening moet houden, hoe irrationeel en weinig verheffend ook:

1. We lezen pagina’s niet. We scannen ze, zoals de koppen in de kranten
2. We maken geen optimale keuzes, maar gaan voor de eerste redelijk optie ( we hebben haast, we gokken, verkeerd gokken is niet erg)
3. We zoeken niet uit hoe dingen werken. We rommelen maar wat aan (als wij iets vinden wat werkt, dan houden wij er aan vast)

Deze drie feiten bepalen het gebruik van iedere webpagina. “Jammer”, hoor je iedere op esthetiek gerichte museum directeur of webdesigner, “onze website moet toch onderscheidend zijn?”.  Helaas is het antwoord: “nee”.  Hoe help je de gebruikers nu hun weg snel en effectief te vinden? Door – net als een pagina in een krant – webpagina’s scanbaar te maken. Daarvoor gebruik je een visuele hiërarchie met kopjes en tussen kopjes en de bijbehorende tekst in blokken. Die hiërarchie moet kloppen.  Daarmee bedoeld Krug dat dingen die bij elkaar horen ook bij elkaar staan en goed van elkaar zijn afgebakend. En natuurlijk ook: wat groot gedrukt is, is belangrijker dan de kleine lettertjes.

Schep visuele rust en helderheid
Maak kristalhelder hoe de gebruiker verder actie kan ondernemen: een knop is een knop en een link ziet er uit als een link op op de klikken. En – volgens mij -de belangrijkste  adviezen van Krug: voorkom visuele onrust en zorg er voor dat als je bezoeker iets moet kiezen hij niet in verwarring kan raken en niet weet welke optie hij moet kiezen.  Verplaats je als webbouwer steeds weer in de positie van de bezoekers van je website, die zonder voorkennis jouw site bezoekt. Is de tekst van iedere “radiobutton of navigatieknop” wel helder? .oe minder woorden je daarbij gebruikt des te beter. Dat betekent schrappen en nog eens schrappen. Zeker als je instructies geeft aan jouw bezoekers wanneer je hen vraagt actie te nemen.

De broodkruimels van Hans en Grietje
In de werkelijke wereld om ons weten wij wel meestal waar wij zijn en waar wij heen gaan. We oriënteren ons in de driedimensionale wereld met straatnamen, verkeersborden, reclameborden, uithangborden, maar ook op onze ervaring, ons ruimtelijk gevoel. Dit natuurlijke gevoel van plaats ontbreekt op een beeldscherm. Altijd moet je er voorzorgen dat de bezoeker van je website weet waar die is. En – nog belangrijker – hoe hij komt waar hij wil zijn. Het belangrijkste instrument daarbij is de navigatie.  In tegenstelling tot de wereld om ons heen, is dat voor de bezoeker de enige methode om zich te oriënteren in deze platte wereld. Als een gids loopt de navigatie met de bezoeker mee: op iedere pagina vertelt de navigatie waar de gebruiker, hoe hij vooruit en achteruit komt, zonder dat de bezoeker in paniek de “terugknop” in de browser gaat gebruiken (overigens de meest gebruikte knop van de internetgebruiker). Ziet die navigatie er op alle pagina’s hetzelfde uit:  “ja, ja en nog eens ja”, behalve op de homepage en op pagina’s waar een formulier ingevuld moet worden. Die pagina’s kunnen en mogen afwijken, als de navigatie er daardoor beter op wordt.

Tabjes in kleuren
Al in onze jeugd hebben leren wij werken met tabbladen in multomappen, agenda’s, kaartenbakjes, Post-its als bladwijzer, en het liefst in kleur. Onenote, het notitie- en kladblok van Microsoft heeft ook niet voor niets deze structuuraanduiding met tabjes overgenomen. Als navigatie is het allemaal niet opwindend , maar buitengewoon effectief. Het beste voorbeeld daarvan is volgens Krug Amazon.com. Op webusability trouwens op alle aspecten en elementen de koploper in deze wereld, én ook nog een de verkenner ons allemaal de weg wijst hoe dat goed moet. Steevast zijn de ‘best in class’ voorbeelden van Steve Krug aan de website van Amazon.com ontleend: zij zijn eenvoudigweg steengoed.

De homepage als uitzondering
Een homepage is eigenlijk een vreemde gast in je website, daar moet van alles op staan. Het lijstje van Krug:

1. Site-identiteit
2. Site-hiërarchie
3. Zoeken
4. Teasers
5. Actuele content
6. Aanbieding (tegenwoordig  ‘Deals’ genoemd)
7. Sluipweggetjes (hoe ergens snel te komen)
8. Aansporingen tot actie (‘call to actions: zoals registratie voor nieuwsbrieven)

Hoe doe je dat: door onmiddellijk visueel de vier belangrijkste vragen van de bezoekers te beantwoorden: Wat is dit, Wat hebben ze hier, Wat kan ik hier doen, Waarom ik hier zijn en niet ergens anders. Zo eenvoudig is dat. Daarbij spelen twee dingen een heel belangrijke rol: de naam/titel van de site (inclusieflogo) en een tagline (pay off), die in een paar worden de kern van je bedrijf of organisatie beschrijft. De waarde van een goede tagline is niet te overschatten, zegt Krug. Daaronder een grote afbeelding met een welkomstboodschap (geen missiestatements s.v.p.). Omdat er zoveel op de homepage staat en je de bezoeker op zijn wenken wil bedienen, mag de navigatie op de homepage, en alleen op de homepage, anders zijn. Maar let er op: de namen van de knoppen en links zijn dezelfde als op de andere pagina’s, anders verwar je jouw bezoeker.

Discussiëren of vormgeving en usability? Niets daarvan: testen
Iedereen heeft heilige huisje, principes en ideeën: de een vind dat op je home page alles boven de vouw moet staan (achterhaald idee, trouwens). Discussies daarover zijn zelfde effectief en leiden alleen maar tot irritatie en loopgravenoorlogen tussen de belangrijkste spelers bij de ontwikkeling van een website. Ook het argument dat er een ‘gemiddelde webgebruiker’ zou bestaan is volstrekte onzin. Je daarachter verschuilen ook. Krug (p. 118): “Het enige probleem is dat de gemiddelde webgebruiker niet bestaat. […] alle webgebruikers zijn uniek en als het webgebruik is in feite idiosyncratisch”, zodat[…] pogingen om gebruikers in eendimensionale termen te beschrijven nutteloos en contraproductief zijn. Een goed ontwerp houdt rekening met deze complexiteit. Het enige wat je moet doen is testen en nog eens testen.N

Niet moeilijk doen over testen
De lans die Krug breekt om veel te testen is een verademing. Als je voldoende budget hebt, laat het dan over aan de specialisten. Heb je dat niet, dan gewoon zelf aan de gang gaan. Laat je dan niet ontmoedigen door alle regels en manieren om onderzoek te doen. Uiteindelijk gaat het om het resultaat: een betere website. Dan geldt beter één test met een gebruiker dan geen enkele test. Met briljante eenvoud zegt Krug: “Testen doe je niet om iets te bewijzen of te ontkrachten, je doet het om een beter oordeel te kunnen vellen” (p. 125). Begin zo snel mogelijk tijdens het ontwerpproces met testen en doe dit niet één keer, maar test en verbeter, en test vervolgens opnieuw. Kortom: observeer zoveel mogelijk gebruikers als die iets met de website moeten doen. Krug adviseert ook niet te moeilijk te doen over de selectie van de proefpersonen. Ook je buurvrouw, kennis, sportvriend of -vriendin is nuttig, ook al heb je een hele scherpe doelgroepen voor de site onderscheiden. Als je het je zelf niet te moeilijk maakt met het selecteren van proefpersonen, dan kun je je ook voornemen om de site om – bijvoorbeeld –  eens per maand aan een usability test te onderwerpen. Constant blijven verbeteren, steeds maar weer schuren en schaven.

Angst de baas
In het verleden heb ik vaak aan team voorgesteld affiches in situ te testen: buiten in de zon of schaduw. Werkt dat mooie ontwerp dan nog wel, als je met dertig kilometer per uur langs het driehoeksbord met het affiche rijdt. Steeds ontmoette ik dan weerstand: van de ontwerpers, conservatoren en directeur. Mooi is mooi en dat is voldoende. Is dat echt zo? Iets moet communiceren. Dat is uiteindelijk de enige toetssteen en maat waarlangs je de kwaliteit van een website of communicatie-uiting meet. Dat moet je omarmen, in plaats van krampachtig vast te houden aan ideeën en principes. Durf te luisteren en te verbeteren. Als je daartoe bereid bent, dan heb je al een enorme stap genomen. Inspirerend is dat Krug in de laatste paragrafen ons op het hart druk dat wij tijdens de ontwikkeling van het proces niet moeten vergeten dat een groot deel van de gebruikers een probleem of handicap heeft: kleurenblindheid, slechte coördinatie van de handen, beperkingen van het gezichtsvermogen, etc, etc. Doe er wat mee en doe er wat aan.

Terugblik
Don’t make me think lees je in één of twee avonden uit. Stel dat niet uit, ook al denk je (en terecht) dat ik hier de essentie van het boek heb toegelicht. Het boek leest als een tierelier, ook al door de vele afbeeldingen en tekeningen. Dit is een van de klassieker uit de webdesign-literatuur. Terecht. Doe er je voordeel mee…

Michiel Kersten, 30 juni 2014