WCAG-Audit-Discussions
1.4.11: Geldt kleurcontrast 3:1 voor invoervelden als er een placeholder gebruikt wordt?
Een invoerveld met de volgende eigenschappen:
- Een lichtgrijze border die een contrast heeft dat lager is dan 3:1
- Een placeholder-tekst: "Zoeken ..." die voldoet aan de minimale contrasteis voor tekst: ≥4,5:1
Discussiepunt: Interpretatie 1.4.11, Non-text Contrast (Level AA)
https://www.w3.org/WAI/WCAG21/Understanding/non-text-contrast.html Onder het kopje 'Bounderies' staat dat een 'control' niet verplicht een 'visual boundary' dient te hebben, tenzij die 'boundary' de ENIGE indicator is die aangeeft dat er een 'control' aanwezig is. Dan moet die 'boundary' voldoen aan de minimale contrastverplichting van 3:1.
MAAR; er staat verder: "If (...) placeholder text inside a text input is visible and there is no visual indication of the hit area then the Success Criterion is passed."
Mijn interpretatie van het voorbeeld dat ik aan het begin van dit issue gaf:
- De 'boundary' van het zoekveld is lastig te zien (want kleurcontrast minder dan 3:1), ECHTER:
- De placeholdertekst "Zoeken..." is leesbaar, want contrast ≥ 4,5:1
- De 'boundary' is daarmee niet de enige indicator die zegt: hier is een control aanwezig,
- Dus: PASS 1.4.11
Strikt genomen klopt dit inderdaad. Ik zie nog wel de nodige haken en ogen aan dit uitgangspunt. Er zijn voorbeelden te bedenken waarbij dit echt nog wel lastig kan zijn voor slechtzienden of cognitief beperkten, maar het blijft een advies om bij voldoende contrast van de tekst ook een eventuele border voldoende contrast te geven. Is dus niet verplicht.
@Aircl0wn @gjccopinga Dank jullie wel voor jullie commentaar.
Dan zou dit mijn conclusie zijn:
Betreft Succescriterium 1.4.11 Non-tekst contrast. Consensus: De 'visual boundary' van een invoerveld hoeft niet te voldoen aan de contrasteis van ≥ 3:1, als er een placeholder-tekst aanwezig is. Voorwaarde: De placeholdertekst moet voldoen aan de contrasteis van ≥ 4,5:1. Advies: Het wordt aangeraden om de 'visual boundary' wel te laten voldoen aan de contrasteis van ≥ 3:1.
Ook ik ben het (helaas) eens met deze interpretatie. En dit is afwijkend van hoe ik het tot nu toe geïnterpreteerd heb. Darn.
Dat zijn genoeg mensen voor een voorlopige consensus zou ik zeggen. Goed scenario Ferjo!
Dag Brian,
Ik volg de discussies hier een beetje. Super initiatief en zeer leerzaam! Jouw bijdragen zijn hierin ook waardevol. 👍
En erg mooi te zien dat je ondanks dat je het tot nu toe anders interpreteerde je dit gewoon aangeeft.
Succes!
Groeten, Paul
Op di 15 mrt. 2022 09:55 schreef Brian Bors @.***>:
Ook ik ben het (helaas) eens met deze interpretatie. En dit is afwijkend van hoe ik het tot nu toe geïnterpreteerd heb. Darn.
Dat zijn genoeg mensen voor een voorlopige consensus zou ik zeggen. Goed scenario Ferjo!
— Reply to this email directly, view it on GitHub https://github.com/WCAG-Audit-Discussions/NL-BE/issues/32#issuecomment-1067720679, or unsubscribe https://github.com/notifications/unsubscribe-auth/AW3PCZVFGAE2L2VHR6C4O63VABGAZANCNFSM5QI6GDTQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.
You are receiving this because you are subscribed to this thread.Message ID: @.***>
Bedankt Paul,
Ik denk dat je dit probeerde te sturen in een persoonlijk berichtje? In ieder geval gaat in het geval van deze discussie de credits volledig naar andere mensen en heb ik puur en alleen wat tags toegevoegd. :)
Wat een vervelend punt is dit zeg. Ik ben erg benieuwd hoe dit er zo in is gekomen. Bij de invoer van een datumveld klinkt het logisch om dit als placeholder te gebruiken:
- DD-MM-JJJJ Bij de volgende placeholder denk ik dat bij laag contrast van de rand de bezoeker zich het schompes zoekt naar waar er getypt moet worden:
- Typ hier je onzin En helaas komt het type als de 2e placeholder vaker voor dan het eerste voorbeeld.
PS. Ik adviseer altijd om geen placeholder te gebruiken!
