To help make images accessible to everyone online content creators should add alt tags which

Images play a key part on social media, but how does someone with a serious vision disability experience a picture? Assistive devices and programs need alternative text, a physical summary of an image, to accurately describe it to a user. Alternative text is commonly known as alt text or an image description, and it serves two major purposes:

  • If an image on a webpage fails to load, the alt text will indicate what the missing image was supposed to be. In this instance, alt text is usually extremely short and more commonly known as an alt tag or an alt attribute.
  • Alt text is also vital for someone who is blind or has low vision and uses assistive technology like a screen reader or text-to-speech program to access digital content because it’s meant to accurately describe images to the user. This should be your main priority when writing alt text.

While adding alt text to images on websites is mostly considered a best practice today, social media is only just starting to catch up. 

Tips for Writing Alternative Text

Something to always keep in mind when writing alt text is that it’s a completely subjective exercise and will vary image to image and creator to creator. Just focus on writing an accurate description of your image to make it as accessible as possible. 

You don’t need to describe everything 

If something in your image is significant to understanding the whole visual or post, describe it in your alt text. If it’s not, skip it. You don’t need to include every nitty-gritty detail. The details you include in your alt text should be contextually important to painting an accurate picture in someone’s mind.

Write in plain language

You should focus on describing the physical aspects of your chosen images. Resist the urge to be ornate or overly effusive with your descriptions and stick to writing in plain language. You want to avoid having your own opinions or feelings about an image interfering with your ability to write accurate alt text. Try to be as objective as possible.

Focus on accuracy, not length

How long your alt text will be is entirely dependent on the image you choose for your content. The more complex your image is, the longer your alt text will more than likely be especially if the image features any text. Again, just focus on accurately capturing the most important details in your image and you should do just fine.

Exclude writing “photo of” or “image of” in your alt text

It’s already assumed that your alt text will be for a photo or image, and a screen reader will more than likely say “image of” before or after reading your alt text. However, if your image file is something like an illustration, a painting, a graphic, or a screenshot, you can include that in your alt text because it gives the user a better idea of how to visualize the image.

It’s okay to use proper nouns and names

If a well-known person, place, or thing is in your image and it adds context to your content, go ahead and use its proper name in your alt text. For example, if you use a picture of the Eiffel Tower while writing content about Paris, you can name the landmark in the alt text.

Consider positional information

Think about the view someone has when they’re looking at your image. Is it a partial view of someone sitting at a table? Do you have a bird’s-eye view of a snow-covered forest? Is your image a close-up of a hummingbird’s fluttering wings? Does your image show a person tilting their head upward towards the sun? Directional or positional information can add important context to your alt text.

Avoid using images with excessive flattened copy

If you’re posting a copy-heavy graphic like an event flyer or an image that has text overlayed on it, you’ll need to add alt text for all the flattened copy because a screen reader will not be able to read it. Flattened copy is text that has been turned into an object upon being exported from whatever program it was created in. You may also hear or see it called embedded copy or outlined text.

If you drag your cursor over the text on an image and it does not highlight the individual words or characters, that means the text is no longer readable, therefore, it’s also not actionable because it cannot be clicked. JPEG, PNG, and GIF files do not support readable text. Usually, assistive devices and programs can only transcribe readable text and cannot pick up flattened copy.

Use personal identifiers for people when needed

This tip on writing effective image descriptions should be taken with a grain of salt since it was written by a white cis woman. Identity and representation are complex and multi-faceted subjects that should always be treated with respect and care.

If the race, gender, ethnicity, sexuality, or another identifier for a person is relevant to the overall context of the image, feel free to add it. It also helps in this instance to think of your content as a whole. What information is included in the written part of your post? As the author, do you feel that extra identifiers in your alt text would add contextual value to the rest of your content?

For example, let's say your content is about the history of Women's Suffrage. Including the gender and race of any people in the alt text of your images would be contextually important because both identifiers are prominent topics when talking about the history of women fighting for their right to vote.

