Alt Text: What It Is, Why It Matters, and How to Write It

What is Alt Text and Why Does It Matter?

Have you ever tried to access a website that won’t load properly? While you may be able to read the text, the images may not appear at all. And what if those images convey critical information? You’re then left scratching your head wondering what you’re missing—how frustrating! Unfortunately, this is a common problem that visually impaired readers face every day. Luckily, there’s an easy fix that all content creators can make to guarantee information is not lost: create and embed alt text.

So, what exactly is alt text? Alternative text (i.e., alt text) is descriptive text that conveys the meaning and context of a visual element, like a graph, infographic, map, logo, or photo. Aside from being a requirement for accessibility, alt text ensures that anyone—regardless of capability—has equal access to information. Alt text should be employed for any visual element that is used to convey meaning (read: decorative images do not require alt text). When a screen reader comes across a visual element, it will read the alt text aloud, enabling visually impaired people to consume the non-text content, thus giving them access to the element they may not have otherwise had without the alt text.

How Do I Write Alt Text?

Alt text should be descriptive and clearly explain what the visual element shows or what is being conveyed. Here are a few tips to keep in mind when drafting alt text:

• Start by asking yourself “what is really important about this graphic?” and use that to guide you.

• Always be as accurate and informative as possible and provide the most necessary information in the fewest possible words.

• Do not use color as the only differentiator. For example, don’t say, “the green line shows…” Instead, say what data the green line represents.

• Introduce and define acronyms and never use symbols (e.g., write out “percent”).

• Check your alt text to catch and fix any spelling, grammatical, and punctuation errors.

After you finish writing your alt text, read it to a colleague. Can they understand and accurately describe the graphical element based on your description? If so, congratulations! You just wrote great alt text. If not, assess which parts your colleague seems confused by and make revisions accordingly to better convey the meaning of the graphic.

Good vs. Bad: Alt Text Example

Let’s explore an example of “good” versus “bad” alt text for the following bar graph.

Bad

“This is a graph about student debt. The years range from 1950 to 2020. The blue bars go from 0 to 2 trillion. In 1960, there was not a lot of debt. In 2020, students in America owed a lot of money. These data show that student debt in America will probably increase every year.”

What makes this alt text bad? This description leaves out critical information, such as the type of graph and details about the axes. It also describes the graph by color and makes sweeping assumptions about the data. Let’s explore how we can improve this description.

Good

“This bar graph shows U.S. student debt over time. The y-axis shows the year from 1950 to 2020 in increments of 10 years. The x-axis shows U.S. dollars from 0 to 2.4 trillion dollars in increments of 400 billion dollars. The graph shows an overall trend of exponential increased student debt in America as the years pass. From 1950 to 1990, there is a slow increase in student debt from 200 billion dollars to 1 trillion dollars. From 1990 to 2010, there is a sharp increase from 1 trillion dollars to 1.9 trillion dollars. From 2010 to 2020, this increase slows from 1.9 trillion dollars to 2.1 trillion dollars.”

What makes this alt text description good? There are a few key factors: the type of graph (i.e., bar graph) is clearly identified, each axis is defined in detail, and the text clearly and consistently describes the main data trends as well as what the data show without differentiating by color.

Simple steps like drafting good alt text makes a big difference for those who may have difficulty seeing or interpreting a graphic. That is what Section 508 is all about: making content accessible for all. Stay tuned for the next installment in our 508 Compliance series where we’ll offer tips for making accessible tables.

Need Help Remediating Your Documents?

MacroSys’s 508 specialists are passionate about compliance and have been formally trained in the latest Section 508, WCAG 2.0 and 2.1, U.S. Access Board, and HHS standards. Whether you need help creating 508 checklists or remediating documents, our experts are here to help. Please reach out to us via our website at www.macrosysrt.com. We would love to hear from you!