WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: accessibility of this drop down menu

for

From: Geof Collis
Date: May 6, 2010 8:54AM


Hi Bim

I'm all for low tech if it is inclusive of all disabilities, I mean
how can a drop down menu be called accessible if it excludes certain
disabilities.

cheers

Geof
At 06:11 AM 5/6/2010, you wrote:
>Hi Geof
>The problem with dropdown menus like the one in the example that Angela
>sent is that unless you can use a mouse, you can't reach any of the
>links apart from those at the top level. Unfortunately the solution
>that many web authors have used is a dropdown list that is completely
>keyboard navigable, but impossible to bypass, (the worst I've seen had
>160+ links in the navigation. That's 161 depressions of the tab key
>before you get to the main content, and that's on every page you visit.
>
>
>One solution is to use a menu according to the WAI-ARIA Authoring
>Practices 1.0 patterns, as suggested by claudia, but if your authoring
>skills aren't up to that, the low tech alternative is to ensure that the
>top level links lead to section main pages that contain the subordinate
>links.
>
>Bim
>
>-----Original Message-----
>From: <EMAIL REMOVED>
>[mailto: <EMAIL REMOVED> ] On Behalf Of Geof Collis
>Sent: 06 May 2010 00:39
>To: WebAIM Discussion List
>Subject: Re: [WebAIM] accessibility of this drop down menu
>
>Perhaps someone can help me. I've read that drop down menus present a
>problem to certain disabilities such as shaky hands, if this is true
>then why are so many so keen to use drop down menus?
>
>
>cheers
>
>Geof
>
>At 07:23 PM 5/5/2010, you wrote:
> >Angela,
> >Have you checked the design patterns in the WAI-ARIA Authoring
> >Practices 1.0? I think the Menu widget might be what you are
> >looking for. Here's a link to the Menu widget design pattern:
> >http://www.w3.org/TR/wai-aria-practices/#menu
> >
> >In the Menu widget design pattern, you'll find a description of the
> >pattern, guidelines for keyboard interaction guidelines, guidelines
> >for roles, states and properties, as well as a working code example,
> >if one is available. If you play around with the working code
> >example, you'll get an idea of whether this pattern fits your needs.
> >
> >You might find additional examples in codetalks.org's ARIA Test
> >Cases, which are based on the WAI-ARIA design patterns:
> >http://wiki.codetalks.org/wiki/index.php/Set_of_ARIA_Test_Cases
> >
> >Hope this helps.
> >
> >claudia
> >
> >
> >-----Original Message-----
> >From: Angela French [mailto: <EMAIL REMOVED> ]
> >Sent: Tuesday, May 04, 2010 5:03 PM
> >To: 'UW Web Accessibility Group'; 'WebAIM Discussion List'
> >Subject: [WebAIM] accessibility of this drop down menu
> >
> >Can anyone please tell me if this type of menu is accessible to
> >screen readers and non-mouse users?
> >http://www.sitepoint.com/examples/megadropdowns/completed.html#
> >
> >
> >When I tab through the navigation links, I can't get to the submenus.
> >
> >I am building a similar menu and concerns about it being usable for
> >everyone (even those with Javascript turned off).
> >
> >Thank you,
> >
> >Angela French
> >Internet Specialist
> >State Board for Community and Technical Colleges
> >360-704-4316
> >http://www.checkoutacollege.com<;http://www.checkoutacollege.com/>;
> >
> >
> >