WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Superfish-like drop-down menus?

for

From: Robert Fentress
Date: Jun 15, 2017 3:07PM

FYI: If you are considering using Approach 2 in the Flyout-Menus section
of that WAI menus tutorial
<https://www.w3.org/WAI/tutorials/menus/flyout/#use-button-as-toggle> Jennifer
referenced (which I rather like), you should be aware that it is not
semantically valid, since it includes a button within a link. An issue
<https://github.com/w3c/wai-tutorials/issues/522> has been filed on GitHub
for this, but no response yet.

I'm currently playing around with modifying it myself, in my spare time
(right). Basically, I make the button a sibling of the link and move
aria-haspopup, and aria-expanded to it. Then, I add aria-controls and
(maybe) aria-owns to the button and associate this with the submenu, which
I then have to explicitly provide an id attribute for.

It's tricky though, because JAWS wants to switch you into Application Mode
when you activate the button. That then requires the user to switch back
to the virtual cursor to navigate the menus that appear. I guess I could
then write code to handle the keyboard interaction, but that adds a whole
other layer of complexity and screws up the elegant simplicity of the
original approach. It seems to me improper that JAWS should change modes
like that, since I haven't explicitly set the role to menu or menuitem or
anything that you would think would trigger it. It's basically just
functioning as a disclosure widget, at that point.

Warning: Here comes the rant. Is it just me or does this seem
wrong? ARIA makes my brain bleed. Why is this so hard? Why isn't the
<menu> tag or something like it implemented in the browser, where all that
keyboard stuff is taken care of by the user agent. Site menus are like,
literally, on almost every other page on the web. How can we expect
developers to write accessible code when a consensus hasn't yet been
reached on the best way to handle these things? Or maybe it has and I just
haven't gotten the memo. What am I missing? Ugh.

Sorry. I just had to get that off my chest.

Best,
Rob

On Tue, Jun 6, 2017 at 6:10 PM, Jennifer Sutton < <EMAIL REMOVED> > wrote:

> I would recommend following the guidance in this tutorial on menus, from
> WAI:
>
> http://www.w3.org/WAI/tutorials/menus/
>
>
> If people have issues to report, I'm sure input is welcome.
>
>
> It's my sense that this information is recent and would follow what's
> expected, rather than things that are as old as PVI and Suckerfish.
>
>
> I sometimes find that what we screen reader consumers might think we
> prefer isn't necessarily what spec.(s) say. And if we don't like what
> spec.(s) say, it's our job to work to improve/modify them, or change our
> mindsets as technology enables us to do so.
>
>
> To be clear, I'm not saying thse tutorials are spec.s. But it's my
> understanding that they've been created based on them.
>
>
> Kudos to WAI EO and others involved; I think these tutorials, with
> included code samples, are some of the best work out there.
>
>
> Best,
>
> Jennifer
>
>
>
>
>
> > > > >



--
Rob Fentress
Senior Accessibility Solutions Designer
Assistive Technologies at Virginia Tech
Electronic Business Card (vCard)
<http://search.vt.edu/search/person.vcf?person54847>
LinkedIn Profile
<https://www.linkedin.com/in/rob-fentress-aa0b609?trk=profile-badge>