Day 3: Master Alternative Text
Enhance the accessibility of yesterday’s post by adding alternative text (alt text) with an image when reposting to LinkedIn, Facebook, Instagram, or Twitter. Tag your post with #ABD21DayChallenge and #AccessibleByDesign.
Alt text is descriptive text to help people who cannot see images and use screen readers to assist them in understanding the intended message of visuals.
When adding alt text:
- Do not use auto-generated descriptions because they will not provide sufficiently informative descriptions for users of screen readers.
- Instead, write your own descriptive but concise alt text.
- Explain key visual elements.
- Write your alt text in a word processor to catch typos and grammatical errors.
For more guidance, each platform has its own process for adding alt text, which can be found on its accessibility page and below.
Linkedin (Desktop)
- Navigate to the LinkedIn website.
- Upload an image.
- Select “add description” at the top right to add your alt text.
Note you can only add alt text on the desktop version.
Facebook (Desktop)
The process is the same on computers and smart phones but differs slightly on an iPhone when the iOS screen reader, VoiceOver, is enabled.
When posting:
- Go to the top of your newsfeed.
- Select “Photo/ Video.”
- Move your cursor over the image.
- Select “Asset.”
- After auto-generated alt text appears to the left of your image, edit this alt text by selecting “Override Generated Alt Text.”
- Input your alt text into the form field.
- Select the “Save” button.
After posting:
- Select a picture you already posted.
- Move to the top right of your screen.
- Select “assets.”
- Choose “Change Alt Text.”
- Choose “Override alt text.”
- Input your alt text into the form field.
- Select the “Save” button.
On iPhone with VoiceOver
- Select a picture you already posted.
- Move to the right corner of your screen.
- Select “More.”
- Choose “Edit Alt Text” from the drop-down menu.
- Select “Override Generated Alt Text.”
- Input your alt text.
- Select the “Save” button.
Note: To hear the alt text, you must exit your post and go back into it.
To see and edit alt text for a photo before you post it on Instagram:
- Upload an image.
- Select your filter.
- Edit your picture.
- Select “Next.”
- Navigate to the bottom of the screen.
- Select “Advanced Settings.”
- Choose “Write Alt Text.”
- Input your alt text into the form field.
- Select “Done.”
To change the alt text of a photo after you have already posted it on Instagram:
- Select your image.
- Choose “Edit.”
- Navigate to the bottom right of your screen. Select “Edit Alt Text.”
- Insert your alt text into the form field.
- Choose “Done.”
On Desktop and Mobile:
- Select the “Compose Tweet” button.
- Attach your photo.
- Choose “Add Description” to insert alt text.
- Input your alt text.
- Select the “Done” button.
Note: You can add alt text to each image in your tweet, and each description has a limit of 1,000 characters.
Adding descriptions using VoiceOver
- Use touch exploration to navigate to the top of your screen.
- Locate the “Compose Tweet” button.
- Select the “Compose Tweet” button by double-tapping it.
- Swipe from left to right or vice-versa to move through the items on your screen until you find the “Photo Library” button.
- Double tap the “Photo Library” button to add an image.
- Swipe left to right to move through your images.
- Double tap the image you want to add.
- When you return to the composer, locate the image by swiping to the right.
- Double tap the image.
- Swipe up and down until you hear “Add Description” then double tap.
- Swipe to the right to find the “Done” button.
- Double tap the “Done” button. Making this selection will return you to the Tweet composer.
Adding descriptions with JAWS
- Skip to the Virtual JAWS Curser by selecting keys, “Insert” and “3” at the same time.
- Use keystroke, “N” to compose a tweet.
- After opening the “Tweet Composer,” navigate to the “Add Photo or Video” button with the “Tab” key and select “Enter.”
- Select your image with the “File system dialog.”
- Navigate through the composer with the “Tab” key to locate your image or images. Images will be named as Photo 1, Photo 2, etc. The numbering refers to the order the images were added to the tweet.
- When JAWS is focused on the image, select “Enter” to open the “Thumbnail Preview Dialogue” to add alt text.
- Insert your alt text into the form field, using a maximum of 1,000 characters.
- Choose the “Done” button by using one of two key combinations. The first option is to press “Tab” and then “Enter, and the second option is to hold “Ctrl” and then press “Enter.”