UberMenu Control Panel > General Settings > Accessibility
UberMenu provides the following accessibility features, which can be enabled and disabled to your liking in the settings
Keyboard accessibility
Allows users to tab through the menu and highlight focused elements. For more information, see Keyboard Accessibility & the Blue Outline / Glow
Keyboard Submenu Control
Since UberMenu v3.8
Controls how the submenus are activated when tabbing through the menu items with the keyboard.
Enter
Enter/Return – Open the submenu if one exists. If not, follow the link. Once the submenu is open, a second stroke of the Enter/Return key will follow the link.
Tab – Enter the submenu if it is open, otherwise navigate to the next visible item
Escape – Close the submenu if it is open
Spacebar
Spacebar – Open the submenu if one exists
Enter/Return – Follow the link of the highlighted item
Tab – Enter the submenu if it is open, otherwise navigate to the next visible item
Escape – Close the submenu if it is open
Focus
Tab – Focuses the top level item and opens its submenu
Enter/Return – Follows the link
Escape – Close the submenu if it is open.
Skip navigation link
Adds a hidden skip nav link to assist those using screen readers
Collapse mobile menu with Escape key
On mobile, the menu is closed when the escape key is pressed.
tabindex
Top level anchors will be given a tabindex of 0. (Note that there is no setting associated with this attribute, it will be added automatically)
ARIA
Settings for Accessible Rich Internet Applications
role=”navigation”
Adds role
attribute to the nav container (redundant if using HTML 5 nav tag)
aria-label for nav
Adds aria-label="{menu-title}"
to the nav tag. You can set the title of your menu in the Appearance > Menus screen
aria-expanded
Adds the aria-expanded
attribute to activated anchors and their submenus when open.
aria-hidden [submenus]
Adds the aria-hidden
attribute to hidden submenus
ARIA for responsive toggle
Adds role="button"
, aria-controls
, aria-hidden
, and aria-expanded
attributes to responsive toggle.
aria-hidden [icons]
Adds the aria-hidden
attribute to Font Awesome icons. Enable if your icons are purely decorative.