If you have an election results chart, the alt text needs to communicate the results. "Election results" is not enough. The same rules apply for alt text for images of weather charts. "Weather chart" doesn't cut it and doesn't convey what the chart is actually saying to users.
Don't use color alone to convey information. Marking required fields by only using colored labels won't help people who use screen readers or who can't distinguish colors. If using color, also add text like asterisks and/or "required."
Avoid emoji icons in alt text. Emoji icons are a visual element, so it's counterintuitive to add them to non-visual content. You'll likely confuse people with messages that don't make sense. In alt text, use plain text, free of symbols, icons, or any weird special characters.
Generic descriptions don't convey the information or context sighted users get from the image. Examples like "election results," "group of people," "screenshot from Google," or "city skyline" may be technically be true, but they don't provide information and context.
Audio descriptions are necessary for making videos accessible. They narrate the crucial visual elements that would be necessary for understanding the plot without the ability to see the screen. They describe non-verbal cues like gestures, facial expressions, or eye contact.
You don't necessarily need to say "image of" in your alt text for users to know it's an image. Screen readers will announce that it's an image. But it can help readers to specify if it's a hand-drawn image, Polaroid, infographic, screenshot, chart, map, diagram, or so on.
People who are new to writing alt text sometimes feel they must describe every detail, and then get overwhelmed by this pressure. Imagine a large crowd at a football game: you are not expected to describe every single person in a crowd in detail. This would be nearly impossible.
The difference between "full verbatim" and "clean verbatim" transcripts: Full verbatim captures spoken word exactly as stated, including filler words, stutters and false starts. Clean verbatim has words exactly as stated, but edits the filler words, repeated words and stutters.
When considering rainbow text, don't forget to consider readability and legibility. Text filled with rainbows can be difficult to read. Same with complex rainbow backgrounds. Putting each word or letter in a different color of the rainbow could force readers to work harder.
If you put links or hashtags in your alt text, no one will be able to click or select the link or hashtag. It's just going to be read out loud. If you have a link or hashtag to share, that should go in the written part of your post or your tweet, but not the alt text.
Do not cram alt text with keywords just to improve search engine optimization. This will hinder alt text’s true purpose: improving accessibility. Focus on describing the photo's content. Search engine optimization should not be the goal for writing good alt text.
Automatic captions make it difficult to watch videos because the viewer is forced to decipher misspelled or mistranslated words that appear in a string of text without punctuation. These can be distracting and disorienting. Always edit these types of captions before publishing.
Don't write generic descriptions for alt text. "Screenshot of a news article" might technically describe an image, but it does nothing to convey the information or context sighted users get from the image. People who can't see the image need the same information and context.
Beware of companies promising to make sites completely accessible, compliant, and immune from lawsuits with just a few lines of code. This just isn't possible. Disabled users have long said these tools don't actually help them, and can often make things worse.
First and foremost, alt text must always be informative and descriptive of the content in the image. It can have character and humor, but it still needs to be informative and descriptive. Alt text is not a place to add easter eggs or jokes for sighted users.
Do not rely on the A.I.-generated alt text in Facebook or Instagram. The result is vague and useless, like "may be an image of food and text," and "may be an image of outdoors." These do nothing to give users the context and content of an image.
Hyperlink text should make sense when read out of context. Screen reader users can navigate from link to link, and can listen to links in a list. When navigating this way, only the link is read. So "click here" or "read more" won't make sense.
When using Microsoft Word or Google Docs, don't just make text bigger and bolder to make it a heading. That will work for sighted users, but screen reader users will miss that and just hear it as normal paragraph text. Use actual heading styles, like level 1 through 6.
Alt text is not the same as a photo caption. Captions are typically written to support a photo, and usually depend on users being able to see the photo. But alt text is meant to be the stand-in for the photo. The alt text is what a screen reader user gets in place of the photo.
When writing alt text, ask yourself if you would picture an approximation of the image if it was described to you over the phone using the alt text you've written. Doing that exercise can be a good way to determine if you're on the right track.
Helping you better understand web accessibility for people with disabilities, whether you're a student, teacher, journalist… whomever!Run by @patrickmgarvin