3.2 Duidelijke navigatiestructuur

Kwaliteitscriterium 3.2: Het digitale leermateriaal heeft een duidelijke en gebruiksvrien-
delijke navigatiestructuur

Mensen houden van duidelijkheid. Zorg daarom ook voor een duidelijke structuur van het digitale leermateriaal. Zo help je de gebruikers te navigeren, content te vinden en te bepalen waar ze zich bevinden op de website.
 

Waar op letten?
De checks 1 t/m 4 zijn basiseisen voor navigatie digitaal materiaal die eenvoudig zijn na te leven.
De checks 5 t/m 8 zijn mogelijk iets moeilijker te realiseren, afhankelijk van de omgeving waarin het digitale materiaal is gemaakt.

 


Vooraf

Materiaal met een duidelijke navigatiestructuur bevordert het leren van elke leerling. Het is van bijzonder belang voor leerlingen met een visuele beperking, maar het helpt dus ook leerlingen zonder beperking.

Om deze reden besteden de WCAG 2.2 webrichtlijnen voor digitale toegankelijkheid veel aandacht aan de navigatiestructuur. (De checkpunten in dit kwaliteitscriterium zijn op deze richtlijnen gebaseerd. De checks 1 t/m 4 zijn het A-niveau, de checks 5 t/m 8 het AA-niveau in de WCAG-richtlijnen.)

Voldoen aan deze richtlijnen is geen doel op zich. Informatie toegankelijk en begrijpelijk maken wel.  Door bewuste keuzes te maken ontstaat direct meerwaarde:


Waar let ik op bij het beoordelen van de ‘navigeerbaarheid’?


Check 1: Zorg dat herhalende onderdelen overgeslagen kunnen worden

Geef gebruikers de mogelijkheid om onderdelen die worden herhaald (zoals een navigatiemenu) over te slaan. Door het aanbieden van skip-links stel je bezoekers in staat overbodige blokken over te slaan en sneller bij de inhoud te komen. Zorg voor minstens twee skip-links; één naar het navigatiemenu en één naar de hoofdinhoud van de webpagina.

In plaats van links kun je ook met code een groepering aanbrengen in onderdelen van de pagina, zodat ze kunnen worden overgeslagen.
 

Check 2: Geef webpagina’s een titel die de inhoud van de pagina beschrijft

Kies voor iedere webpagina een titel die de inhoud ervan duidelijk beschrijft. Zo kunnen gebruikers gemakkelijk informatie vinden. Een duidelijke titel beschrijft het onderwerp, is ook zonder context te begrijpen, is onderscheidend en vooral ook niet te lang.
 

Check 3: Zorg voor een logische volgorde

Geef alle onderdelen van de webpagina een duidelijke focus als een bezoeker met het toetsenbord navigeert. Zorg dat er een logische volgorde is waardoor de betekenis van de  inhoud overeind blijft. Alle onderdelen van de pagina moeten goed bruikbaar blijven.
 

Check 4: Schrijf heldere en begrijpelijke linkteksten

Geef links een tekst die het doel duidelijk beschrijft. Een duidelijke linktekst beschrijft waar naar wordt verwezen en is ook zonder context te begrijpen. (Vermijd dus onduidelijke linkteksten zoals "klik hier".)

Is het niet mogelijk om een duidelijke linktekst mee te geven aan een link? Zorg dan dat het doel van de link in dezelfde zin helder wordt uitgelegd. (Of: maak een uitgebreide linktekst, maar verberg een gedeelte van deze tekst. Alleen bezoekers die gebruikmaken van voorleessoftware horen de hele linktekst.)
 

Check 5: Zorg dat elke pagina op meerdere manieren te bereiken is

Geef jouw gebruikers minimaal twee manieren om webpagina’s te bereiken. Bijvoorbeeld via het navigatiemenu en de zoekfunctie. Zo zorg je ervoor dat alle gebruikers, onafhankelijk van voorkeuren en zoekstrategieën, bij de gewenste pagina uitkomen.

Maak op elke webpagina slim gebruik van interne links en plaats een inhoudsopgave die linkt naar de verschillende secties.
 

Check 6: Gebruik beschrijvende koppen en labels

Maak gebruik van koppen en tussenkoppen in je teksten zodat de inhoud gestructureerd en overzichtelijk blijft. Zorg dat zowel de koppen als de teksten die je gebruikt voor labels duidelijk beschrijven wat het onderwerp of de functie is. Met deze aanknopingspunten kan jouw gebruiker gemakkelijker zien of het de informatie is waar hij naar op zoek is.

Zorg voor een logische structuur van de koppen. Hierdoor kunnen bezoekers pagina’s snel scannen en het helpt zoekmachines de structuur en het onderwerp van de pagina te begrijpen. Begin de pagina met een H1 kop, gevolgd door een H2 kop, die weer gevolgd kan worden door een H3 kop. Sla geen niveaus over.
 

Check 7: Maak zichtbaar welk onderdeel van een pagina focus heeft

Geef gebruikers die met het toetsenbord navigeren duidelijk aan welk onderdeel de focus heeft. Door middel van visuele aanwijzingen (een gekleurde rand, schaduw, verandering in achtergrondkleur of een ander visueel effect) weet de gebuiker welk onderdeel van de webpagina actief is.

Pas dit toe bij tekstlinks, knoppen, afbeeldingen en andere elementen.
 

Check 8: Dek het focusgebied niet af

Als aanvulling op de vorige eis moet het onderdeel dat de focus heeft, altijd minimaal voor een gedeelte zichtbaar zijn. Dat betekent onder andere dat het niet achter zwevende delen mag verdwijnen en dat visueel voldoende duidelijk moet zijn waar de focus zich bevindt.


Handige links
Deze checks zijn gebaseerd op de WCAG-richtlijnen: