WebAIM - Web Accessibility In Mind

E-mail List Archives

Question about CSS Hover Dropdown menus

for

From: indamockwood-l@verizon.net
Date: Feb 21, 2007 2:10PM

Hi all,

I'm trying put together a list of "accessibility consequences" for certain types of web design styles (such as, if you do X,Y, or Z, then people who have X,Y, or Z disability will not be able to easily use your site), and trying to think not only in terms of screenreaders. I'll probably come up with a bunch of questions as I go along, but right now I have a question about CSS Hover drop-down menus (such as on espn.com).

If you have a pure CSS hover menu, is there any way to make it function just by using keystrokes? So, for example, I'm tabbing through the scroll down menu options on ESPN.com, and I want to see what options are under NBA. If I tab to it, and click "enter", instead of seeing what's underneath, I'm taken to the main NBA page. Do people who use only keystrokes to navigate have to live with this, or is there a keystroke I'm missing (I know what the issues may be if it were a Javascript mouseover)

Also I've played with some screenreaders (I don't have access to JAWS, though), and see that if you have CSS drop down menus using lists, that the screenreader will read the hidden hover menus. However, it looks to me like they will read all of them. Are there ways to put mini-skip-links in a drop down menu like that so you can go from one top-tier option to the next?

Thanks.

MJ