Ensure tab order in each media context/screen size facilitates accessibility: 3

[paregorios]

When in desktop CSS layout:

• “Skip to Main” link
• NYU Institute for the Study of the Ancient World home logo link
• Top Bar Menu
• Main Menu
• Breadcrumbs
• Main Content Area
  • Tab only to focusable elements.
• Sidebar
  • Should focus top to bottom including the expand/collapse buttons.
• Footer links

When in mobile CSS layout:

Tab order for the mobile will be slightly different since the hamburger menu > is active.

• NYU Institute for the Study of the Ancient World home Link
• Hamburger Menu
• Menu Items
  • Should focus from top to bottom
  • Includes search bar
• Close button
• Main Content Area
  • Tab only to focusable elements.
• Footer links

Traceability: Microassist Report 1 > Tab Order > Desktop

Traceability: Microassist Report 1 > Tab Order > Mobile

[paregorios]

Regarding mobile view see also #234 (comment)

[paregorios]

WCAG says:

"focusable components receive focus in an order that preserves meaning and operability."

So, I think our current behavior of tabbing through main nav (colorful) before we tab through secondary nav (top gray bar) is good.

See further: https://www.w3.org/WAI/GL/WCAG20-TECHS/H4.html

[alecpm]

I think this is working well at this point, though we need better focus indications on the logo, search button, breadcrumbs, and navigation portlet among other things.

[paregorios]

OK. Merge and deploy to production. I'll create new ticket(s) for the remaining focus indication contexts.

[paregorios]

@alecpm @skleinfeldt can you verify that this has been merged to master and deployed to production? Thanks

[paregorios]

Sorry I got confused. Disregard previous comment.