Bug 8712 - We should use WAI-ARIA guidelines to help with accessibility -OMNIBUS bug
Summary: We should use WAI-ARIA guidelines to help with accessibility -OMNIBUS bug
Status: NEW
Alias: None
Product: Koha
Classification: Unclassified
Component: OPAC (show other bugs)
Version: master
Hardware: All All
: P5 - low enhancement (vote)
Assignee: Owen Leonard
QA Contact:
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2012-09-01 08:06 UTC by Chris Cormack
Modified: 2019-04-28 12:16 UTC (History)
7 users (show)

See Also:
Change sponsored?: ---
Patch complexity: String patch
Who signed the patch off:
Text to go in the release notes:
Version(s) released in:


Attachments
Bug 8712 - Added title to the search box (1.46 KB, patch)
2012-10-17 00:37 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
Bug 8712 (4.71 KB, patch)
2012-10-17 03:13 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
[SIGNED-OFF] Bug 8712 - We should use WAI-ARIA guidelines to help with accessibility (1.62 KB, patch)
2012-10-17 19:05 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 8712 (8.46 KB, patch)
2012-10-25 04:21 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
Bug 8712 - Made changes to advances search page to make it more accessibility friendly (8.41 KB, patch)
2012-10-25 23:22 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
bug 8712 - changed "New list" to "Create new list" (1.17 KB, patch)
2012-10-29 00:59 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
bug 8712 - changed search results heading from <strong> to <h4> (2.63 KB, patch)
2012-10-29 01:42 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
[DOES NOT APPLY] bug 8712 - added labels to the "Search history" and "x" links in the top frame (2.53 KB, patch)
2012-10-29 02:24 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
[DOES NOT APPLY] bug 8712 - added alternative text to cover images shown in the search results (2.17 KB, patch)
2012-10-29 03:31 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
[DOES NOT APPLY] bug 8712 - changed search results heading from <strong> to <h4> (2.63 KB, patch)
2012-10-29 03:58 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
bug 8712 - adding 'and' label for options in advanced search with fewer options (2.01 KB, patch)
2012-10-29 22:52 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
[DOES NOT APPLY] bug 8712 - pre-selected options for search-field options in advanced search (2.49 KB, patch)
2012-10-30 03:13 UTC, Srikanth Dhondi
Details | Diff | Splinter Review
[SIGNED-OFF] Bug 8712 - We should use WAI-ARIA guidelines to help with accessibility (1.64 KB, patch)
2012-12-27 20:48 UTC, Katrin Fischer
Details | Diff | Splinter Review
[SIGNED_OFF] bug 8712 - changed "New list" to "Create new list" (1.34 KB, patch)
2013-06-08 12:42 UTC, Marcel de Rooy
Details | Diff | Splinter Review
[SIGNED_OFF] bug 8712 - adding 'and' label for options in advanced search with fewer options (2.23 KB, patch)
2013-06-08 13:03 UTC, Marcel de Rooy
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Chris Cormack 2012-09-01 08:06:10 UTC
http://www.w3.org/TR/wai-aria-practices/
Comment 1 Srikanth Dhondi 2012-10-17 00:37:06 UTC Comment hidden (obsolete)
Comment 2 Srikanth Dhondi 2012-10-17 03:13:56 UTC Comment hidden (obsolete)
Comment 3 Owen Leonard 2012-10-17 19:05:49 UTC Comment hidden (obsolete)
Comment 4 Owen Leonard 2012-10-17 19:13:12 UTC
I would like to know what guidelines are being followed with regard to the changes in attachment 12871 [details] [review]. Is there a particular reference guide we're following?

I'm thinking that as each new kind of template change is submitted, a page in the wiki could also be updated adding the new coding guideline?
Comment 5 Srikanth Dhondi 2012-10-22 22:47:33 UTC
I have addeded an accessibility page in the development section of koha-wiki, which essentially summarises WAI guidelines. 

Coming to guidelines that are being followed specifically in relation to attachement 12871, point-wise:

--> 1) Added labels to Search history and x links in the top frame

According G131 of WAI guidelines: The objective of this technique is to ensure that the label for any interactive component within Web content makes the component's purpose clear.

--> 2) Changed search results message from <strong> to <h3>

As per our accessibility expert at Catalyst IT, it is advised to use headings instead of strong/bold tags, where possible, as screen readers can pick up headings. 

--> 3) Added the 'alt="cover image"' message to those entries that have cover images

