cristinafsanz
10/2/2019 - 8:31 AM

Accessibility for Hamburger Menu

  • https://medium.com/@linlinghao/accessibility-for-hamburger-menu-a37fa9617a89

    <a="#menu" id="menu-toggle" class="menu-toggle" aria-label="Open the menu">
      <i class="fa fa-bars" aria-hidden="true"></i>
    </a>
    
    • aria-label is a text label that is not visible on the screen, but will still let screen reader know that this link here is for opening/triggering the menu
    • aria-hidden=”true” is for hiding the hamburger icon for screen reader, so the browser will skip this icon