# Using alt text properly

DevFeed: [Using alt text properly](<https://devfeed.tech/articles/using-alt-text-properly-9367.md>)

Original publisher: [Read original article](<https://a11yproject.com/posts/alt-text/>)

Author: Susan Robertson

Published: 2013-01-14T00:00:00Z

Content type: article

Language: en

Sources: [The A11Y Project](<https://devfeed.tech/sources/the-a11y-project.md>)

Topics: [alt text](<https://devfeed.tech/topics/alt-text.md>)

Tags: [alt-text](<https://devfeed.tech/tags/alt-text.md>), [article](<https://devfeed.tech/tags/article.md>)

## AI overview

This article explains how to use alternative text for images so that people using screen readers, people with images disabled, and people experiencing slow or failed image loading can access conveyed information. It covers useful descriptions for meaningful images, empty alt attributes for decorative images, avoiding redundant wording and line breaks, and adapting alt text to an image's context.

## Source excerpt

The alt attribute is meant to provide "alternate text" descriptions of images to help ensure people do not miss out on information conveyed by graphics. Alternative text can help people using assistive technology, such as screen readers, or people who have images turned off on their mobile devices (to save data, for instance). Additionally, alt text can be useful to everyone in instances of poor Internet service, or your CDN of choice having a service hiccup (or attack), and images are slow or fail to load. A few tips on how and when to use the alt attribute: Use the alt attribute for images that are used as more than decoration. The alternative text describes the primary purpose of an image and is rarely a detailed description of the image itself (unless, for example, the page is actually about a specific image). Make sure the description of the image is useful. For example, if the image is of a company's logo, the alt should be the company's name. The word "logo" is not necessary or useful as part of the alternative text. Don't begin alternative text with "photo of..." or "picture of...". Assistive technologies already indicate the role of the element as an "image" or "graphic". Redundancy makes for poor user experiences. Don't put line breaks in alt text. Doing so can cause awkward screen reader announcements. For instance, inserting the element's role "graphic" and unintended pauses prior to each line break. Use an empty alt attribute for any image that is decorative or not necessary for understanding the content of the page. For example, an image providing decoration to an article's heading could be hidden by giving the image an alt="" or simply alt Using an image several times in a website doesn't necessarily mean the alt attribute will be the same for each instance. For example, a logo within a website's header often doubles a link back to the home page. In this example, the alt would be useful as "Company's name - home". If that same logo were used in the fo