There currently is very little context for secondary tabs in rubik for non-visual users. Tabbing through the links in a screen reader results in secondary tabs being skipped unless the cursor is also over the secondary tabs list. This is an accessibility problem because not all non-visual users have their pointers configured to hover over the actively focused element.

We can improve both the menu's behavior and add context to improve usability for non-visual users.

CommentFileSizeAuthor
#6 Better-accessibility-secondary-tabs-1545882-6.patch1.1 KBkyletaylored
#4 Better-accessibility-for-menu_local_tasks-secondary-1545882-4.patch3.08 KBkyletaylored
#1 better_usability_for_nonvisual_users-1545882-1.patch2.68 KBrypit

Comments

rypit’s picture

rypit commented
StatusFileSize
new better_usability_for_nonvisual_users-1545882-1.patch2.68 KB

Attached is a patch that adds the following functionality / context to local task sub-menus:

  • Adds additional context to (active tab) - if the active tab has children tabs, the contextual information displayed is (active tab with secondary tabs)
  • Adds a title attribute of "@title (secondary tabs)" for an active tab's sub-menu
  • Adds Javascript to expand the full secondary tabs menu when it gains focus from a screen reader
  • Modifies CSS for the submenu so that the correct number of sub-links are reported by a screen reader - this is done through positioning and overflow as opposed to display:none

Please review, thanks!

rypit’s picture

rypit commented
Status: Active » Needs review
haydeniv’s picture

haydeniv commented
Status: Needs review » Needs work

This looks much improved. This patch does not apply against latest dev. Please re-roll and I'll get this right in.

Thanks.

kyletaylored’s picture

kyletaylored commented
Issue summary: View changes
Status: Needs work » Needs review
StatusFileSize
new Better-accessibility-for-menu_local_tasks-secondary-1545882-4.patch3.08 KB

Rerolled.

haydeniv’s picture

haydeniv commented
Status: Needs review » Needs work

This looks pretty good. One quick fix needed.

+++ b/js/rubik.js
@@ -46,5 +46,10 @@ $(document).ready(function() {
+  $('.secondary-tabs li a, .secondary-tabs', context).bind('focus blur', function(){

This is generating a:
ReferenceError: context is not defined

...('.secondary-tabs li a, .secondary-tabs', context).bind('focus blur', function()

javascript error.

kyletaylored’s picture

kyletaylored commented
Status: Needs work » Needs review
StatusFileSize
new Better-accessibility-secondary-tabs-1545882-6.patch1.1 KB

You know, that document.ready() doesn't need to be in there, tis causing issues. Re-rolled!

haydeniv’s picture

haydeniv commented

Much better. Thanks.

Committed: 399df68

haydeniv’s picture

haydeniv commented
Status: Needs review » Fixed

Status . . .

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.