search

modxcms / a11y

MODX Accessibility for the Manager
14 stars 10 forks source link

Change how parenthesis are read for tree ID numbers #15

Open rthrash opened 9 years ago

rthrash commented 9 years ago

Currently rough to listen to reading all the "open parenthesis" / "close parenthesis".

rthrash commented 9 years ago

Perhaps the following solution:

Home <span class="visual-parens><span class="visually-hidden">id</span>1</span>

Would produce for sighted users: Home (1)

But would read for non-sighted users: "Home ID1"

.visual-parens { generated content to wrap with parenthesis }

.visually-hidden { display: none }
rtripault commented 9 years ago

For the record, the markup is defined within a processor : https://github.com/modxcms/revolution/blob/master/core/model/modx/processors/resource/getnodes.class.php#L472-486

paulbohman commented 9 years ago

The comment by @rthrash on Nov 6 looks like the right type of approach. After some testing with ::before and ::after CSS pseudo-classes, I've found that VoiceOver will read the generated content on regular text, but not when that text is in a link. JAWS reads generated content in Firefox, but not in IE. NVDA does not read generated content at all, as far as I can tell. So I tested aria-hidden="true" and that seems to be the most robust method:

Home <span aria-hidden="true">(</span><span class="visually-hidden">ID </span>1</span><span aria-hidden="true">)</span>

It's verbose in the markup, but it works across screen readers.

rthrash commented 9 years ago

Thanks Paul … great solution.

rthrash commented 9 years ago

This will require a modification to the core. Fortunately it's not critical for functionality, but it will mean that a nicer reading of the site tree will mean running 2.3.4+.

Are there any other changes to the tree processor that would make sense to tackle at the same time?