Horizontal rule demo

A simple demo page to test whether assistive technology makes any sepcial use of HTML HR elements.


An old W3C document (A. Modality independence) suggests using a title attribute on a HR element. The next separator has a title attribute.


I suppose we could also try using an aria-label attribute too. The next HR has an aria-label attribute.


The next HR has both title and aria-label attributes.


TODO: can we think of a usecase for aria-labelledby on a HR? Labelled by what... the next heading element? Does that hold any benefit?

So does it make any difference?

Findings

Chrome (v57 for Linux) + ChromeVox announces the separators which have a title or aria-label. It does not announce the HR which has neither of these labels. Where both attributes are present, only the aria-label is announced.

Chrome v56 + TalkBack + Android 6.0.1 - announces the separators which have a title or aria-label. It does not announce the HR which has neither of these labels. Where both attributes are present, BOTH were announced.