In 2003 kocht ik het Handboek Website Usability van Peter Kassenaar en Oskar van Rijswijk. In dit boek staan de tien gouden richtlijnen voor een gebruiksvriendelijke website. Ik heb veel aan deze richtlijnen gehad bij het maken van mijn websites en ik gebruik ze nog steeds. Als jij deze richtlijnen opvolgt, kun je er zeker van zijn dat ook jouw website gebruikersvriendelijk is.
1. Maak duidelijk wie je bent en wat je doet
- Plaats een ‘uithangbord’ op elke webpagina: je logo (het liefst linksboven) plus een informatieve slagzin. Gebruik op andere pagina’s dan de homepage een duidelijke paginatitel boven de tekst die het doel of de inhoud van de pagina omschrijft.
- Groepeer je bedrijfsinformatie op aparte servicepagina’s. Maak deze bereikbaar via een link ‘Over ons’ of ‘Over bedrijfsnaam’.
2. Plaats een navigatiemenu op elke pagina
- Plaats op elke webpagina hetzelfde primaire navigatiemenu.
- Bied de bezoeker overal een weg terug naar de homepage met de tekstlink ‘Home’. Zorg er ook voor dat het logo een link naar de homepage is.
- Om het overzichtelijk te houden, beperk je je tot 7 plus of min 2 hyperlinks in je primaire navigatiemenu.
3. Zorg dat de pagina’s van je websites snel laden
- Beperk de omvang van de homepage tot maximaal 50 kB, inclusief scripts, stylesheet en multimediabestanden. Andere pagina’s mogen eventueel zwaarder worden, maar splits erg grote pagina’s op in meerdere kleine. Hoewel niemand tegenwoordig meer door een traag telefoonmodem wordt beperkt, surfen steeds meer mensen mobiel en daarvoor geldt: minder dataverkeer is minder kosten.
- Zorg voor splitsing van opmaak en inhoud door optimale code. Gebruik hiervoor de webstandaarden (X)HTML en CSS.
4. Help je bezoekers te vinden wat zij zoeken
- Plaats een zoekvenster boven in elke webpagina. Houd dit eenvoudig: één wit zoekveld met ruimte voor 25-30 tekens en een knop met het opschrift ‘Zoek’ of ‘Zoeken’.
- Plaats op je website servicepagina’s met een FAQ (Frequently Asked Questions) en een Sitemap (inhoudsopgave), bereikbaar vanuit het primaire menu.
5. Maak je webpagina’s optimaal leesbaar op elk beeldscherm
- Optimaliseer de pagina voor een minimale resolutie van 1024×960, maar zorg er tevens voor dat de pagina ook goed leesbaar is op kleinere schermen, zoals mobiele telefoons.
- Zorg voor goede leesbaarheid van de pagina op een beeldscherm. Hanteer goed contrast tussen voor- en achtergrondkleur; gebruik liefst een schreefloos lettertype en schaalbare lettergrootte.
6. Geef zoveel mogelijk informatie met zo weinig mogelijk woorden
- Schrijf kort: schrap rigoureus alle overbodige tekst.
- Schrijf de belangrijkste informatie eerst: in de titelbalk (<title>), in de paginatitel en in de kopteksten. Plaats de informatieve kernbegrippen aan het begin van elke koptekst, alinea, zin en hyperlink. Zo wordt je pagina optimaal scanbaar. En beter vindbaar in Google.
- Maak je tekst geschikt om te scannen: gebruik hiervoor accenten in de vorm van koppen (<h1>…<h6>), benadrukte tekst (<strong>) en opsommingen (<u>en <ol>). Beperk hierbij de paginalengte tot 2 beeldschermen (1000-1800 pixels).
7. Geef je informatie context en diepgang met duidelijke links
- Maak je hyperlinks informatiedragend. Dus niet ‘Klik hier’. Gebruik de hyperlinktekst om aan te geven waar de bezoeker terecht zal komen.
- Codeer hyperlinktitels om extra informatie aan je hyperlinks mee te geven (<a href=”…” title=”korte beschrijving van de hyperlink”>). Deze titel verschijnt wanneer de bezoeker de muis over de hyperlink beweegt.
- Maak hyperlinks duidelijk herkenbaar ten opzichte van de omliggende tekst. Gebruik een afwijkende kleur voor hyperlinks (liefst de standaardkleur blauw) en laat hyperlinks onderstreept. Zorg ervoor dat bezochte hyperlinks herkenbaar zijn in een afwijkende kleur (liefst de standaardkleur paars).
8. Geef je bezoekers de mogelijkheid zelf dingen te doen
- Maak belangrijke interactieve elementen van de site direct bruikbaar op de homepage. Denk in elk geval aan zoeken en bijvoorbeeld aan inschrijven voor je nieuwsbrief of e-zine of een offerte aanvragen.
- Laat de gebruikers zien wat ze doen. Maak de formulieren zo eenvoudig mogelijk en geef na iedere actie van de gebruiker feedback over wat er wel of niet goed is gegaan.
- Maak bezoekers duidelijk welk type reactie zij binnen welke termijn kunnen verwachten. Zorg dat de jij aan ‘jouw kant’ van de interactie de toegezegde service en optimale kwaliteit kunt bieden.
9. Maak je website toegankelijk voor iedereen
- Maak gebruik van alternatieve teksten voor afbeeldingen zodat screenreaders en spraakbrowsers ermee overweg kunnen (<img src=”…” alt=”beschrijving van de afbeelding”>). Dit is ook goed voor de zoekresultaten van Google.
- Zorg ervoor dat het hoofdmenu en de informatie op de pagina altijd ook als tekstinformatie aanwezig is. Zorg indien mogelijk voor een complete tekst-only versie van de site.
- Maak gebruik van standaard (X)HTML-coderingen voor kopteksten en benadrukte tekst. Plaats nooit meer HTML-opmaakcodes zoals <font> en <b> in je schermteksten, maar regel dit via CSS (in een externe stylesheet).
10. Afbeeldingen en multimedia: gebruik ze spaarzaam en doelgericht
- Beperk het gebruik van afbeeldingen liefst tot 5 à 15% van het oppervlak van de webpagina, ter illustratie van belangrijke onderdelen van de website.
- Gebruik alleen pictogrammen indien deze niets te raden overlaten. Doe dit door bij (zelfgemaakte) pictogrammen ook een tekstlabel in de stijl van de site te plaatsen.
- Zorg ervoor dat er een tekstalternatief beschikbaar is voor multimedia-inhoud. Gebruik liever geen multimediatechnieken voor de primaire navigatie.
Het fijne van deze richtlijnen is dat als je ze consequent toepast, je website gebruiksvriendelijk is voor de bezoekers én goed gevonden wordt door Google. Doen dus!
Bron:
Handboek website usability | Nog tweedehands te koop bij Bol.com | ISBN 90 395 2101 8 | NUR 994 © 2003 Academic Service