KB Users Guide - General Info - Adding Alternative Descriptions for Images

Alt Text Error Message from the KB System

The KB will run a scan when saving a document to make sure that all images have an "alt" attribute present. If this is not detected, the following error message will be displayed:

This message indicates that alternative text is missing from an image in your KB document. Upon receiving this message, you will not be able to save your work until the alternative text for the image is in place.

Add Missing Alternative Text to Image

1. In the KB editor, open the document in the HTML Code view
   
   
2. Find image with missing alternative text by enabling the Find feature in your browser.
   
   Example:
   
   
   • Mac - Command + F
   • PC - Control +F

   A search field will open, commonly in the lower left of the screen. The image below shows a browser Find text box.
   
   

3. Enter "img" in the browser search field and locate the first img. If you have more than one image, you'll have to identify which image is missing its alternative text. The image below shows the HTML Code view of two images highlighted in yellow for emphasis.
   

   
   
   

   The first highlighted image has a purple box around the alternative text:
   
   alt="open in progress close"
   
   The second highlighted image has no alternative text.
   
   

   Insert the below alternative text attribute to your image:

   alt="enter your descriptive text between these parentheses"

   
   Once you have added the alternative text to the image, save your document as per your KB Group's workflow.

   
   Alternative Text (Alt text)

   Alt text is also known as:

   • alt attributes
   • alt descriptions
   • alt tags

   They are used within HTML code to describe the appearance and function of an image on a page for web accessibility and for those using a screenreader. 

   
   Alt Text uses

   Adding alternative text to images is first and foremost a principle of web accessibility.

   • Visually impaired users using screen readers wil read an alt attribute to better understand an on-page image.
   • Alt text will be displayed in place of an image if an image file cannot be loaded.
   • Alt text provides better image context/descriptions to search engine crawlers, helping them to index an image properly.

    

   Write Effective Alt Text 

   
   The KB Team recommends the guidelines below to write effective alt text for document images

   https://it.wisc.edu/news/how-to-write-effective-alt-text-for-web-images/