[Hpr] Accessibility problem

[Dave Morriss]

On 01/08/2022 21:09, Mike Ray wrote:
> 
> Hello
> 
> I just spotted a glaring accessibility issue on the HPR site.
> 
> 
> I just listened to the community news, published today, and heard 
> mention of a show about Kafka. Which I need to know about right now for 
> work.
> 
> So I went to the site and to the tags page.
> 
> Running down the list of tags that begin with the letter 'K', I found:
> 
> • kafka: 3639
> 
> That's fine, but only the 3639 bit is included in the link.
> 
> So, when I hit the 'k' button to navigate by links in NVDA, a Windows 
> screen reader, all I get is number after number. I believe all major 
> screen readers include a key to jump from link to link.
> 
> No idea which is the Kafka show.
> 
> So, the link needs to be changed to include the tag in the anchor.

Just to keep everyone up to date, I made some tweaks to the tags page to 
try to make it more accessible. I emailed Mike about the latest changes 
and, I think I'm right in saying, he finds it a lot more usable.

The changes have been:

- Add a header at the start of each alphabetic tag section. Mike says he 
  can navigate by headers, and this was a change he suggested.

- Add an 'aria-label' attribute to each show link that contains:
	the tag
	a hyphen
	the word 'show'
	the show number

An example of the latter might be:

=-=-=-=-=-=-=-=-=
<li>
<a id="kate"><strong>kate</strong></a>:
         <a href="http://hackerpublicradio.org/eps.php?id=1840"
             target="_blank" aria-label="kate - show 1840">1840</a>,
         <a href="http://hackerpublicradio.org/eps.php?id=2055"
             target="_blank" aria-label="kate - show 2055">2055</a>
</li>
=-=-=-=-=-=-=-=-=

This change makes the links associated with the tag more meaningful when 
using a screen reader.

Please let us know if there are more accessibility issues we need to 
tackle on the HPR site!

Dave

-- 
Dave Morriss, Edinburgh, Scotland, UK | perloid at autistici.org