Review footnote design pattern

[duboisp]

The focus order vs the structure order might cause some confusion when the user are navigating the individual footnote at the bottom of the page. That was already discussed here: #2072. Also there were a confusion in order to have the footnotes design pattern conforming to WCAG 2.1 as per #8543.

So this issue is to more to discuss about what kind of design pattern we could use in order to avoid ambiguity during an accessibility assessment.

[EricDunsworth]

FWIW I think there could be value in revamping the footnote reference links and return links in a future incarnation of the plugin.

The status quo's reference/return links look very much like how footnotes are usually presented in printed publications (i.e. a small superscripted identifier - usually a number). But that isn't really a web-first approach.

IMO to make it more web-friendly and WCAG 2.1-compliant, it could benefit from these:

• Making the footnote links look more meaningful to sighted users (is a link in a small box named after a number enough to clearly convey it's a footnote reference?). This could maybe be achieved by placing something like a symbol that's commonly associated to footnotes beside the numbers. Except I don't think there are any symbols out there are are universally recognized as representing footnotes...
• Increasing the size of the links to enlarge their "linked" areas (would make them easier to tap on touch screens - especially on smartphones)
• Not using superscripts (to make the links taller and less likely to cause weird line height issues)
• Doing more to visually-distinguish return links from reference links
• Maybe repositioning the return links to visually-appear below or to the right of each footnote (to more clearly establish a left-to-right reading order). Although either way, the status quo has a meaningful sequence (makes sense for return links to come after each footnote's content) despite the different visual order.
• Making the link text shorter and/or more to-the-point for screen reader users (e.g. "Note X" instead of "Footnote X", "Referrer 1" instead of "Return to footnote X referrer", maybe prefixing the links with numbers like what Footnotes: update hidden text for WCAG 2.1 best practice compliance #8543 proposed).

Challenges:

• Reworking the footnote links to use a web-first approach might make them so different from the conventions users are familiar with from printed publications as to cause confusion. If users don't clearly perceive them as footnotes anymore, that might hinder usability.
• Not making things look like a bloated mess (especially if multiple large footnote reference links are grouped together side-by-side)
• Would probably really need to be reviewed by the AWG and substantial usability testing