Posted by mjpg on September 22, 2009 at 8:23pm
Jump to:
| Project: | Nice Menus |
| Version: | 6.x-2.x-dev |
| Component: | Miscellaneous |
| Category: | feature request |
| Priority: | normal |
| Assigned: | Unassigned |
| Status: | active |
| Issue tags: | accessibility |
Issue Summary
To improve accessibility of Nice Menus, I'd like to add 'skip links' to each top level menu so that people tabbing through with the keyboard don't have the visit every link.
I'm asking either for some hints as to where to start and how to approach this, or if it might qualify as a future feature.
How this would work (extra class, title etc removed) - this is not complete code:
<ul>
<li id="menu-1"><a href="/node/1">About us</a>
<ul>
<li class="skip"><a href="#menu-5">Skip to Services</a></li>
<li id="menu-2"><a href="/node/2">Our organisation</a></li>
<li id="menu-3"><a href="/node/3">How to find us</a></li>
<li id="menu-4"><a href="/node/4">Newsletters</a></li>
</ul>
</li>
<li id="menu-5"><a href="/node/5">Services</a>
<ul>
<li class="skip"><a href="#menu-9">Skip to Contact us</a></li>
<li id="menu-6"><a href="/node/6">Plumbing</a></li>
<li id="menu-7"><a href="/node/7">Building</a></li>
<li id="menu-8"><a href="/node/8">Roofing</a></li>
</ul>
</li>
<li id="menu-9"><a href="/node/5">Contact us</a></li>
</ul>In practice, CSS could hide the skip links until they get focus. You may also choose to mark-up the main, top-level, links into headings - again for accessibility.
Thanks in advance for any help.
Comments
#1
I do like the idea behind this. Very complicated navigation is being organized within nice menus & it would be good to have a way to skip between major sections in the navigation more easily.
There is probably some code from D7 that can be re-used for this type of skip-links functionality.
#2
Adding an accessibility tag.
#3
Features go in dev. If someone can supply a patch, I'd love to add this.
#4
Ok, so to do this we'd probably need to alter theme_nice_menus_build(), and alter way the foreach is constructed somehow to prepend the link of the next menu before the list of menu items is added to the string. Yikes, that could be messy!
I don't have time to pursue this at the moment, but will certainly think about coming back to it when I can.
#5
I'm all for a skip links, and would be happy to do it.
Isn't this as easy as adding a "skip links" link, and an anchor tag after the links?
Please throw things at me if I'm under thinking this.
#6
It's probably more complicated than that. You'd want to say something like "Skip to Services" in the example in the primary issue.
it's not a matter of skipping all links necessarily, but skipping through the the major headings to allow a keyboard only user to avoid tabbing through all of the unnecessary links in the navigation.
Does that clarify anything? Please write up a patch though and I'd be happy to look through it.
#7
If we're skipping to a specific part of the page, I don't think that's within scope for this or any module, but something that can be better controlled by a theme, no?
#8
this is all within code that's generated exclusively by nice menus. I do think the html in the initial post does describe this fairly well. If not ask me where there is uncertainty, but please use that example or provide another one with sample html.
#9
Sorry, You're talking skip links within the menu. I think I get it now.
#10
Yup. There's a little article on how to set it up here http://drupal.org/node/394094#keyboard-only