Table of Contents
Intro
Many accessibility experts may know about decorative graphics – the graphics which are inserted to provide visual interest, but can be skipped by a screen reader. I myself have used decorative graphics (e.g. the background on my A Linguist in the Wild blog), so I have no objection to them.
But I believe I have discovered another kind of decorative graphic – the stealth decorative visual. These are elements which a platform may treat as a graphic, but which an editor may not realize are there. These can include:
- Background shapes
- Background textures
- Tool lines
- Textboxes (especially if they have borders and filler colors)
A PowerPoint Example
Consider the following slide explaining how to begin a embroidered pendant. How many images are in the actual slide? I’ll let you think about this for a second, then you can see the answer below.
View List of Images
The following nine (9) images are on the slide
- The photo of the black felt tear drop – this has explanatory ALT text.
- The background is a gradient, but some slides contain decorative compass diagrams
- There are two pink lines on top of the photo – these are marked as "decorative"
- The five circles were also added and marked as decorative.
Here’s another slide with a possible stealth graphic – this time from a linguistics course. It looks like it’s a "text-only" slide, but in reality there is a big blue square in the upper right (it’s on almost every slide). Unless the editor goes into the slide master to mark the blue square as "Decorative" it could be read out as an image on some screen readers (sigh…).
View Text transcript
From Corpus Inscriptionum Latinarum, Volume 4.
I.7.1 (in the vestibule of the House of Cuspius Pansa); 8075:
“The finances officer of the emperor Nero says this food is poison.”
II.7 (gladiator barracks); 8792:
“On April 19th, I made bread.”
VI.16.15 (atrium of the House of Pinarius); 6842:
“If anyone does not believe in Venus, they should look at my girl friend.”
The Journey to PDF
The process of converting a document is especially perilous. Many items, such as textboxes can become <Figure> tags which contain lists or paragraphs…but no image ALT text. How is that handled in a screen reader?
Because of this, it is recommended that most "objects" in Adobe InDesign be pre-tagged to be exported as <Artifacts> instead, so they can be skipped by a screen reader. Unfortunately the same same options don’t always exist in other document tools.
HTML is Different
Why hasn’t this topic been covered widely? I believe it’s because accessibility began as "web accessibility" within the HTML framework. HTML leverages CSS styles to allow formatting options, particularly borders and shading, to be added to different elements.
If you consider the image below from the Penn State Anthology Ally landing page, you will see that the actual code has no images at all.
This content is just a special DIV with rounded corners and a border with a custom H2 tag. The blue "button" is really an A link with border and shading added. The screen readers are designed to skip the CSS and proceed with the semantic structure only. Thus there are rarely any modern stealth graphics in modern HTML. Isn’t HTML cool?