Using alt text to describe images and other non-text content is done appropriately, it increases both the accessibility of your website and your S E O. Assistive technology users will have a better understanding of your website content and its searchability will improve. When a search engine scans your site, it will able to read and index the alt text, ultimately improving your search rankings.
Follow these guidelines and avoid common mistakes while writing alt text.
- DON’T USE WORD “IMAGE”
The most common mistakes is to use the word “image of” or “graphic of” in alt text before describing an image. Screen readers handle this thing automatically. They’re programmed to recognize an image on a computer screen and will announce “image” or “graphic,” leaving the description up to us.
But, sometimes it is appropriate to state the type of image whenever it’s necessary.
. For example, Diagrams, graphs, and pie charts where they have information that’s crucial to the user.
- AVOID TEXT CONTAINED IN AN IMAGE
Avoid such images that convey important information through text. Text inside image must be described in the alt text. Advertisements usually have text within an image. , which is important to understand for users.
For images with a lot of text or more complex images such as diagrams or charts, it may be necessary to add an additional long description outside of the image’s alt attribute.
- DON’T USE ALT TEXT FOR DECORATIVE IMAGES
Decorative graphics such as dividers or design items that don’t provide additional content don’t need alt text. They don’t add to the information a user needs and they make little sense, when read with a screen reader. Consider the purpose of your graphic and whether alt text will provide any information or benefit.
But remember, just because an image doesn’t need alt text doesn’t mean you can ignore it. Instruct assistive technology to skip over images with a null alt attribute.
- DON’T REPEAT THE SAME TEXT IN BOTH THE CAPTION AND ALT TEXT
Whereas alt text in an alt attribute is appropriate for providing a short description of an image, captions can be useful for longer descriptions, complex images, and photo galleries. Sometimes images are best when they have both. Complex images such as graph might need a short alt text description with a longer caption to show the purpose or data of the graph.
Captions are visible to sighted users but may not always include descriptive elements of an image. Although alt text and captions serve different purposes, they sometimes overlap. For this reason, the two should never include same text. When a screen reader scans a web page or document to read the text aloud, it becomes boring to a screen reader user.
- DON’T USE “COMPANY LOGO” AS YOUR ALT TEXT
Wherever your company logo appears on your website, you should always include the company name within the alt text. Writing “company logo” is basic and undescriptive and gives little information when accessed with a screen reader.
- USE SIMPLE LANGUAGE
Why write “utilize” when you can say “use”? Using simple language provides a level of comfort and also helps in accessibility.
- USE CORRECT SPELLING OR PUNCTUATION
Punctuation matters for screen reader users. Including periods and commas allows a screen reader to read naturally, providing appropriate pauses to separate ideas, paragraphs, or other content. The same goes for spelling. Misspelled words won’t be read properly and sometimes even provide a different meaning. Just as you are careful to edit your on-screen content for proper spelling and punctuation, do the same for alt text.
- REVIEW OR UPDATE ALT TEXT
Whenever your screen content is reviewed, alt text should be reviewed. Whenever last banner ad messaging was updated, was the alt text updated or is it still giving outdated information? When you redesigned your company website, was alt text updated to keep up? It’s critical to your reputation and your risk management that alt text is kept accurate and up dated.
