The main navigation system on the DTE website was developed using Adobe’s Accessible Mega Menu (https://adobe-accessibility.github.io/Accessible-Mega-Menu/). This keyboard accessible menu system is modelled after the WAI-ARIA Menu or Menu bar widget design: http://www.w3.org/TR/wai-aria-practices/#menu .

Screenshot showing accessible navigation system

Here is a brief explanation of keyboard functionality for the main menu system:

  • Use the tab and shift-tab keys to access top level menu links.
  • When the menu bar is active, you can navigate top-level links using the left and right arrows keys.
  • Press enter when a top level menu item has focus to open the submenu panel. Press enter twice to access the link for top-level menu items.
  • Use the tab and shift-tab keys to navigate links in the submenu panel. You can also use left and right arrow keys to move between columns in the submenu panel.
  • When a submenu panel is open, you can jump to a link by typing the first character in the link name.
  • Hit the escape key to close a submenu panel, and return to the parent menu link (menu tab).

If you have any problems using the Down to Earth website navigation system with a keyboard, please contact webmaster@downtoearth.org .