Re: Doormat navigation link, following text, and aria-describedby. Is this OK

Hi Alan,

I would bet that the pattern you are describing came out because the design team insisted that the link acts as a heading for the description (even if it’s not semantically like that in HTML), because that is how it would be interpreted by sighted users that can immediately see both.

To serve screen reader users (as in your example), the development team then decided to add the aria.

It seems an elegant solution, but I wonder if there are issues with it.

From: Bristow, Alan <Alan.Bristow@elections.ca>
Date: Monday, 28 November 2022 at 15:21
To: w3c-wai-ig@w3.org <w3c-wai-ig@w3.org>
Subject: Doormat navigation link, following text, and aria-describedby. Is this OK

Hi all,



TL;DR;

Should I associate the link of a doormat to its following describing paragraph via aria-describedby?





DETAIL

Coding doormat navigation I am presenting a link and a short paragraph of text to describe the destination more fully. Initially I coded like this:



[P]Description of the doormat destination[/P]



[A]Pithy description / title of the doormat that links to the destination[/A]



This made sense to me as I assumed a screen reader (SR) user arrow-key navigating (move, hear, move, hear) would want to know there was more to understand about a link than the short content in the link text alone, and in some less common cases on hearing the link text they might think "this is probably where I want to go [click]", but, if they had known there was a description following they might have found it was in fact not where they wanted to go.



So; to improve this I used my aforementioned pattern, (description, then link).



However, looking at, for example, canada.ca or gov.uk, it seems mine was an antipattern -- they had link, then description.



So I changed my doormats to be more "normal".



However, to address my initial desire that the SR user get to know the full doormat of info about any link they tab to or cursor down to, I used aria-describedby to associate the text that followed the link, to the link (I also use a period "." at the end of the link text, so the aural presentation is more nuanced, showing the separation from "title" and "text").



Because slightly to my surprise neither the Canadian or UK sites did this I wondered if I am making a mistake in this use of aria-describedby.



Any feedback appreciated.



Thanks.


Regards,

Alan
.. . . . -   . . - - -
Alan Bristow ( he / him / il )
Web Developer / Développeur Web
Elections Canada / Élections Canada
alan.bristow@elections.ca<mailto:alan.bristow@elections.ca>