3 Tips for More Accessible Social Media Content
Common accessibility pitfalls in social media posts, and how to change your behavior.
Common accessibility pitfalls in social media posts, and how to change your behavior.
Generally speaking, the web can be a pretty hostile place for people who require assistive technology to interact with it. For people who rely on screen-reader software or a braille display, the way people communicate in online communities can be difficult to read, or completely unavailable depending on the situation.
The good news is this is overwhelmingly a problem of awareness. Once you understand and empathize with how many people experience these issues, it’s all pretty easy to fix.
Note: I write this not as any sort of authority on accessibility, but as someone trying to be curious, empathetic, and using what little platform I have to try and change people’s behavior for the better.
Here are three common accessibility pitfalls, and what I’ve done to try and change my behavior recently:
1. Don’t abuse emoji
Using emoji in ways to visually communicate some type of meaning is a common problem. The following tweet:
Is read audibly by some screen readers (apologies to people using screen readers, skip the example if you can) as:
Article.
I don't listen to taylor swift.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
Triangular flag on post, image.
You see how this could get annoying fast.
Don’t use excessive repeating emoji. Keep in mind that the text description of the emoji doesn’t always contain the meaning you expect. In the above example, the color of the flag isn’t mentioned at all, even though the tweet author is using it as a “red flag” stand-in.
There’s also no robust way to provide good descriptive text alternatives for things already interpreted as text content like emojis are. For memes like the one above, reducing to a single emoji is still not great for conveying intent, but at least it’s a lot less annoying.
Better still might be taking a screenshot of the tweet before you send it, attaching the screenshot as an image, and adding more descriptive alt text.
2. Capitalize hashtags
If you don’t capitalize words in your hashtags, they are often interpreted by screen readers as either single words (and are read aloud like single words), or it splits the hashtag in the wrong places, changing their meaning.
#MeToo
written as #metoo
it is often pronounced as one word “mehtoo”.
#LunchWithTheFT
written as #lunchwiththeft
is pronounced as “lunch with theft”.
#PenIsland
written as #penisland
sounds like, well, you can guess.
This is a super easy one to adjust for. Just try to be aware of it and capitalize your hashtags appropriately wherever possible.
3. Add descriptive & meaningful alt text to images
Images without alt text (text that describes what is shown in the image) is completely invisible to many users who rely on assistive tech, rendering the content or context of many tweets lost.
Here are some tips that have helped me improve my alt text:
1. Turn on the reminder feature
Twitter now has a feature, hidden away and turned off by default, that prompts you to add alt text to an image if you've forgotten to do so. As well-meaning as you may be, your biggest problem is likely to be forgetting to do this, so this feature helps immensely. It’s saved me 5 or 6 times just this week.
In Twitter, navigate to: Settings and Privacy > Accessibility, display and languages > Accessibility. Under the Media section, check ✅ Receive image description reminder.
2. Reframe it as a challenge
Writing alt text might initially feel like additional busywork, but if you enjoy writing, think of it as a little writing exercise. It can be a lot of fun trying to distill the essence of an image into a short sentence or two. You don’t need to be exhaustive; just think: what information might someone need, in order to understand what I’m trying to convey with this image?
Here are a few examples from some recent tweets of mine:
3. Use OCR capabilities
Sometimes you’ll want to tweet an image that contains a bunch of text, that’s a bit too long to want to type out by hand. If you have access to the original text that’s in the image, the easiest way is to copy and paste directly from this to Twitter’s image description. That’s often not possible though.
OCR (Optical Character Recognition) helps reduce the time it takes to populate the alt text without writing it all out by hand manually, but just remember that sometimes the text alone doesn’t convey the full context so add some if needed such as “A tweet saying:” or whatever is appropriate.
On Android 11 and above, if you swipe up slowly from the bottom of the screen you’ll see your active apps. Underneath your current app should be two buttons, Screenshot and Select. Tap Select, and the text anywhere on the app’s visible screen will become selectable. You can then copy text directly from the image, and paste it into the description. This doesn’t work on phones that override the native Android app switcher (I don’t believe OnePlus for example let you do this).
On iOS this works basically the same. Take a screenshot, then click to view the screenshot. Tap and hold a word and text selection handles should show up. Select your text and copy it to the clipboard. More detailed instructions can be found on the Apple support website.
If you’re on MacOS, I’d recommend looking into Cleanshot X. It’s not free, but has some amazing screenshot capabilities that I’ve written about before, including capturing text from images using the OCR feature.
If you’re on Windows, iPhone, or otherwise and have suggestions for shortcuts or tips like the ones above, leave a response here to help others.
That’s it! Try some of these approaches and you’ll see they get easier and more natural over time. Don’t stress if you mess up, and eventually they should become normal daily habits.
If you’re a person who’s affected by these types of mistakes first-hand and want to let me know that I’ve missed something or used a poor example, feel free to leave a response. I’m trying to learn and adapt my approach in real-time.
Thanks to Soren Hamby for helping make this article better. Originally posted on Medium.