Omslag van 'Toegankelijke pdf's maken met Microsoft Word'

11. Contrast van tekst en afbeeldingen

Tekst moet voldoende contrast hebben met de achtergrond om goed leesbaar te zijn. WCAG stelt hiervoor als minimum 4,5 voor gewone tekst en 3,0 voor grote tekst. Ook voor afbeeldingen en links gelden contrast-eisen.

11.1 Contrastratio: een eenduidige maat voor contrast

Het contrast tussen 2 kleuren heeft een waarde van 1 tot 21. Deze waarde heet de contrastratio. Wanneer er geen contrast is, is de waarde 1 (officieel is dat 1:1). Bij een maximaal contrast (zwart op wit of wit op zwart) is dat 21 (officieel 21:1).

Contrastratio: 21 = maximaal contrast, 1 = minimaal contrast (wit op wit)

Een handige tool voor het meten van contrast in een pdf is Colour Contrast Analyser. Deze is er voor Windows en de Mac.

11.2 WCAG-eisen voor contrast

Contrast-eis Type tekst
4,5 Gewone tekst
3,0 Grote tekst, minimaal 18 punts
3,0 Vette tekst, minimaal 14 punts
3,0 Hyperlinktekst met omringende tekst
3,0 Afbeeldingen

Alhoewel dus 4,5 voldoende is, adviseren wij om minimaal 5,0 te gebruiken, omdat 4,5 nog steeds weinig contrast geeft.

11.3 Voorbeeld goed contrast link met omringende tekst

De kleur van een hyperlink moet een minimaal contrast met de omringende tekst hebben van 3,0. Dat geeft niet veel ruimte aan de kleur van een hyperlink, want de link moet zelf ook een contrast met de achtergrond van minimaal 4,5 hebben.

In het voorbeeld hieronder zijn de contrastwaarden van de hyperlink goed:

  • Voorgrond-achtergrond: contrastratio donkerblauw op wit: 6,3
  • Link met omringende tekst: contrastratio donkerblauw met zwart: 3,3

11.4 Voorbeeld contrast van afbeeldingen

De eis voor afbeeldingen is een contrastratio van minimaal 3,0 van de afbeelding met de achtergrond.

Denk hierbij bijvoorbeeld aan een knop, of een lichtblauwe Twitter-icoon op een witte achtergrond.

Uitgezonderd van deze eis zijn logo's of inactieve elementen (bijvoorbeeld als een knop 'greyed-out' is.)

Hieronder 2 voorbeelden van een Twitter-icoon. De linker heeft een contrastratio van 2,6 met de witte achtergrond. Dat is dus onvoldoende. Het rechter icoon heeft een contrastratio van 3,5 met de achtergrond, voldoende dus.

11.5 Contrast testen met de Colour Contrast Analyser

Er zijn veel tools om online de contrastratio te meten, maar de meeste zijn bedoeld voor content die op websites staat.

Met de Colour Contrast Analyser van de Paciello Group kun je het contrast in een document meten. Het is een klein programma dat je downloadt op je computer.

Helaas werken veel mensen in een afgesloten werkomgeving waar ze geen programma's mogen installeren. Alternatief is dat je met Acrobat Pro het contrast meet in de pdf.

11.6 Contrast corrigeren

Als de kleur van tekst onvoldoende contrast heeft met de achtergrond kun je deze kleur corrigeren. Doe dat altijd in de stijl, want dan is het gelijk goed in het hele document.

De stappen:

  1. Selecteer de tekst waarvan je de kleur wilt wijzigen.
  2. In het lint zie je welke stijl het is.
  3. Kies bij de stijl in het lint met rechtermuisknop de optie Wijzigen.
  4. Er opent een dialoogvenster
  5. Kies bij Opmaak voor de dropdown met de kleuren.
  6. Kies een van de standaardkleuren die een goed contrast geeft.
  7. Wil je een andere kleur kies Meer kleuren en kies daar de kleur die je wilt.
  8. Kies OK.
top

Wat vind je van dit hoofdstuk?

Feedback

Contact

Vul dit in als je wil dat we contact met je opnemen.