Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Role="document" aan een pop-up toevoegen #74

Open
JuliaZjochova opened this issue Sep 10, 2024 · 4 comments
Open

Role="document" aan een pop-up toevoegen #74

JuliaZjochova opened this issue Sep 10, 2024 · 4 comments

Comments

@JuliaZjochova
Copy link

Ik merk vaak dat schermlezers de tekstuele inhoud van een pop-up (met role="dialog") overslaan en alleen de links of knoppen binnen dat scherm voorlezen. Dit probleem kan worden opgelost door role="document" aan de pop-up toe te voegen, zoals hieronder:

<div role="dialog">
  <div role="document"> ...
  </div>
</div>

Is het iets dat we moeten aanbevelen als deze tweede rol ontbreekt? Of moeten we het afkeuren? Zie jij mogelijke obstakels bij het toevoegen van deze extra rol?

@rianrietveld
Copy link
Member

@JuliaZjochova onder welk SC wil je dit voegen?
@hidde deze is voor jou :-)

@JuliaZjochova
Copy link
Author

Het zou 1.3.2 kunnen zijn omdat de leesvolgorde niet klopt. Of 4.1.2 omdat het om de rol gaat.

@rvantonisse
Copy link

rvantonisse commented Sep 10, 2024

Hoi,

Dialog role heeft niet een application super role. Document role is wat het html document is en dus ook de content van een iframe bijvoorbeeld. Als het ux verbeterd mag je het aanbevelen wat mij betreft, maar geen reden tot afkeuren bij ontbreken.

Dialog role is bedoeld als een javascript alert() of confirm() bijvoorbeeld, waarbij de gebruiker onderbroken wordt voor een keuze of melding. De dialog moet een toegankelijke naam hebben en focus hoort op eerstvolgende focusbaar element te komen. Maar kan ik me voorstellen dat dit evt op de dialog wordt plaatst.

Dat de content van de dialog niet wordt voorgelezen kan komen door het ontbreken van de koppeling als toegankelijke naam voor de dialog. aria-label(ledby) is verplicht. Als dat er op staat, kan screenreader wel de context van de knop oplezen.
Ontbreken van dialog toegankelijke naam kan onder 4.1.2 afgekeurd.

Als content voor de dialog netjes genest is in de dialog naast bijhorende knoppen is dit goed onder 1.3.2. Knoppen kunnen eerst of als laatst, maakt niets uit voor de betekenis van de dialog. Je kan de content alsnog bereiken.

Als je met hulpsoftware buiten een modal mode dialog kan komen is dat ook niet de bedoeling. De modal ligt bovenop waardoor onderliggende content in principe uitgeschakeld hoort te zijn. Anders is dat voor een niet modal dialog. Kan evt wel onder focus volgorde / focus zichtbaar.

Voor de volledigheid een link naar de wai-aria dialog; https://www.w3.org/TR/wai-aria/#dialog

Volgens mij is de dialog role en ondertussen ook dialog html element best wel ondersteund, maar daar zou ook iets kunnen ontbreken.

@rvantonisse
Copy link

Ik merk vaak dat schermlezers de tekstuele inhoud van een pop-up (met role="dialog") overslaan en alleen de links of knoppen binnen dat scherm voorlezen. Dit probleem kan worden opgelost door role="document" aan de pop-up toe te voegen, zoals hieronder:

<div role="dialog">
  <div role="document"> ...
  </div>
</div>

Is het iets dat we moeten aanbevelen als deze tweede rol ontbreekt? Of moeten we het afkeuren? Zie jij mogelijke obstakels bij het toevoegen van deze extra rol?

Wat ik me nog bedacht is dat het misschien ligt aan de screenreader modus dat je content niet kunt bereiken? e.g. focus vs read modus ofzo? Ik kan met VoiceOver bijvoorbeeld gewoon in de dialog content komen.

Heb een minimaal WAI-ARIA Dialog role voorbeeld op codepen gezet voor testing: https://codepen.io/rvantonisse/pen/YzomVRB

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants