WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: New resource showing accessibility problems of dynamic web components in many tests with users (video)

for

From: glen walker
Date: Nov 1, 2018 3:07AM

I looked at one, modal dialog, since I had a few minutes and it was the
first one on the list. In your resources section, a nice addition would be
Rob Dodson's a11ycast of modal dialogs.

https://www.youtube.com/watch?v=JS68faEUduk

It's a good video for developers because he shows a lot of code and he
explains *how* to implement all the tips in your list.

One thing that Rob mentions that you don't, and it's more of an
implementation detail to make things easier, is to have the dialog
definition be a "sibling" of the main content. Something like:

<body>
<main>
<!-- your stuff -->
</main>
<div>
<!-- dialog stuff -->
</div>
</body>

The sibling tip shouldn't be an additional bullet point to your list but
rather would be mentioned in the paragraph that describes your point as an
implementation detail, similar to how you have a tip that the dialog should
have a name and one way to implement that is with aria-label or
aria-labelledby.

Having the dialog as a sibling of main helps with your 3rd, 6th, and 7th
bullet points.

Glen