If you must use a dropdown menu, make sure it’s keyboard friendly
Dropdown menus (a.k.a. flyout or DHTML menus) are fine as long as such menus are implemented in an accessible way, which to a large extent means making them keyboard friendly.
Unfortunately, most dropdown menus which we come across in the wild are not keyboard friendly. A couple of common examples:
* No real links: Sub-level links cannot be revealed without using a mouse, and top-level items are not linked to sub-pages. Not revealing the sub-menus for non-mouse users may be ok if the top-level items are actual links to pages that contain the sub-level links in a normal, visible sub-menu. That way the dropdown menus do not prevent people from navigating the site and can be seen as an enhancement for users who like them.
* Tabbing black hole: Sub-level links are not displayed on focus but exist in the tab order, which makes them technically accessible but also creates a “tabbing black hole” for non-mouse users. Since there is no visual feedback unless you use a mouse they are extremely difficult to use.
Next time you implement a dropdown menu, please make sure to avoid these problems.
