Menu Accessibility

Enhancing Accessibility in Menu Elements

In Breakdance, significant care has been taken to ensure the built-in menu elements are accessible. This article details the accessibility features for Breakdance’s menus and demonstrates how to implement accessible menus in your Breakdance projects.

Backend Accessibility Improvements

The ‘Accessibility’ option in the Menu Builder allows you to add attributes such as ARIA labels, crucial for labeling navigation elements, especially when you have multiple navigations on the same page.

Accessibility Options in WP Menu Element

Alongside the Menu Builder, the standard WordPress Menu (WP Menu) element in Breakdance has also been updated with accessibility features. It now includes options to add attributes enhancing screen reader compatibility.

Frontend Accessibility Enhancements

To enhance accessibility, Breakdance’s menu elements output dropdown menus using an unordered-list structure, which is ideal for screen reader users.

In addition, here are some other highlights regarding the menu elements’ accessibility:

• Submenus do not automatically open on hover, making keyboard navigation more efficient.
• Submenus can be triggered using the Enter or Space key.
• Once inside a submenu, you can navigate through items and use the Escape key to return to the parent menu.
• Screen readers will announce the expanded or collapsed state of dropdowns and the number of items in the list.