The <select> element used to sort search results on the OPAC search results page (opac-search.pl) isn't labelled. This makes it harder for users of screen readers and other assistive technologies to identify the purpose of the sort function. <select id="sort_by" class="resort form-control form-control-sm" name="sort_by"> should become: <label for="sort_by" class="sr-only">Sort by:</label> <select id="sort_by" class="resort form-control form-control-sm" name="sort_by"> We should add a <label> with class .sr-only to identify this to screenreaders only because the purpose of the sort function is clear from visual context. (We could use an aria-label instead of <label> but the 'first rule of ARIA' is to use native HTML where possible: "2.1 First Rule of ARIA Use If you can use a native HTML element [HTML51] or attribute with the semantics and behavior you require already built in, instead of re-purposing an element and adding an ARIA role, state or property to make it accessible, then do so." (From https://www.w3.org/TR/using-aria/#firstrule)
Created attachment 119528 [details] [review] Bug 28140: Accessibility: OPAC - "sort_by" select isn't labelled on search results page This patch adds a label to the sort function on the OPAC results page to provide context to screen readers and improve accessibility. The label is visually hidden and does not change how the page displays. To test: - Search for something on the OPAC - Change how the results are sorted and confirm sort still works - Confirm that there are no visual changes to the page - Inspect the sort function to confirm it now has a label - Ideally confirm the label works with a screenreader
Created attachment 119556 [details] [review] Bug 28140: Accessibility: OPAC - "sort_by" select isn't labelled on search results page This patch adds a label to the sort function on the OPAC results page to provide context to screen readers and improve accessibility. The label is visually hidden and does not change how the page displays. To test: - Search for something on the OPAC - Change how the results are sorted and confirm sort still works - Confirm that there are no visual changes to the page - Inspect the sort function to confirm it now has a label - Ideally confirm the label works with a screenreader Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Created attachment 119750 [details] [review] Bug 28140: Accessibility: OPAC - "sort_by" select isn't labelled on search results page This patch adds a label to the sort function on the OPAC results page to provide context to screen readers and improve accessibility. The label is visually hidden and does not change how the page displays. To test: - Search for something on the OPAC - Change how the results are sorted and confirm sort still works - Confirm that there are no visual changes to the page - Inspect the sort function to confirm it now has a label - Ideally confirm the label works with a screenreader Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Nice one Henry! Passing QA
Pushed to master for 21.05, thanks to everybody involved!
Pushed to 20.11.x for 20.11.06
Doesn't apply cleanly to 20.05. Please rebase if needed.