WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Footnotes

for

From: Bryan Garaventa
Date: Feb 2, 2017 3:06PM

That one works well.

It's important to note that for footnotes, typically relying on same page anchors (a link with a hash tag pointing to the ID of the footnote) is not sufficient to ensure cross browser and cross platform accessibility within assistive technologies, mainly due to inconsistent support for this technique. Also this method doesn't help with multiple footnotes that reference the same target in which tracking is needed to return the mouse and keyboard only user back to the same footnote they originally activated.

So the most reliable method for this is to use JavaScript to move focus appropriately and return them back to where they left off, both for mouse users and for keyboard users.

The following is another example of this technique, which uses this scripting method to track multiple target references and return the user to the correct location after activation.

http://whatsock.com/tsg/Coding%20Arena/Footnotes/Footnotes%20(Internal)/demo.htm

A sighted keyboard only user need only press Enter on a footnote to jump to the desired footnote, then press Enter to return to where they left off as before.

Also this technique sets both the Name and Description properties in the accessibility tree so that screen reader users, such as those using JAWS or NVDA or VoiceOver can hear both the Name and Description when tabbing through the active elements in order to quickly locate a desired footnote. You can see the naming calculation values for these properties using Visual ARIA by hovering the mouse over any of the footnotes that are not currently in focus.
(http://whatsock.com/training/matrices/visual-aria.htm )

All the best,
Bryan


Bryan Garaventa
Accessibility Fellow
SSB BART Group, Inc.
<EMAIL REMOVED>
415.624.2709 (o)
www.SSBBartGroup.com