Using aria-describedby to reference a parent list item to provide link context

This is a test of example 6 in a draft ARIA technique developed by Jon Gunderson: Using aria-describedby for link purpose.

Note: The test result shows not so much a problem with aria-describedby in itself, more with the way it is implemented in the example. A revised example will be tested shortly.

Detlev Fischer, (detlev [dot] fischer [ at ] testkreis [dot] de)

Twitter: @wcagtest

Last update: 5 March 2013

Example

Results: Using aria-describedby to reference a parent list item to provide link context

Tabbing / swiping action is indicated with ||.

Win 7, IE 9, JAWS 14 partial support - unusable
  • Tabbing: While aria-describedby is rendered, the output in this example using the parent list item as descriptor for links in the nested bullet points does not work at all - the outcome is unusable and repeats *all* nested links dog's breakfast (output from just the first link, (HTML)): "left parent - HTML - right parent - link - bullet - Annual report 2 zero zero 5 dash 2 zero zero 6 - bullet - left parent - HTML - right parent - bullet - left parent - PDF - right parent - bullet - left parent - RTF - right parent - bullet - Annual report 2 zero zero 5 - 2 zero zero 6 - bullet - HTML- bullet - PDF - bullet RTF"
  • Arrowing down (virtual cursor mode): aria-describedby not spoken.
Win 7, FF 18, JAWS 14 partial support - unusable
  • Tabbing: While aria-describedby is rendered, the output in this example using the parent list item as descriptor for links in the nested bullet points does not work, even though it is less repetitive than in IE - the outcome is unusable and repeats *all* nested links (output from just the first link, (HTML)): "left parent - HTML - right parent - link - bullet - Annual report 2 zero zero 5 dash 2 zero zero 6 - white bullet - left parent - HTML - right parent - white bullet - left parent - PDF - right parent - white bullet - left parent - RTF - right parent"
  • Arrowing down (virtual cursor mode): aria-describedby not spoken.
Win 7, IE9, NVDA 2012.2.1 supported - but confusing
  • Tabbing: The implementation in NVDA is cleaner but here also, all three links are repeated after the parent list item text "Annual Report 2005-2006" has been spoken, which clearly indicates that this use of aria-describedby is not well supported (output from all three links): "list - list - HTML - link - bullet - Annual report 2005 2006 bullet - HTML - bullet - PDF bullet - RTF || PDF - link - bullet - Annual report 2005 2006 - bullet - HTML - bullet - PDF bullet - RTF || RTF - link - bullet - Annual report 2005 2006 - bullet - HTML - bullet - PDF bullet - RTF"
  • Arrowing down (virtual cursor mode): aria-describedby not spoken.
Win 7, FF 18, NVDA 2012.2.1 supported - but confusing
  • Tabbing: As in IE the implementation in NVDA is cleaner as in JAWS but here also, all three links are repeated after the parent list item text "Annual Report 2005-2006" has been spoken, which clearly indicates that this use of aria-describedby is not well supported (output from all three links): "list with two items - list with three items - HTML - link - bullet - Annual report 2005 2006 - HTML - PDF - RTF || PDF - link - bullet - Annual report 2005 2006 - HTML - PDF - RTF || RTF - link - bullet - Annual report 2005 2006 - HTML - PDF - RTF"
  • Arrowing down (virtual cursor mode): aria-describedby not spoken.
Mac OS 10.6.8, Safari, VoiceOver Not supported VoiceOver on OSX Sfari does not announce list item referenced by aria-describedby, not when tabbing and not when arrowing: "link - HTML || link - PDF || link - RTF"
iOS 6.1,Safari, VoiceOver (iPad mini) supported - but confusing While aria-describedby after a longuish pause, all three links are repeated after the parent list item text "Annual Report 2005-2006" has been spoken, which clearly indicates that this use of aria-describedby is not well supported: "HTML - hyperlink - Annual report 2 zero zero 5 - 2 zero zero 6 - HTML - PDF - RTF"
Android 4.2, Firefox, Talkback (Nexus 7) not supported aria-describedby not supported: "list item one of tree - link - HTML - double-tab to activate".