Enable longdesc / aria-describedby for enhanced web accessibility on images

[Erin-Cecele]

Before proceeding, check to make sure there isn’t an existing issue for this idea or a similar one.

• [X] I have searched the existing issues and determined this is a new proposal.

Proposed change

The editorial team for GRJ has defined a need to write significantly longer alt texts for some images (particularly the very detailed illustrations.) This has also come up with some of our community members, including @lizneely.

Potential Impact

I do not think this will have any major impact on Quire's core code, although I invite @geealbers to chime in if I'm missing anything.

Supporting Information

This W3C article lays out the options fairly comprehensively: https://www.w3.org/WAI/tutorials/images/complex/

[geealbers]

I'm working on a prototype implementation of this for an upcoming project at Getty. I was originally thinking of putting long description text in an element on the page that was otherwise visually hidden and linking to it from within the longdesc attribute on the image. But while I was working, I didn't hide the description right away and I kind of like the result of exposing it for everyone. (Inspired by the National Gallery of Art's work to add image descriptions to their collection pages: https://www.nga.gov/collection/art-object-page.166425.html.) What do people think?

The text is in a simple <details> html element that has the accessible toggle open/closed built-in. The one thing I'm not sure of is if it's included like this, should we also to add a longdesc attribute to the <img> element that points to the id of the <details> element. Or, is it enough that the details element is labeled as "Image Description" and is contained within the figure caption?