WAI recommends providing altenative text description of images.
Comment 6 Owen Leonard 2012-10-23 13:55:50 UTC
(In reply to comment #5)
> I have addeded an accessibility page in the development section of
> koha-wiki, which essentially summarises WAI guidelines. 

Thank you!

> --> 3) Added the 'alt="cover image"' message to those entries that have
> cover images
> 
> WAI recommends providing alternative text description of images.

I disagree with this change. Alternative text should be used when an image is being used to convey information which would be lost if the image cannot be seen. Book cover images convey information, but that information cannot be conveyed in alt text--and we already display the book information as text.

I don't think the alt attribute should ever be used to say something generic like "image." What use is it to the blind user (for example) to know that there is an image there? Better to use alt="" in cases where the image adds no useful information.
Comment 7 Chris Cormack 2012-10-23 19:41:04 UTC
(In reply to comment #6)
> (In reply to comment #5)
> > I have addeded an accessibility page in the development section of
> > koha-wiki, which essentially summarises WAI guidelines. 
> 
> Thank you!
> 
> > --> 3) Added the 'alt="cover image"' message to those entries that have
> > cover images
> > 
> > WAI recommends providing alternative text description of images.
> 
> I disagree with this change. Alternative text should be used when an image
> is being used to convey information which would be lost if the image cannot
> be seen. Book cover images convey information, but that information cannot
> be conveyed in alt text--and we already display the book information as text.
> 
> I don't think the alt attribute should ever be used to say something generic
> like "image." What use is it to the blind user (for example) to know that
> there is an image there? Better to use alt="" in cases where the image adds
> no useful information.

Not sure that is more useful than letting them know it is a cover image. Now they have no idea if that image was useful or not, just blank. At least if it says cover image, they know what it is.

If you ever get the chance to see a user using a screen reader Owen, it is fascinating, one of the things they do is essentially read the page .. to learn a site. Having it tell them these are cover images lets them safely ignore them.

Thats my 2 cents anyway.
Comment 8 Owen Leonard 2012-10-23 19:45:49 UTC
(In reply to comment #7)
> Having it tell them these are cover images lets them safely
> ignore them.

But doesn't 'alt=""' tell the screen reader to ignore the image altogether, meaning the user doesn't have to take the time to skip over it?
Comment 9 Chris Cormack 2012-10-23 19:49:34 UTC
(In reply to comment #8)
> (In reply to comment #7)
> > Having it tell them these are cover images lets them safely
> > ignore them.
> 
> But doesn't 'alt=""' tell the screen reader to ignore the image altogether,
> meaning the user doesn't have to take the time to skip over it?

Maybe, but then they don't get an impression of what is on the page. IE Julius at least, liked to get a feel for what the page is like.
Comment 10 Srikanth Dhondi 2012-10-23 23:14:54 UTC
Some screen readers seem to give the structure of the page. For example, Julius could make out that when you search for a keyword the results are displayed in a table format containing 4 columns - check box, item index, item details and something that he couldn't interpret. 

I tried using alt="" and orca reads it as "opac details link image", which is what you get even when you don't have alt atribute at all. I support using alt="Cover Image" as it gives blind users an idea of what is on page rather than thinking that they are missing out on some information.
Comment 11 Srikanth Dhondi 2012-10-25 04:21:37 UTC Comment hidden (obsolete)
Comment 12 Srikanth Dhondi 2012-10-25 23:22:01 UTC Comment hidden (obsolete)
Comment 13 Owen Leonard 2012-10-26 13:37:42 UTC
I don't understand the changes to the default search types when "more options" is selected. Why make the default additional choices "title" and "author?" And if we're pre-selecting new options, why not add a "selected" attribute to the option instead of rearranging the choices?
Comment 14 Katrin Fischer 2012-10-26 13:49:13 UTC
Changing the default indexes is also a bad idea because of a bug in Koha.
There is a good reason why they should remain keyword from top to bottom. 
Say you have 3 fields and those are preselected:

Author  _____
Title   _____
Keyword _____

Now you go and enter your search terms into Title leaving the first search option for Author empty - Koha will search for your search terms in Author. 

That's one more reason we really need the search rewrite.
Comment 15 Owen Leonard 2012-10-26 14:06:35 UTC
Is adding "and" to the default advanced search page important because having the label improves accessibility or because it emphasizes the boolean "AND" search aspect?

If adding a label to the default search is important for accessibility, is it also an accessibility problem that there are two fields and only one label?
Comment 16 Srikanth Dhondi 2012-10-29 00:59:15 UTC Comment hidden (obsolete)
Comment 17 Srikanth Dhondi 2012-10-29 01:11:32 UTC
I am trying to redo the changes in made in patch 13065 by breaking them into smaller independent tasks. I will try to address all the comments/questions based on this patch in the subsequent attachements to follow.
Comment 18 Srikanth Dhondi 2012-10-29 01:42:06 UTC Comment hidden (obsolete)
Comment 19 Srikanth Dhondi 2012-10-29 02:24:12 UTC
Created attachment 13091 [details] [review]
[DOES NOT APPLY] bug 8712 - added labels to the "Search history" and "x" links in the top frame

1) Added labels to the above links to improve the accesibility.

   G131 of WAI guidelines: The objective of this technique is to ensure that the label
   for any interactive component within Web content makes the component's purpose clear.

2) Added a new class "off-left" to "opac.css" file to hide these labels from appearing on
   the page.
Comment 20 Srikanth Dhondi 2012-10-29 03:31:29 UTC
Created attachment 13092 [details] [review]
[DOES NOT APPLY] bug 8712 - added alternative text to cover images shown in the search results

This text informs screen reader users that the link is a cover image. At the moment, orca reads this link as "opac detail link image", which is confusing.

Moreover, the images in individual records already contain 'alt="Cover Image"' attribute, the present addition will only make it more consistent.

Also, according to WAI, "Images should include equivalent alternative text in the markup/code"[1].

References:

1) http://www.w3.org/standards/webdesign/accessibility
Comment 21 Srikanth Dhondi 2012-10-29 03:58:56 UTC
Created attachment 13093 [details] [review]
[DOES NOT APPLY] bug 8712 - changed search results heading from <strong> to <h4>

1) Screen reader users can navigate a webpage using headers, this change enables
   that feature.