If you’re unsure about how the subject of an image identifies or don’t want to assume how they identify, stick to neutral terms such as using “person” instead of “man” or “woman”? For someone’s race or ethnicity, describe the physical aspects of the person like their skin tone or hair. According to Cooper Hewitt's guidelines for image descriptions, you can use descriptors such as “light-skinned,” “medium-skinned,” or “dark-skinned” to describe the people in an image.

Of course, the best way to ascertain how someone in your image identifies is to ask them, if you are able to do so. Just make sure to explain to your subject that you're trying to accurately represent them and their identity in your content.

Avoid abbreviations whenever possible

It’s better to type out the full name or title of a person, place, organization, or initiative because screen readers don’t always read abbreviations like acronyms and initialisms correctly. Lesser-known abbreviations also don’t add a lot of context to an image. If you use an initialism in your alt text (or any of your content for that matter), type out the full name or title first, and then place dashes, spaces, or periods in between each letter of the initialism so that the screen reader says it properly. 

An initialism is an abbreviation consisting of initial letters pronounced separately. Examples would be KPI, NYC, and FBI. An acronym is an abbreviation formed from the initial letters of other words and pronounced as a word. Examples would be NASA, SCUBA, and FOMO. 

Add keywords for improved SEO

This piece of advice is more relevant for images on websites, as search engines currently do not pick up alt text on social media images.

However, keywords in Instagram’s alt text field do supposedly affect search results for posts within the app. Just make sure that you’re prioritizing the accurate description of your image. You should never keyword-pack your alt text, which just means adding a block of random words to the end of your image description to improve in-app search results. 

A block of miscellaneous keywords may affect how accessible your image is because it could make the alt text confusing. Instead of keyword-packing, find ways to logically work your keywords into your alt text or use hashtags in your caption.

An example of alt text that has a keyword block in it would be, "A stack of pancakes covered in gooey syrup, powdered sugar, and fresh fruit on a white ceramic plate. Buttermilk, breakfast, cafe, local eats, diner, organic food, cooking, culinary arts." The bolded portion is the keyword block and would not make an image more accessible.

What to Avoid in Your Alternative Text

Now that you have a better understanding of how to write effective alt text, let's talk about what shouldn't go in your alt text.

First and foremost, a designated alt text field is not a place to hide messages or put additional marketing content. The primary purpose of alt text is to make images accessible through thoughtful description, and that purpose should not be distorted or manipulated for the sake of engagement.

Other things to avoid in your alt text:

  • Emoji Icons: emoji are typically added to social media content to give it added visual interest, so adding them to alt text makes no sense and could result in confusing alt text depending on the icons that you use.
  • Links: if you put a link in your alt text, it's not going to be clickable and a screen reader will just read it out like any other word in your alt text. Links should go in the written part of your post or tweet, not the alt text.
  • Hashtags: like with links, hashtags aren't clickable in alt text and do not typically add additional context that would make an image description more accessible.
  • Additional Symbols: symbols like the ones for trademark, copyright, and registered don't make an image description more accessible and will get read aloud by a screen reader, so avoid using them.
  • Nonessential Information: details like strings of random keywords, photographer credits, hidden messages, or other information that doesn't make your image description more accessible should not be included in your alt text. 

For more information on alternative text and other best practices that help make your digital media more accessible, visit www.accessible-social.com.

What alt value should be used to make images accessible?

The content of the image is presented in context, so alt="" is appropriate.

What is alt text for accessibility?

Alt text (alternative text) describes the appearance or function of an image on a page. Alt text is read aloud by screen readers used by visually impaired users, displays in place of an image if it fails to load and is indexed by search engine bots to better understand the content of your page.

What is alt text used for?

Alternative (Alt) Text is meant to convey the “why” of the image as it relates to the content of a document or webpage. It is read aloud to users by screen reader software, and it is indexed by search engines. It also displays on the page if the image fails to load, as in this example of a missing image.

Why add alt text to images?

Also called alt tags and alt descriptions, alt text is the written copy that appears in place of an image on a webpage if the image fails to load on a user's screen. This text helps screen-reading tools describe images to visually impaired readers and allows search engines to better crawl and rank your website.