Een goede opbouw van de website

Wat zijn belangrijke aandachtspunten bij het ontwerp van een website, ofwel wat is een goede opbouw van de website? Hoe kijken de bezoekers? Waar moeten de labels en knoppen in formulieren staan? Spreekt de website de taal van de doelgroep?

Hierbij een overzicht van tien inzichten voor gebruiksvriendelijkheid van een website:

1. Gebruik zoveel mogelijk een standaard indeling

Bezoekers van je website zijn gewend aan een min of meer standaard indeling die ze op andere sites tegen komen. Er is een bepaald verwachtingspatroon opgebouwd over hoe websites in elkaar zitten. Dat verwachtingspatroon is gebaseerd op hoe de meeste websites in elkaar zitten. Door hier op in te spelen help je bezoekers sneller te vinden wat zij zoeken. Origineel zijn is leuk, maar mag de bezoeker nooit voor raadsels plaatsen. Probeer je originaliteit niet uit te drukken in de opbouw van je site, maar door de inhoud.

Waar aan voldoet een standaard indeling?

• Logo links boven met een hyperlink naar de homepage
• Zoekmachine rechtsboven als invulveld met zoekknop er rechts naast. Als het invulveld 27 karakters breed is wordt 90% van de zoekopdrachten gedekt
• Hyperlink naar pagina met contactgegevens rechtsboven
• Inloggen / uitloggen rechtsboven
• Navigatie horizontaal boven of verticaal links
• Taalkeuze rechtsboven bij voorkeur visueel als vlag
• Hyperlinks in afwijkende kleur ten opzichte van de normale tekst bij voorkeur blauw en onderstreept

2. Plaats belangrijkste content direct in het zicht

Veel mensen baseren hun eerste indruk van de website zonder te scrollen. 25% van webpagina’s wordt minder dan 4 seconden getoond en 52% minder dan 10 seconden. Dat is kort. Daarom moet de belangrijkst boodschap direct in het zicht staan, dus zonder te scrollen. De meestgebruikte resolutie is nog steeds 1024 bij 768, daarom is het aan te raden om 550 to 600 pixels hoogte aanhouden voor het eerste zicht.

3. Gebruik geen hoofdletters voor hele woorden of zinnen

Hoofdletters lezen niet prettig en bezoekers zijn daarom minder snel geneigd woorden en zinnen in hoofdletters te lezen. Uit onderzoek van Karen Schriver (zie het boek: Dynamics in Document Design) blijkt dat bij gebruik van hoofdletters voor hele woorden of zinnen de leessnelheid met 13% tot 20% afneemt. Gebruik dus niet uitsluitend hoofdletters voor titels, menu’s, hyperlinks en knoppen. Kies liever voor vet of een opvallende kleur.

4. Spreek de taal van de bezoeker

Gebruik zo min mogelijk jargon en laat de website niet alleen een afspiegeling van het organigram de organisatie zijn. Via Google Analytics of het bijhouden van de ingegeven zoekwoorden op de website kan makkelijk bepaald worden wat de taal van de bezoekers is. Een andere methode is om via Google Trends te bepalen hoe vaak bepaalde zoekwoorden worden gebruikt.

5. Plaats geen banners

Volgens eyetracking-onderzoek blijkt dat het overgrote deel van de mensen banners negeren. Niet alleen banners maar ook alles wat op een banner lijkt wordt genegeerd. Rechthoekige blokjes zijn vaak banners die bij aanklikken irritante pop-ups openen. Dat wordt liever voorkomen. Plaats eigen content dus niet in de vorm van banners.

6. Gebruik opvallende en betekenisvolle hyperlinks

Bezoekers lezen over het algemeen nauwelijks, zij scannen vooral. Ze scannen vooral de koppen, knoppen en links. Het is daarom belangrijk dat deze afwijkend worden weergegeven, direct opvallen en een betekenisvolle tekst bevatten, zodat iedereen meteen snapt waar het over gaat. Betekenisloze links als  ‘klik hier’ dienen te worden vermeden. Bezoekers hebben content nodig om de link te begrijpen en dat kost extra tijd.

7. Plaats knoppen bij formulieren in de leesrichting

Formulieren zorgen over het algemeen voor relatief veel afhakers. Mensen houden niet van formulieren, het duurt lang om ze in te vullen. Maar al te vaak worden ze afgeleid en wordt het formulier niet verstuurd. Toch heb je ze nodig om conversie te krijgen. Dan moet je er voor zorgen dat het eenvoudig is om in te vullen. Uit onderzoek van Luke Wroblewski & Etre blijkt dat het effect van de positie en weergave van knoppen van belang is bij het invullen van formulieren. Plaats deze in de leesrichting.

8. Gebruik geen annuleer- en wisknoppen

In veel gevallen is het gebruik van een annuleren/cancel of een wisknop af te raden. Het komt bijna niet voor dat je bezoeker een geheel ingevuld formulier wil wissen.

9. Kies slimme posities van labels bij formulieren

Ook de positie van labels ten opzichte van de invulvelden zijn van invloed op de snelheid van invullen. Zij veroorzaken namelijk verschillend kijkgedrag. Eyetracking-beelden uit onderzoek van Matteo Penzo illustreren dit. Zie ook het artikel van Luke Wroblewski Web Application Form Design hierover. Kies daarom de beste plek voor je labels.

10: Sturend effect van lijnen en vlakken

Veel ontwerpen bevatten lijnen en vlakken om de indeling en samenhang te verduidelijken. Uit eyetracking-onderzoek blijkt dat koppen soms niet worden gezien omdat ze buiten het blok zijn geplaatst waar ze bijhoren. Zorg dus voor een goede indeling van je pagina’s.