2) Added a new class "header-inline" to opac.css and used it with the above <h4>
   tag to prevent the line change between the header and subscribe feed image that follows it.
Comment 22 Srikanth Dhondi 2012-10-29 03:59:37 UTC
Comment on attachment 13090 [details] [review]
bug 8712 - changed search results heading from <strong> to <h4>

>From a89f10f6952b81ed3852fce1eb3394eb5e4eb573 Mon Sep 17 00:00:00 2001
>From: Srikanth Dhondi <srikanth@catalyst.net.nz>
>Date: Mon, 29 Oct 2012 14:25:43 +1300
>Subject: [PATCH] bug 8712 - changed search results heading from <strong> to
> <h4>
>
>1) Screen reader users can navigate a webpage using headers, this change enables
>   that feature.
>2) Added a new class "header-inline" to opac.css and used it with the above <h4>
>   tag to prevent the line change between the header and subscribe feed image that follows it.
>---
> koha-tmpl/opac-tmpl/prog/en/css/opac.css          |    3 +++
> koha-tmpl/opac-tmpl/prog/en/includes/masthead.inc |    4 ++--
> 2 files changed, 5 insertions(+), 2 deletions(-)
>
>diff --git a/koha-tmpl/opac-tmpl/prog/en/css/opac.css b/koha-tmpl/opac-tmpl/prog/en/css/opac.css
>index 7ab95e0..647104e 100644
>--- a/koha-tmpl/opac-tmpl/prog/en/css/opac.css
>+++ b/koha-tmpl/opac-tmpl/prog/en/css/opac.css
>@@ -2820,3 +2820,6 @@ body#opac-main #opacmainuserblockmobile {
> .tagweight9 {
>     font-size: 30px;
> }
>+.header-inline {
>+    display: inline;
>+}
>diff --git a/koha-tmpl/opac-tmpl/prog/en/includes/masthead.inc b/koha-tmpl/opac-tmpl/prog/en/includes/masthead.inc
>index b0793dc..4e40fb7 100644
>--- a/koha-tmpl/opac-tmpl/prog/en/includes/masthead.inc
>+++ b/koha-tmpl/opac-tmpl/prog/en/includes/masthead.inc
>@@ -169,10 +169,10 @@
> </div>
> </div>
> <div id="breadcrumbs" class="yui-g">
>-[% IF ( searchdesc ) %]<p>[% IF ( total ) %]<strong>Your search returned [% total |html %] results.</strong> [% IF ( related ) %] (related searches: [% FOREACH relate IN related %][% relate.related_search %][% END %]). [% END %]
>+[% IF ( searchdesc ) %]<p>[% IF ( total ) %]<h4 class="heading-inline">Your search returned [% total |html %] results.</h4> [% IF ( related ) %] (related searches: [% FOREACH relate IN related %][% relate.related_search %][% END %]). [% END %]
> <a href="[% OPACBaseURL %]/cgi-bin/koha/opac-search.pl?[% query_cgi |html %][% limit_cgi |html %]&amp;count=[% countrss |html %]&amp;sort_by=acqdate_dsc&amp;format=rss2" class="rsssearchlink"><img src="/opac-tmpl/prog/images/feed-icon-16x16.png" alt="Subscribe to this search" title="Subscribe to this search" border="0" class="rsssearchicon"/></a>
> [% ELSE %]
>-<strong>No results found!</strong>
>+<h4>No results found!</h4>
> <p>
>     [% IF ( searchdesc ) %]
>     No results found for that in [% LibraryName %] catalog. <a href="[% OPACBaseURL %]/cgi-bin/koha/opac-search.pl?[% query_cgi |html %][% limit_cgi |html %]&amp;format=rss2" class="rsssearchlink"><img src="/opac-tmpl/prog/images/feed-icon-16x16.png" alt="Subscribe to this search" title="Subscribe to this search" border="0" class="rsssearchicon"/></a>
>-- 
>1.7.9.5
Comment 23 Srikanth Dhondi 2012-10-29 04:11:52 UTC
oops
Comment 24 Srikanth Dhondi 2012-10-29 22:52:09 UTC Comment hidden (obsolete)
Comment 25 Srikanth Dhondi 2012-10-30 03:13:30 UTC
Created attachment 13107 [details] [review]
[DOES NOT APPLY] bug 8712 - pre-selected options for search-field options in advanced search

