ccswbs / hjckrrh

GNU General Public License v2.0
6 stars 5 forks source link

G15 - Pagination is not idenified for screen reader #123

Closed jszasz closed 9 years ago

jszasz commented 9 years ago

The pagination will say that it is a list of 10 items, then just say the numbers (1, 2, 3..., 9, next) but makes no mention to what they are.

Somehow we need to add more text to say it is 'Page 1' or 'Page 1/10', as there is no identification to the user that these links are page buttons.

Dmelady commented 9 years ago

I believe this might be associated or incorporated into this ticket. If not we can separate. In clicking on the pagination # (say page 2) the URL reflects '/news?page=1'... could be somewhat confusing to the webuser? image

jszasz commented 9 years ago

Also, It doesn't have a heading.

mmafe commented 9 years ago

Hey @Dmelady, I'm going to create a new issue to track the pagination url issue, so we can solve them separately. I'll update this comment to reflect the new issue number.

Edit: Pagination URL issue is now being tracked in https://github.com/brharp/hjckrrh/issues/176

mmafe commented 9 years ago

Hey @jpinsent and @jszasz, could you please functional and accessibility test the new pagination on the dev versions of OAC, UAIC, AODA Demo, and CCS? It should be showing up in every location where there's pagination (i.e. Events, News, Features, etc.)

Let me know if you have any suggestions - so far, I've added a sr-only heading, switched the format over to the spec version (i.e. First, Previous, Page [current #] of [total #], Next, Last), and thrown a nav element/navigation role around the whole thing.

Edit: Also please test in multiple browsers.

jpinsent commented 9 years ago

There appears to now be a landmark associated with the pagination, in addition to a heading 2 above it. The screen reader now picks up the pagination as: "Pagination navigation landmark heading level 2 Pagination"

I'm having an odd issue using the screen reader with the pagination in Chrome. It reads the 'first' button as "firstpage" and 'previous' as "previouspage" with no space in between. The 'next' and 'last' buttons are working fine, and they all seem to be correct when using the screen reader in Firefox...

I also noticed that the arrows accompanying the 'first' and 'last' buttons is picked up by the screen reader and read as, "double-left pointing angle graphic" and "double-right pointing angle graphic". The arrows on the 'previous' and 'next' buttons are picked up, but not read outloud by NVDA. I don't think this is really a problem, but I thought I'd note it anyways.

While this pagination seems more accessible than the last one, I feel like the usability suffers a little bit. If a user had to navigate to page 10 in an archive of 20 pages, it would be tedious for them to click the 'next' button through ten pages instead of just clicking once on the tenth page. I'd suggest having a way to navigate to specific pages like the last one.

jpinsent commented 9 years ago

@mmafe Despite the above comment, this fix has resolved this issue. Please read the above suggestions and feel free to close this issue if they're fine.

mmafe commented 9 years ago
"I'm having an odd issue using the screen reader with the pagination in Chrome. It reads the 'first' button as "firstpage" and 'previous' as "previouspage" with no space in between. The 'next' and 'last' buttons are working fine, and they all seem to be correct when using the screen reader in Firefox..."

[New Issue Created] Issue seems to be occurring in Chrome/JAWS and Chrome/NVDA. Since we're still hearing "previous page" and "first page" (because of the consonants), I'm going to create a new (low priority) issue until we can figure out what's causing it.

I also noticed that the arrows accompanying the 'first' and 'last' buttons is picked up by the screen reader and read as, "double-left pointing angle graphic" and "double-right pointing angle graphic". The arrows on the 'previous' and 'next' buttons are picked up, but not read outloud by NVDA. I don't think this is really a problem, but I thought I'd note it anyways.

[Leave as is] Looks like NVDA does not read the left and right pointing single arrows. I agree on that not really being an issue. http://www.deque.com/blog/dont-screen-readers-read-whats-screen-part-1-punctuation-typographic-symbols/

While this pagination seems more accessible than the last one, I feel like the usability suffers a little bit. If a user had to navigate to page 10 in an archive of 20 pages, it would be tedious for them to click the 'next' button through ten pages instead of just clicking once on the tenth page. I'd suggest having a way to navigate to specific pages like the last one. 

[Leave as is] I think the main drawbacks with the earlier version are:

I also think users are not often looking for a specific page number, particularly since the content on page 10 will be changing over time as more content is added to the listing. Granted, with the new version, if you are trying to get to page 80 out of 100, clicking the "next page" button is going to get pretty tedious, so there is a con in making things simple.

However, in that scenario, I think people would grow tired of searching page-by-page and instead switch to finding the node with a more efficient method (e.g. search by title, browse by date, browse by topic, find by related keyword, etc.)

For now, I think we should stick with the simpler version until we get feedback that suggests people are finding it difficult to use.

mmafe commented 9 years ago

Created new issue #189 to track Chrome firstpage/previouspage issue.