WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Modal dialogs and page titles

for

From: Birkir R. Gunnarsson
Date: Apr 24, 2024 5:48AM

What is announced when you press the title keyboard shortcut in a screen
reader is up to the screen reader vendor. The developer cannot force one or
the other.

All that the developer can do is to make sure that the page and the dialog
have an accessible name (the <title> element for the page,, aria-labelledby
referencing an element with the dialog title or aria-label on the dialog
element.
Obviously the dialog you tested was fully accessible so the differences you
observed come from the screen reader interpretation of title.

Both Jaws and NVDA have GitHub issue pages where you can file an issue if
you feel the screen reader is not reading the most useful info for the
context. The NVDA GitHub in particular is very responsive and often
generates good discussion.
All you need to file an issue is a GitHub account, and then Google NVDA
GitHub and click "issues" and "new issue".

Let us know if you end up filing one, I am curious to see where that
discussion goes.


On Wed, Apr 24, 2024 at 7:38 AM <EMAIL REMOVED> <
<EMAIL REMOVED> > wrote:

> Expected Behavior:
> The ideal behavior is for screen readers to announce the dialog title when
> focus enters the modal. This provides context and helps the user understand
> the purpose of the newly opened content.
> Reasons for Inconsistency:
> * Browser/Screen Reader Differences: How screen readers and browsers
> interact with dialogs can vary, leading to inconsistent reading of titles.
> * Implementation Issues: Even with proper ARIA roles (role="dialog") and
> labeling (aria-labelledby or aria-label), errors in the code can prevent
> screen readers from announcing the title correctly.
> Developer Argument:
> While technically correct that a modal is part of the original page,
> focusing on the page title when a modal is open is unhelpful for screen
> reader users. It disrupts the user's flow and doesn't convey the change in
> context.
> Recommendations:
> * Prioritize Dialog Title: Ensure that the dialog title (aria-labelledby
> or aria-label) is announced when focus enters the modal.
> * Test Thoroughly: Use a combination of screen readers and browsers to
> verify that the titles are read as expected.
> * Educate Developers: Explain to your developer colleagues why reading
> the dialog title is crucial for screen reader users. Reference W3C
> accessibility guidelines for support.
> Resources:
> * ARIA Dialog Role:
> https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/dialog_role
> Let me know if you'd like more clarification!
> * https://github.com/jessarcher/jessarcher.com
>
> Dean Vasile
>
>
> 617-799-1162
>
> > On Apr 24, 2024, at 4:58 AM, Geethavani.Shamanna <
> <EMAIL REMOVED> > wrote:
> >
> > Hi all,
> >
> > I noticed some inconsistent screen reader behaviour when reading the
> titles of modal dialogs. On accessing the Add Delivery Address dialog on
> > https://www.w3.org/WAI/ARIA/apg/patterns/dialog-modal/examples/dialog/
> > On pressing insert-t, Jaws says 'add delivery address Dialog'. NVDA
> however reads the page title 'Modal Dialog Example|APG|WAI|W3C' whilst
> within the dialog.
> >
> > What is the standard behaviour expected here? Since modals are part of
> the original page, the developers I am working with argue that the page
> title should be read out, even when the focus is within the dialog.
> However, as a screen reader user, I would find it useful if the dialog
> title is read out whilst the focus is within the dialog.
> >
> > Insights appreciated.
> >
> > Many thanks.
> > Geetha
> > > > >


--
Work hard. Have fun. Make history.