This pre-selected implementation of search field options in the advanced search
gives users a better contrast in that it indicates that they can refine search for an
item using three different attributes. In the current advanced search all three search
fields contain "Keyword", which is confusing. For example, our Accessibility Expert
thought that he could search for three different records/items using the three keyword
fields.
Comment 26 Srikanth Dhondi 2012-10-30 03:26:49 UTC
(In reply to comment #14)
> Changing the default indexes is also a bad idea because of a bug in Koha.
> There is a good reason why they should remain keyword from top to bottom. 
> Say you have 3 fields and those are preselected:
> 
> Author  _____
> Title   _____
> Keyword _____
> 
> Now you go and enter your search terms into Title leaving the first search
> option for Author empty - Koha will search for your search terms in Author. 
> 
> That's one more reason we really need the search rewrite.

I agree with Katrin, the attachement #13107 should only be included after the search code has been cleaned up.
Comment 27 Jonathan Druart 2012-12-27 11:38:42 UTC
Applying: bug 8712 - changed "New list" to "Create new list"
bug 8712 - added labels to the "Search history" and "x" links in the top frame
Apply? [yn] y

Applying: bug 8712 - added labels to the "Search history" and "x" links in the top frame
fatal: sha1 information is lacking or useless (koha-tmpl/opac-tmpl/prog/en/css/opac.css).
Repository lacks necessary blobs to fall back on 3-way merge.
Cannot fall back to three-way merge.
Patch failed at 0001 bug 8712 - added labels to the "Search history" and "x" links in the top frame
Comment 28 Katrin Fischer 2012-12-27 20:48:53 UTC Comment hidden (obsolete)
Comment 29 Katrin Fischer 2012-12-27 20:50:09 UTC
First patch passed QA, please switch back to 'Needs Signoff' later.
Comment 30 Jared Camins-Esakov 2012-12-27 23:41:10 UTC
This patch has been pushed to master.
Comment 31 Marcel de Rooy 2013-06-08 12:42:31 UTC Comment hidden (obsolete)
Comment 32 Marcel de Rooy 2013-06-08 12:44:50 UTC
Comment on the New list-patch:
If you click on Create new list, you will again see a 'New list' button.
See /cgi-bin/koha/opac-shelves.pl?display=privateshelves.
Comment 33 Marcel de Rooy 2013-06-08 13:03:34 UTC Comment hidden (obsolete)
Comment 34 Marcel de Rooy 2013-06-08 13:05:56 UTC
Status to Signed off for two patches.
Comment 35 Marcel de Rooy 2013-06-08 13:32:58 UTC
Wondering if this is an enhancement or a bugfix.
The two patches signed off, pass QA too: just simple template changes.
For the five &nbsp; I would recommend a design followup though.
Comment 36 Galen Charlton 2013-08-14 21:42:43 UTC
I've pushed to two QAed patches to master.  Thanks, Srikanth!
Comment 37 Tomás Cohen Arazi 2013-09-11 16:43:45 UTC
The latest patches have been pushed to 3.12.x, will be in 3.12.5.

Thanks Srikanth!
Comment 38 Katrin Fischer 2019-04-28 12:16:26 UTC
Resetting assignee, no change since 2013.