Making your social media profiles accessible to the majority of people stumbling across your posts is an intentional practice. From Instagram and Twitter photo descriptions to captioning audio on your TikTok videos, you have to consciously add these accessibility considerations. It's something you should absolutely do to ensure your accounts are navigable by people with various disabilities. Don't fret: You have most of the tools at your disposal.
One of the easiest things you can do is to add alternative text (alt text) image descriptions to your posts. This simple practice has the potential to help the millions of Americans who need assistive technology to access the internet, from people who are blind or have low vision to many others who use screen-reading devices. Once written, the descriptions are added to a website's HTML, making images easier to translate to screen readers, voice controls, or even directly to braille.
For the most part, alt-text is a responsibility of the website designer and is implemented in the coding process, but on profiles where you frequently add images or decorative elements, it's also something to consider doing yourself. While making these additions won't take up much of your time, there is an art to ensuring that your alt-text image descriptions are easily read by others' tech.
When getting ready to add your own alt text for images, there are three main things to keep in mind:
1. The purpose of the image
Most alt-text descriptions are based on standards set by the Worldwide Web Consortium (W3C), an international web accessibility standards group. These standards offer guidance for web developers, companies, and even individual users. The W3C begins by guiding users to think about "Images Concepts" when it comes to describing whatever they're posting: essentially, what the image's purpose on the internet is, or the main content of whatever it is you're posting. Is it a really cute selfie? Is it a busy landscape with many objects? Is it a screenshot of a funny tweet, and thus has a lot of text? Or, if you're coding something like a custom Tumblr theme, are the images just there to make the site look good? Knowing this information will help you decide what images require descriptive alt text in the first place, and what you should prioritize in the description itself.
While W3C describes many different image concepts within its guidelines, everyday social media users or at-home coders will probably only be describing one of three types: informative images, images of text, and groups of images (think Instagram carousels). As digital accessibility consultation group Deque writes in its alt text guide, other types of images, such as decorative ones, don't require alt text descriptions if their only purpose is to add non-informative design element. Examples of this often include decorative headers on homepages or colorful background images used only for aesthetic reasons.
2. Custom versus automatic descriptions
This depends entirely on where you'll be posting your images — some sites automatically generate image descriptions without providing the ability to edit, while others let users add alt text as they see fit. If you're posting on Twitter, for example, you have the option to write short image descriptions in the settings of your own tweets — that means you don't have to add the descriptions to the tweet itself. Other apps don't have that option, and you'll have to get a little more creative.
Keep in mind the tools at your disposal within each of these apps and websites.
Twitter added image captioning tools in 2016 and expanded the accessibility feature to more media, including GIFs, in 2020. To add or edit image and GIF descriptions on your original Tweets, you'll have to use Twitter for Web on your desktop computer. Go to "compose tweet," add your image, and then select "add description." Twitter alt text has a 1,000-character limit, and you can consult the website's own advice for writing accessible picture description, as well.
You can also follow the Twitter bots @AltTxtReminder and @AltTxtCrew to get notifications that remind you to add alt text or to see if a tweet already has image descriptions.
For Facebook image posts, users can customize their own alt text. When adding an image or video to a post, click on the edit menu on the top of the post. You should see an auto-generated alt-text description on the left side of the photo, created by Facebook's own artificial intelligence programming. If you're unhappy with the description, select "override generated alt text" and add your own. To change the alt text of an image that's already been posted, go to the three dots in the top right of the post and select "change alt text." Follow the same steps as before to add custom alt text.
Over on Instagram, image posts are given automatic image descriptions using object recognition technology. But computers can't always accurately describe everything. Consider adding your own accessible descriptions to the bottom of your instagram descriptions, like the ones below from disability advocate Molly Burke.
3. Writing the alt-text
Now here's where the nuance, and a little bit of forethought, comes in.
Write concise, but meaningful, descriptions
Alt text descriptions should clearly convey both the content and the meaning of the image, and should aim to use as few words as needed. Describe what's essential to understanding (and enjoying!) the intent of the posted photo — you don't need to add in a sentence for every visual element, but should include as much as you need to create an accurate portrayal of the image. Cut out unnecessary words and combine separate sentences as much as possible. One to two sentences is usually more than enough room to describe what's going on.
As mentioned before, these photos convey information to the people scrolling your page, even if you are just posting them to brighten up your feed. They have a purpose, and for that reason, alt text should focus more on the image's meaning than its aesthetics. This means you're not focused only on what the object in the photo looks like, but what it is and why it was posted. Go back to what you determined as the purpose of your image to help clarify this — it may also depends on your account itself. What kind of content do you share, why, and to whom? Try to include just as much detail as you need for the specific audience or context you're posting for. In the examples from Burke's Instagram above, her descriptions help engage an audience that frequents her account for fun, fashion-related influencer content on top of advocacy, and the descriptions reflect that tone.
No need for "a photo of"
Phrases like "a photo of" or "an image of" take up character space. You may be inclined to make sure your followers, users, or readers know that the image you've posted is a screenshot or a GIF, but more than likely they already know they've scrolled to a graphic because of the way a screen reader distinguishes web elements. Try not to add these phrases to your alt text and save yourself some precious words. Depending on what information the image is providing, including distinctions between paintings, illustrations, and animations can be helpful. It may also be important to distinguish when an image is depicting a graph or diagram that carries information in a particular way, such as a bar chart versus a pie graph.
Avoid physical identities unless necessary
A good rule of thumb when posting pictures of other people or images that you didn't take is to avoid using physical descriptors like gender, race, disability, age, etc. that can perpetuate stereotypes or spread misinformation. Only include these descriptors if they're really relevant and you can confirm them. This choice may also depend on who you expect to be engaging with your content.
Describe your memes
If you're posting memes, edits, or funny GIFs that have a specific tone or social context, add a succinct explanation to your alt text descriptions. For GIFs, specifically, remember that screen readers will most often read them as still images, so include a sense of what is moving or going on in the alt text.
Don't use emoji, but do capitalize your hashtags
Emoji are often extremely difficult for screen readers and their users to understand. Avoid using emoji to replace words, and use simple, contextual descriptions of the emoji in question.
If you feel the need to include a hashtag in your image's description, such as to convey the words written on a sign or a shirt, make sure to capitalize the first letter of each word in the hashtag — this helps screen readers understand the hashtag without spaces.
Don't skimp on the punctuation
Screen readers are designed to read and repeat back human-written text, so making your alt text descriptions as close to how you would normally read and write will help users better understand what's going on. Use commas, periods, and quotation marks if needed to describe multiple objects or convey text shown in the photo.
Check out some examples of what works and what doesn't for alt-text descriptions:
EXAMPLE: "Two people outside, sand, jumping."
ALTERNATIVE: "An adult and child play joyfully at an outdoor park."
EXAMPLE: "An image taken of a young woman in a blue coat holding a burger and eating fries. She is sitting at a table outside and there are buildings behind her. A man is sitting next to her watching her eat."
ALTERNATIVE: "A person enjoys a burger and fries outside with a friend."
EXAMPLE: "A dimly lit photo of a hand holding an iPhone. There is a brightly lit blue and white screen behind the phone showing The Twitter Logo while they scroll."
ALTERNATIVE: "A person scrolls through the verified Twitter account."
Alt text descriptions are really contextual, and they're kind of an evolving art for individual social media users — part of a process of figuring out what is actually helpful for you, your followers, and the general public. It's OK to try out descriptions and fail (or realize that your alt text could be improved). It's better to attempt to build accessible online spaces than never try at all.
Follow Mashable SEA on Facebook, Twitter, Instagram, YouTube, and Telegram.
