Handleiding Digitale Toegankelijkheid in Mosaic

TABLE OF CONTENTS

• Inleiding
• Koppenstructuur
• Toegankelijke linkbeschrijvingen
• Kleurgebruik en contrast
• Vetgedrukte tekst: B vs. strong
• Alternatieve tekst (alt-tekst)
• Embedded- en viewertegels
• Diagrammen en grafieken

Inleiding

Digitale toegankelijkheid betekent gelijke toegang tot informatie en diensten voor iedereen, ongeacht fysieke, zintuiglijke of cognitieve mogelijkheden. Websites, apps, documenten en digitale hulpmiddelen moeten bruikbaar zijn voor álle gebruikers. Ook Mosaic dient volgens deze principes ingericht te worden.

Daarom gelden een aantal belangrijke richtlijnen voor het gebruik van Mosaic. Deze handleiding beschrijft de belangrijkste aandachtspunten.

Koppenstructuur

Koppen helpen om content te structureren in behapbare onderdelen. Ze zorgen voor overzicht, geven een samenvatting van wat volgt en maken navigatie eenvoudiger, ook voor screenreader-gebruikers.

• Gebruik semantische koppen Een kop is geen visuele opmaak maar een technisch anker. De juiste toepassing verbetert zowel de leesbaarheid als de toegankelijkheid.
• Mosaic-functionaliteit Mosaic heeft ingebouwde titelvelden. Gebruik altijd het veld Title in de Settings-tab van een tegel en niet het Content-veld. Het Title-veld zorgt automatisch voor de juiste semantische structuur, zodat screenreaders de kop correct interpreteren.

Toegankelijke linkbeschrijvingen

Links zijn cruciaal voor navigatie. Ze moeten duidelijk beschrijven waar de gebruiker naartoe gaat.

• Beschrijvend schrijven Vermijd generieke linkteksten zoals “Lees meer”. Kies in plaats daarvan bijvoorbeeld: <a href="artikel.html">Lees meer over zonne-energie</a>
• Gebruik van aria-labels Wil je visueel alleen “Lees meer” tonen, voeg dan een aria-label toe, zoals: <a href="artikel.html" aria-label="Lees meer over zonne-energie">Lees meer</a>
• Mosaic-functionaliteit Vul in de Settings-tab altijd het veld Link description in. Ook wanneer de gehele tegel als link fungeert, moet je dit veld samen met het Title-veld gebruiken. Zo weten gebruikers (ook met ondersteunende technologie) wat ze kunnen verwachten.

Kleurgebruik en contrast

Kleur mag nooit het enige middel zijn om informatie over te brengen.

• Wat niet mag Alleen kleur gebruiken om categorieën, thema’s of status aan te duiden.
• Wat wél moet Voeg altijd aanvullende signalen toe, zoals labels, iconen of symbolen.
• Contrastverhouding Normale tekst: minimaal 4,5:1 Grote tekst (≥ 18pt of 14pt vet): minimaal 3:1 Controleer dit met tools zoals: Contrast Checker

Vetgedrukte tekst: <b> vs. <strong>

• <b> geeft alleen visuele nadruk. Screenreaders lezen dit zonder extra klemtoon.
• <strong> geeft inhoudelijke nadruk. Screenreaders spreken dit met nadruk uit, waardoor het belang duidelijker wordt.

Gebruik <strong> voor betekenisvolle nadruk (bijv. waarschuwingen), en <b> alleen voor visuele accenten.

Alternatieve tekst (alt-tekst)

Alt-tekst beschrijft afbeeldingen voor mensen die deze niet kunnen zien.

Wanneer wél gebruiken

1. Informatieve afbeeldingen Beschrijf de informatie die de afbeelding toevoegt. <img src="grafiek.png" alt="Stijgende lijn in omzet">
2. Functionele afbeeldingen Beschrijf de functie van de afbeelding. <img src="zoek.png" alt="Zoeken">
3. Tekst in afbeelding Neem alle tekst uit de afbeelding op in de alt-tekst.

Wanneer niet gebruiken

• Decoratieve afbeeldingen: gebruik een lege alt-tekst (alt="").
• Herhalende informatie: laat weg als de informatie al op een toegankelijke manier elders staat.

Embedded- en viewertegels

Embedded of viewertegels tonen externe content (zoals pdf’s, video’s of websites). Deze zijn vaak slecht bruikbaar voor screenreaders.

Behandel ze daarom als een link:

• Vul altijd het veld External Content Name in met een duidelijke beschrijving.
  • Goed: “Bekijk de pdf met jaarverslag 2023”
  • Fout: “Open viewer”

Diagrammen en grafieken

Voor diagrammen en grafieken is binnen Mosaic altijd een alternatieve tabelweergave beschikbaar. Daarom is het niet nodig om hiervoor aanvullende kleur- of toegankelijkheidsaanpassingen door te voeren.