A few weeks ago, I heard from The Ada Initiative that a conference attendee wasn’t able to use their conference planning site because the main menu wasn’t accessible via screen reader. Did I know of a plugin or technique that would help?
And I did find a solution, thanks to Graham Armfield, who I know from his work on improving the accessibility of WordPress core. But that plugin only worked for Twenty Ten, and it hadn’t been updated since the initial release. Still, it did exactly what we needed for the conference site, and it was an easy matter to update it for Twenty Twelve in time for the conference.
But that really isn’t enough. Fixing a problem for just one site is just a first step — in this case, it felt really important to get something out to a wider audience. So I approached Graham with an offer to collaborate on the plugin going forward, and he agreed.
The first plugin repo release is focused on updating the original code and adding support for more themes. It’s a no-configuration plugin: just install and activate it and you’re good to go. It works just as well for sighted users who navigate by keyboard only as it does for people using screen readers.
- Tested with all default themes from Twenty Ten – Twenty Thirteen.
- Tested with multiple themes based on Underscores.
- Works with child themes, as long as the menu code hasn’t been changed too much. Since it’s the nature of child themes to change the parent, no guarantees on this one!
This is still far from all themes, and we’ll never get all the way there: because WordPress is designed to allow theme authors a lot of flexibility in how menus are built, there will always be a site that builds its navigation in a way we’ll never be able to anticipate. But it’s a big improvement, and I’d love to see it widely used.
You can grab Accessible Dropdown Menus at the Plugin repository. And let me know what themes you’re using it with (or just hoping to use it with) — we’d love to be able to support more themes in future updates!