Meta Stack Exchange is where users like you discuss bugs, features, and support issues that affect the software powering all 158 Stack Exchange communities.

What is meta?
Here's how it works:
  1. Any Stack Exchange user can ask a question
  2. The community provides support, votes on ideas, and reports bugs
  3. Your voice helps shape the way Stack Exchange operates

According to this comment voting isn't accessible. It would be nice if both comment voting and flagging were made accessible to screen reader users since they both have the same issue of needing to be moused over.

share|improve this question

Agree, using <span> for action elements was not our smartest move in retrospect, and we switched back to the more traditional <a>.

Specifically, we changed from:

<span class="vote-up-off" title="...">up vote</span> 
<span class="vote-count-post">12</span> 
<span class="vote-down-off" title="...">down vote</span> 


<a class="vote-up-off" title="...">up vote</a>
<span class="vote-count-post">12</span>
<a class="vote-down-off" title="...">down vote</a>
share|improve this answer

One thing to remember about screen reader accessibility: screen readers generally use speech output or to some extent, braille. In both cases, the output is essentially one-dimensional - i.e. there is no width and height, everything is one long ribbon of stuff. Good semantic HTML is thus very important here because the screen reader provides various ways of navigating html documents which drammatically speeds things up for their users and increases comprehension and cognative load. As things stand currently, a screen reader user can easily jump to the "N answers" heading, but then must move through the answers and comments basically one line at a time. Imagine, as a sighted person, if you had to read a StackOverflow page on a one-line display. How crazy would that make you after about ten minutes?

In this thread for instance, we have one answer and several comments. Actually, the page claims there are two answers here (soon to be one more after I post this), but it is very difficult for me to know where the boundary between answers and comments lies, and the boundary between comments. It seems as though a username introduces a comment, so wrap this in a heading tag with proper heading level.

It appears that answers start with something like: up vote 6 down vote Where up vote and "down vote" are links. This is fine, although might be more helpful to begin each answer with "answered by blahblah - "up vote" N "down vote". In any case, wrap this introductory stuff, whatever it may be, in a heading as well.

Doing this would drastically speed up browsing for those of us who depend on screen readers.

share|improve this answer

One way this issue could be addressed is by giving each of these items (the up vote element, down vote element, ETC.) an aria role of "link". That should at least fix it for screen reader users whose AT supports ARIA, which most recent ones do. Giving the elements a tabindex of 0 and making it visually obvious when they have focus should also solve it for keyboard only users.

Update: I through together a quick bookmarklet which seems to fix the problem:

javascript:(function() { $('a, .vote-up-off, .vote-down-off, .star-off')
    .attr({role:'link',tabindex:'0'}); })()
share|improve this answer
The bookmark helped, thanks. Maybe a group of so users should do a section 508 VPAT on the site? It'd be one way of helping the community understand accessibility with examples they could follow along with. – Jared Sep 28 '10 at 13:48
This would be a huge job; the sight is very complex and huge in extent. Would anybody be able to pay someone to do it? – Rich Caloggero Aug 14 '13 at 17:42

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .