Uploaded image for project: 'PUBLIC - Liferay Portal Community Edition'
  1. PUBLIC - Liferay Portal Community Edition
  2. LPS-38428

Apply appropriate ARIA roles to the navigation menu



      In order to text this, you will need a screen reader. Chrome VOX works really well.

      Right now, our navigation menu is not very screen-reader friendly since we don't provide enough ARIA roles and screen readers have a hard time allowing users to use it.

      The issue is that when we try to traverse our website using keyboard, though every things works fine but when the control reaches the Menu, we cannot use TAB key to navigate through the menus. We can traverse through the menus only using the ARROW keys.

      When we run the screen reader tool, it reads each character in the menu rather than the whole word.May be it is behaving so because we are traversing the menu using Arrow keys.Is there a way that we can use TAB key for traversing through the menu in Liferay?

      We have tested on IE,FIREFOX and CHROME browsers.
      Screen Reader Tool : NVDA Tool.

      See different resources for implmenting this:
      Accessible dropdown menus - http://terrillthompson.com/blog/202
      this blog actually has our sames questions and provides different solutions (we should probably go with one of those...)

      Question in stackoverflow - http://stackoverflow.com/questions/12279113/recommended-wai-aria-implementation-for-navigation-bar-menu

      they recommend to follow our keyboard pattern, however, I think they are defining the roles better than we are (I think we are missing several roles in our menus)

      Mega menu accessible in adobe.com - http://blogs.adobe.com/accessibility/2013/05/adobe-com.html
      this is a blog entry from adobe explaining how they made their mega menu accessible.




            yang.gao Yang Gao (Inactive)
            julio.camarero Julio Camarero (Inactive)
            Participants of an Issue:
            Recent user:
            Esther Sanz
            0 Vote for this issue
            5 Start watching this issue


              Days since last comment:
              7 years, 41 weeks, 6 days ago


                Version Package
                6.1.X EE
                6.2.0 CE B2