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

-----Original Message-----
From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On Behalf Of Middleton, John
Sent: Thursday, February 02, 2017 11:21 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Accessible Footnotes

I like and have used the wet-boew Footnotes technique as required:
https://wet-boew.github.io/v4.0-ci/demos/footnotes/footnotes-en.html

Regards,
John Middleton
Web Development Specialist
IT Client Technology
American Institutes for Research (AIR)
Austin, TX 78723
www.ktdrr.org




On 2/2/17, 12:19 PM, "WebAIM-Forum on behalf of Beranek, Nicholas"
< <EMAIL REMOVED> on behalf of <EMAIL REMOVED> > wrote:

>Hi folks,
>
>A colleague of mine, Brian Lovely, tried to pose a question to the
>group but the email has not come through. I'm hoping that it comes through mine!
>
>Here is the question:
>
>We have footnotes that are indicated by linked numbers. Is a linked
>number enough or should there be some kind of visually hidden text like
>"footnote"? ...and what about links back to the content from the
>footnote text? Code example follows:
>
><a href="#footnote1">1</a>
>
><div id="footnote1">My foot itches</div>
>
>
>Thank you!
>
>Nick Beranek
>Accessibility Tech Lead
>Digital Accessibility Team
>>
>The information contained in this e-mail is confidential and/or
>proprietary to Capital One and/or its affiliates and may only be used
>solely in performance of work or services for Capital One. The
>information transmitted herewith is intended only for use by the
>individual or entity to which it is addressed. If the reader of this
>message is not the intended recipient, you are hereby notified that any
>review, retransmission, dissemination, distribution, copying or other
>use of, or taking of any action in reliance upon this information is
>strictly prohibited. If you have received this communication in error,
>please contact the sender and delete the material from your computer.
>>>archives at http://webaim.org/discussion/archives
>