Server Edition – image accessibility
Fixing an accessibility issue in an image
Let's look at how you fix an issue – for example, the warning <img> missing alt text. The alt text is the short description of an image that displays when you mouse over it in the browser. The screenreader applications used by visually impaired users read these alt texts.
The accessibility principle behind alt text is that all images should have text equivalents in order to make the page intelligible via screenreaders.
During conversion, when the Converter detects missing alt texts it automatically searches for image captions and inserts these as alt texts if they are analysed as suitable. Where no suitable caption is detected, an accessibility issue warning for missing alt text is displayed. You need to insert alt texts for those images. Even invisible images such as transparent GIFs used as spacers, or coloured shapes used only for layout purposes, should be given an equivalent such as alt=" ". RiverDocs provides a Decorative image option to insert such blank alts.
After conversion, the Accessibility Issues pane on the right of the screen lists the issues on a per page and total (All) basis.
To correct the first alt text issue, you
-
Click the issue warning
<img> missing "alt" text"in the Accessibility Issues list, which highlights and selects the relevant image in the Editing pane. In this case, it is the first in a group of butterfly images.
- Click the Insert/Edit Image button.
The Insert/Edit Image dialogue box is displayed. At this stage, the image's location displays in the Image URL text box, but the Alt Text box is empty.
- Decide on a suitable alt text by inspecting the image and/or reading the relevant part of the
document – in this case, the paragraph of text for image 1 tells you that the butterfly
is a Small Tortoiseshell. As the text describes the butterfly's habits rather than its appearance,
the name will be sufficient as an alt text, especially as it is so descriptive.
- Enter the name, "Small Tortoiseshell" in the Alt Text box.
alt = " ") by simply typing a single space (without enclosing it in inverted commas). Any important words depicted in the image should also appear in the alt text description. If you wish to write more than 150 characters, you can create an HTML page containing a longer description and enter its URL in the Long Desc text box – but do not omit the alt text. Do not include filenames (names with extensions such as .doc or .jpg) in your alt text.
You have now fixed the alt text issue. You use a similar procedure for all the other warnings involving missing text properties.
Long Desc
Long descriptions of images may be necessary for accessibility when the image is a detailed map or diagram that is not described fully in the web page where it appears. For long descriptions, you should create a text equivalent – a separate HTML page that describes the image in text, and insert the URL of the page in the Long Desc text box.
To ensure full accessibility compliance, it is also recommended that you inspect the other images – those that did not generate warnings – during the editing session to verify that the automatically inserted alt texts are suitable.
You can verify your changes as you edit by clicking the Accessify button, which runs a fresh web accessibility check and repair on the current page by re-testing it against the WCAG 1.0 rules. This can be left until the end of the document, because the check is triggered automatically each time you move to a new page, and it is easy to locate and view issues on previous pages by just clicking them in the All list. As you fix issues, they are removed from the list.
