Drop Down Menus and Accessibility for Visually Impaired

Making sure a website has search engine friendly navigation is a top priority for savvy web developers and optimizers. Developers usually consider three things when creating a drop-down navigation menu: Does it look good? Does it work correctly? And is it SEO friendly (can search engine spiders crawl the links)?  Well, here is a fourth thing to consider before deciding to implement a particular menu solution: Web Accessibility –  Is it accessible to the visually impaired?

There are a lot of SEO friendly menu solutions out there, from basic CSS based menus that show the sub-menu links when the user mouses over a vital link, to fancy JavaScript driven menu solutions that demonstrate the sub-menu links by doing all kinds of animation effects such as sliding, fading, and re-sizing. Most menus are excellent for SEO as long as the CSS/JavaScript acts on regular HTML links that the search engines can crawl. However, very few menus are created with visually impaired users in mind, so it is essential to research and choose a menu solution carefully.

To ensure that a menu is accessible to the visually impaired, you want to avoid using “display: none” or “visibility: hidden“ to initially hide sub-menu links. Whatever is contained in elements that have either of these two CSS properties applied to them will be ignored by screen reading software with the logic being that if visual users don’t get to see those links, why should they be read to non-visual users? The flaw there is that visual users have a way of accessing those links by hovering over the menu, and visually impaired users don’t. The solution is to use a menu (PS: Hint Hint – SEO Inc can implement this!) that initially positions the sub-menu items off the page, and then back on the page when the menu is activated. That way, screen reading software won’t get tripped up and will read all the links in the menu to visually impaired users.

0/5 (0 Reviews)

Ready to Collaborate? Contact Us!

Recent Works

Boats.com SEO Case Study
BTO Sports Case Study
Entrepreneur.com Case Study
IGN.com Case Study
Tacori Social Engagement
Oxi Fresh SEO Case Study
Vegas.com SEO Case Study
TIBCO case study
Teleflora Web Development


Get the Latest SEO News & Updates