Status: New
Owner: ----
Labels: Type-Defect Priority-Medium

New issue 3912 by marco.z...@gmail.com: Make side-by-side diffs more screen-reader friendly for blind users
https://code.google.com/p/reviewboard/issues/detail?id=3912

*** READ THIS BEFORE POSTING!
***
*** You must complete this form in its entirety, or your bug report will be
*** rejected.
***
*** If you have a security issue to report, please send it confidentially
to
*** secur...@reviewboard.org. Posting security-related issues to this bug
*** tracker causes us to have to do an emergency release.
***
*** For customer support, please post to reviewbo...@googlegroups.com
***
*** If you have a patch, please submit it to
http://reviews.reviewboard.org/
***
*** This bug tracker is public. Please check that any logs or other
information
*** that you include has been stripped of confidential information.


What version are you running? 2.0.17


What's the URL of the page containing the problem? https://reviewboard.mozilla.org/r/12135/diff/2#index_header


What steps will reproduce the problem?
1. Run the above URL with Firefox and the screen reader for the blind NVDA from http://www.nvda-project.org. 2. After page loads, press Control to silence speech, then press t 3 times to go to the third table on the page, which contains the first file. 3. Press Control+Alt+Left, Right, Up or DownArrows to traverse the table cell by cell and listen to the output.

What is the expected output? What do you see instead? I would love to hear some more descriptive information about the diffs. Is the line changed? Is it an added line, or a removed one? And the file name should not repeat over and over and over.


What operating system are you using? What browser? Windows 7, 8/8.1, or 10, Firefox 39 release.


Please provide any additional information below.
From the original bug I filed against Mozilla's instance of Code Review at https://bugzilla.mozilla.org/show_bug.cgi?id=1180600, with some additional info:

The side-by-side diff isn't bad at all per se, but it could use some improvements to be more friendly to screen readers. Here are some of the proposed changes:

1. Make the file name, which is now a th in the first row of the table, a caption element instead. Each diffed file in a commit or set of commits gets its own table, so it makes semantically more sense to make this the caption of the table rather than an arbitrary header cell that gets repeated by screen readers over and over. It is also semantically more correct.

2. Add text to the line number header cells that is only visible to screen readers (e. g. collapsed via CSS rules) that annotates what the change is. Is it a changed line, a newly added, or a removed one? Right now, these things are, as far as i can tell, only communicated via color. Making this information part of the header cells that contain the line numbers will make this information immediately accessible to screen reader users. Information on how text can be made accessible to screen reaers, but visually hidden, can be found here: http://unobfuscated.blogspot.de/2015/01/updated-offscreen-techniques.html

3. Make the diffs more keyboard friendly by making them keyboard actionable, so one doesn't have to use the mouse to add a comment. Github has something similar, which works really well. This would entail binding the click (or double click?) handler to a keypress on either the line or line number cell, so it becomes actionable. Probably not tabable, because that would make it cumbersome for keyboard users, but enabling screen readers to execute on the line number by making it focusable via tabindex="-1" would help.

I am Mozilla's senior accessibility QA engineer and evangelist and am experienced in mentoring these kinds of changes. I'd be willing to help along the process of making this more screen reader friendly.

--
You received this message because this project is configured to send all issue notifications to this address.
You may adjust your notification preferences at:
https://code.google.com/hosting/settings

--
You received this message because you are subscribed to the Google Groups 
"reviewboard-issues" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to reviewboard-issues+unsubscr...@googlegroups.com.
To post to this group, send email to reviewboard-issues@googlegroups.com.
Visit this group at http://groups.google.com/group/reviewboard-issues.
For more options, visit https://groups.google.com/d/optout.

Reply via email to