Presenter
Alexa Heinrich — St. Petersburg College
Description
Accessibility is a common priority for web development but often overlooked when it comes to content creation for social media. As social media professionals, there are easy things we can do—and should do—to make sure the content we produce and the way we deliver it is accessible for everyone, including disabled users.
Topics of discussion will include:
- Tips for copywriting and hashtags.
- Strategic emoji usages.
- Best practices for writing alt text.
- Easy ways to captions videos.
Session attendees will:
- Understand the importance of accessibility.
- Discover easy ways to make their content more inclusive.
- Learn how to talk about accessibility best practices with key stakeholders and leadership.
Video
Transcript
Alexa Heinrich, presenter:
Hello and welcome to Now Trending: Accessibility and Social Media.
My name is Alexa Heinrich and I’m the Social Media Manager for St. Petersburg College in central Florida. I’m also an accidental expert on digital accessibility.
I previously worked for a large community college system in Chicago, where I was responsible for some of the digital assets on the district website in addition to social media. One day, the Digital Strategist on my team asked me if I was adding alt text to the web sliders on our homepage, and I had no idea what she was talking about.
After that, I started doing more research into what accessibility meant for digital platforms, specifically social media.
Because I was working for an academic institution, I hated the idea of my content being an obstacle to someone getting a college education and made it my mission to make the online world a more accessible place for everyone.
I’ve become quite well known for being an outspoken advocate for inclusive content. And it’s not uncommon for me to call up brands, organizations and even elected officials on Twitter if I notice them doing bad things with their social media.
But that’s enough about me. Let’s get started.
When it comes to accessibility, many digital marketers want to know what makes it important for social media and what it means to be inclusive online. Not everyone experiences or navigates digital spaces the same way. There are people with disabilities around the world who rely on assistive technology to access digital content. It’s important to keep in mind that disability isn’t black and white, but a full spectrum of possibilities. Someone could have a sensory disability that is permanent, such as blindness or hearing loss that cannot be medically treated or reversed. Their disability could be temporary due to an injury like a bruised eye or an illness such as losing your hearing from an ear infection. Or their disability is possibly situational, which means it’s affected by their environment or circumstances, like having trouble seeing a screen and different levels of lighting or hearing audio in a crowded room.
To give you a brief overview of assistive technology you may not be familiar with, there are screen readers which are software programs that allow blind and visually impaired users to read the text that is displayed on a screen with a speech synthesizer or Braille display. Speech synthesizers are text to speech systems used with computers that are programmed to include all the phonemes and grammatical rules of a language allowing words to be pronounced correctly. For example, a speech synthesizer is what allows a screen reader to know when to say they read a book versus they will read a book, since read and read are both spelled the same way. A Braille display provides access to information on a computer screen by electronically raising and lowering different combinations of pins and braille cells. This technology is crucial for people who are deaf blind because they cannot rely on their sight or hearing in digital spaces.
Then there are text the speech programs, which is technology that is used to change data into spoken words. Most smartphones now have text to speech programs built into them, turning a phone to a screen reader, which you’ll see here in a moment with my iPhone. The text to speech program for iPhones is called Voiceover, for Android devices you have TalkBack in the accessibility suite.
iPhone Voiceover:
Voiceover on. Settings. Voiceover. Apps, Twitter. Active. Twitter. Twitter, Alexa at Alexa Testing 123.
Alexa:
If you’re going to do a mass emoji tweet, at least stick to one emoji like this. Nine peach.
Alexa: There are three distinct reasons why you should be creating accessible social media content. Inclusive best practices can have a direct impact on your marketing efforts, and affect how many people you reach with their digital content. Like with a brick and mortar location or your website, you also want to make sure that your social media is meeting current accessibility guidelines. And most importantly, you should just care about the experience that your followers have when they engage with your brand on social media.
These are also the talking points you use when educating content stakeholders and brand leadership about the importance of including accessibility in your social media strategy and content creation process. When it comes to your marketing reach, keep in mind that roughly 466 million people worldwide have disabling hearing loss. And at least 2.2 billion people have a vision impairment or experience blindness, according to the World Health Organization. Collectively, that’s a huge portion of the global population that has a sensory disability. These numbers could also be much larger because not everyone is comfortable disclosing that they are disabled.
When you don’t create or publish accessible social media content, that means you’re potentially excluding a huge part of your audience from your messaging and missing out on important conversions, conversations and connections. If your social media content isn’t accessible, you could also leave yourself open to legal trouble. While most digital accessibility lawsuits focus on the websites of brands and companies as Domino’s Pizza experienced in 2019.
It’s not unrealistic to think that social media platforms and apps will soon face legal scrutiny as well. It’s best to be proactive when it comes to digital compliance. And marketers should reference the Web Content Accessibility Guidelines (WCAG) from the World Wide Web consortium (W3C) to make sure they’re meeting current standards for digital accessibility. These are the most universal set of standards we currently have for digital accessibility across the globe. Above all, you should be implementing accessability best practices because you care about your audience and removing barriers on social media.
Now that you know why you should be creating accessible social media content, it’s time to learn how. I’ll be focusing on three key areas of digital accessibility for social media:
Copy, images, and videos.
Our first section is accessible copy, and we’ll talk about hashtags, plain language, emojis, special characters and ASCII art.
When it comes to social media’s favorite conversation device, make sure to capitalize the first letter in each word of your compound hashtags. This method is sometimes referred to as Title Case, Pascal Case, and my personal favorite name for it, Camel Case. The capital letters in a compound hashtag can help screen readers to note the separate words, allowing them to pronounce compound hashtags correctly and not as one amalgamated word. Camel case is also easier for literally everyone to read.
Writing in plain language is another best practice you should be applying to your copywriting. It helps your audience understand your content more quickly and plain language is also easier for someone with a cognitive disorder to understand. Here are a few tips to help you get better at writing in plain language. Write for your audience. This should already be a basic instinct for any good digital marketer. Knowing your audience, the people who primarily engage with your social media, means knowing how to talk to them and using language they understand. Organize your information. This item pertains more to web pages and communications that contain more text than the average social media post, but it’s still a good tip to keep in mind, especially if you write longer posts for Facebook or LinkedIn.
Make your information easy to follow and understand. Break longer paragraphs, use bulleted lists when possible. I even found that at least two hard returns in a tweet help makes it easier to digest and more likely that users engage with it. Choose your words carefully. I know that as a marketer and a creative thinker, I am personally prone to flowery language. But that can actually be detrimental to my content if I’m choosing words that my audience may not necessarily understand. This goes back to our first plain language tip of writing for your audience. Sometimes simple is actually better. Be clear and concise.
Thankfully, most people who work in social media understand the power of concise content and have mastered the art of packing the most important information into very short posts. When in doubt, just get to the point. And keep it conversational.
Use an active voice when you’re creating content. And if your organization’s style guide allows it be more informal with your writing. Write content the way you would speak it.
Moving on to emoji, everyone loves them, but did you know that each individual icon has its own unique description assigned to it? When a screen reader comes across an emoji, it will use the emoji’s assigned description to accurately describe it to a user. Every emoji description is unique, and some are very specific, depending on the icon. Here you’ll see some icons and their hyper specific descriptions.
You have Bento Box, which I didn’t even know existed before making this presentation. There’s Love You Gesture, so not just the hand, but a specific gesture.
Next is an Evergreen Tree. There are several tree emojis in the emoji lexicon, but this one is specifically an evergreen tree.
And lastly, an Ear with Hearing Aid. Not just an ear, but an ear with hearing aid. Many emojis have descriptions and appearances that differ across platforms, devices and browsers.
This particular emoji is known as Abandoned House, Old house, Haunted house, and Derelict House.
Even emojis with skin tones get custom descriptions.
If a screen reader were to read this line of emojis, it would say raised fist, raised fist: light skin tone, raised fist: medium light skin tone, raised fist: medium skin tone, raised fist: medium dark skin tone, and raised fist:dark skin tone.
Keep in mind that because a screen reader picks up on the descriptions of emojis, the excessive use of them is not advised. It’s also worth noting that screen readers will often truncate a line of emojis if only specific icon is used consecutively.
For instance, this group of emojis would be read as twenty four rockets, instead of a screen reader trying to say the word rocket twenty four times.
It’s best to put emojis at the end of your content. Otherwise, you could make your message confusing, like with this example tweet.
Once the screen reader translated the emojis, the content ran into several clarity issues as shown by the bolded copy that indicates where the emojis used to be.
The translated tweet reads as: Having an amazing time on vacation in Colorado snowcapped mountain. Gonna get some prime skiing in tomorrow ski and ski boot before ending the day with hot cocoa hot beverage by the fire with my BFF beaming face with smiling eyes.
Doesn’t make a whole lot of sense.
An excellent resource for digital content creators who want to use emoji and smart and strategic ways is emojipedia.org. This website lists every known emoji along with their different appearances and descriptions across platforms, devices, and browsers. I personally have emojipedia saved as a quick shortcut on my web browser because I use it so frequently.
So when it comes to emoji on social media, you should use them in moderation; double check their description before using them; place them at the end of posts and tweets to avoid clarity issues; and resist changing the color on emojis with variable skin tones unless necessary for context. This last tip is for people who manage social media professionally. I would never presume to tell somebody what emoji skin tones they should use for their own identity on their personal social media.
Another best practice for icons is one that focuses on a trend often seen on Instagram and is especially popular with beauty and lifestyle bloggers. Content creators have started using external websites to generate fancy Unicode characters for their posts to make the copy appear in different weights, styles and fonts. Unfortunately, some assistive devices cannot decipher these characters and will typically skip over them, as shown in the first example tweet.
You can see that I use externally generated Unicode characters for the first three lines of text while the rest of the tweet is in the default font for Twitter.
iPhone Voiceover:
Alex at Alexa Testing 123, Unfortunately, screen readers cannot read these Unicode characters, making them inaccessible hashtag accessibility. Four minutes ago.
Alexa:
Even worse are the Unicode characters that screen readers translate into indistinguishable noises, like in this second example, tweet.
iPhone Voiceover:
Alexa at Alexa Testing 123, circled Latin capital letter S, :: inaudible speech ::
Alexa:
Well, I only showcase a few seconds of that tweet, it actually took almost two and a half minutes for my phone’s text to speech program to read the entire post aloud.
Content creators should only use the default fonts and formatting options available on the platforms.
Another popular trend on social media that involves the use of characters is called ASCII art.
It uses letters, numbers, punctuation and other characters to create illustrative memes and has been around for decades now. ASCII art is currently seeing a resurgence in popularity on social media as major brands try to appear relatable and hip with their followers.
However, ASCII art is not accessible for screen reader users. A screen reader is programmed to read characters and punctuation marks as they originally intended. They cannot properly discern when characters are used to create illustrations, and when read aloud,
ASCII art normally sounds something like this.
iPhone Voiceover:
Bullet underscore bullet. X. Bullet underscore bullet. Greater than reverse not sign black square. Black square. Reverse not sign black square underscore black square. Y.
Alexa:
So the art is cute, but it doesn’t make much sense once a screen reader gets a hold of it. Also, it should be noted that ASCII art formatting doesn’t always look the same across different devices and browsers. So you could create one thing on the web version of Twitter that looks completely different on the mobile version of Twitter.
This next section is typically the one that I get the most questions about: how to be accessible with images.
Images play a key part on social media, but how does someone with a serious vision disability experience a picture? Assisted devices and programs need alt text, a short physical summary of the image, in order to accurately describe it to a user. Alt text can be auto generated by some platforms, but Facebook, Twitter, Instagram, LinkedIn, and even now Pinterest all allow you to manually write alt text, which is preferred to AI generated alt text.
On Facebook, alt text can be added by clicking edit in the upper left corner of an image before posting it to your Facebook page profile or group and typing the alt text in the appropriate field. In this example, Facebook tried to generate automatic alt text for the uploaded image as seen above the custom alt text field. But the description of snow road and nature is rather vague and doesn’t make for a very descriptive or accurate alt text.
On the web version and mobile app of Twitter, along with TweetDeck, the alt text option appears with images as Add description or Plus alt. You can also add alt text to gifs on Twitter if you use their built-in gif library on the mobile and web versions of the platform.
Twitter is also the only social media platform right now that currently allows you to add alt text to your images in its story feature, which is called Fleets.
For Instagram, when you get to the final screen before publishing your post, tap Advanced Settings, scroll to accessibility, click Write Alt Text and then add your image description. If you have multiple images, there will be a slot for each image on that final screen.
LinkedIn has one of the easiest alt text features to find and use. As soon as you upload a picture to your LinkedIn post, add alt text appears as a button in the upper right hand corner of your image in the next window.
Alt text publishing capabilities vary across popular third party management sites, and unfortunately, none can currently post to Instagram with alt text due to API restrictions. However, if you’re looking to schedule Instagram post with alt text, you can do so through Facebook creator’s studio, if your Instagram is a creator or business account and linked to a published Facebook page.
Another workaround is simply writing your image description in the caption area of your post after writing what you would typically have for your caption. Here are a few tips for writing effective alt text, along with some examples.
Avoid flowery language. You should focus on describing the physical aspects of the picture and speak in plain language.
Resist the urge to be ornate or overly effusive with your descriptions.
For this image I wrote: a man and woman kiss. The man wears a tuxedo and the woman wears a white wedding dress and veil that swirls around them.
Keep your alt text relatively short. I normally make mine about the length of one tweet, but that’s also dependent on the image you choose. Writing all text is a completely subjective exercise and will vary image to image and creator to creator.
For this image I wrote, Ferris wheel lit up under a starry night sky at a carnival crowded with people.
Exclude picture of or image of. 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, or even a screenshot, you can include that in your alt text because it gives the user a better idea of how to visualize the image.
For this image I wrote small white puppy with floppy ears and wearing a green collar lies on a wooden deck outside.
Avoid posting images with flattened copy.
If you’re posting a copy heavy graphic or an image that has text overlaid on it, you’ll need to add all text for all the flattened copy.
If you drag your cursor over the text on image and it doesn’t highlight the individual words or characters, it’s not readable, which also means it’s not actionable because it cannot be clicked.
JPEG, PNG, and GIF files do not support readable text.
For this image I wrote: View of a man from behind. He stands atop a hill with his arms outstretched, looking over a green valley under a cloudy blue sky. Text over him reads freedom.
It’s OK 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 name it.
For this image I wrote: Mount Rushmore is shown under a hazy blue sky. The cliffside in front of it is dotted with evergreen trees.
Don’t feel like you need to describe everything. If something in the image is significant to understanding the whole picture or post, describe it. If it’s not, skip it and save your characters for the important stuff.
For this image I wrote: A busy intersection in New York City is filled with cars and people at night. Bright digital billboards cover the buildings.
You can include extra identifiers for people. If the race, gender, ethnicity, 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. Is that identifier contextually important? A prime example of a situation where extra identifiers are contextually important is the Black Lives Matter movement.
If you were to post pictures from a Black Lives Matter march or event, adding the race of the people in your images when you write all text would be important to understanding your content as a whole.
For this image I wrote: a black woman in a black T-shirt and sunglasses holds a sign over her head that reads: I can’t breathe.
Avoid acronyms, if possible. It’s better to type out the full name or title of a person, place, organization or initiative, because screenwriters don’t always read acronyms correctly. Lesser known acronyms also don’t add a lot of context to an image.
If you do use an acronym in your alt text, type out the full name or title first, and then place dashes, spaces, or periods in between each letter of the acronym so that the screen reader says it properly. This would be an instance where I would encourage people to test their content to see how a screen reader would say an acronym.
For this image I wrote: A group of about 20 people sit in rows of chairs at a session for the 2021 Higher Education Social Media (H E S M) Conference.
There are spaces in between each letter of the acronym H E S M.. Add your keywords for improved SEO.
This piece of advice is more for images on websites than social media. But it’s a good tip to keep in mind just in case search engines ever evolve to pick up alt text and social media images.
To my knowledge, they currently do not.
However, keywords and alt text on Instagram posts do supposedly affect search results within the app. Just make sure that you’re prioritizing the accurate description of your image first and foremost.
Alt text should always be treated as an accessibility feature and not an SEO growth hack.
For this image, I wrote: Man wearing black Chuck Taylor high top shoes, denim shorts, and a gray T-shirt sits on the side of a country road with his luggage while the sun sets behind him.
To recap our alt text best practices: Avoid flowery language. Keep your alt text relatively short. Exclude picture of or image of. Avoiding using images with flattened copy. Use proper nouns and names when appropriate. Don’t feel like you need to ascribe everything. Use extra identifiers for people when needed. Avoid acronyms, if possible. And add keywords for improved SEO.
And our final section will go over making videos accessible. No matter where a video is posted, whether that’s on a website or social media, it should contain captioning, sometimes called subtitles, so that deaf and hard of hearing users can access and enjoy the content. It’s also a well-known statistic that 85 percent of Internet users watch or begin watching videos with the sound off making captioning a good marketing move in addition to being an accessibility best practice.
Captioning can be closed or open. Closed captioning can be toggled on and off based on the preference of the viewer and is typically an option on platforms like Netflix, Hulu and YouTube. Open captioning, on the other hand, is permanently burned onto a video and always visible.
Open captioning is usually seen on apps like Tic-Tok and Instagram, where closed captioning isn’t readily available for all users yet. An easy way to add closed captioning to a video is to uploaded to YouTube as unlisted, which means it’s unsearchable, then give YouTube a little time to generate auto captions for it.
Once the auto captions have been created by YouTube, you can edit them in the subtitles tab in YouTube studio, so they’re accurate. After you’ve published your edited captions, YouTube will sync your timing and then you can switch your video to public.
The great part about creating your captions on YouTube is that you can also download the SRT captions file for your video and use it if you upload your video directly to Facebook, Twitter, LinkedIn or any other platform that supports uploading SRT files.
You can also write and sync your captions manually on YouTube, as well as Facebook. If you choose that option, make sure to break your captions up at natural language breaks for easy reading.
Allow time to read your captions since that’s the entire point at them. Include captions for any non-speaking sounds like a door slamming or a phone ringing. And identify when a new speaker starts talking. Open captions are the practical option for videos on Instagram and Tik-Tok, where closed captions aren’t readily available for all users yet.
They’re also a good choice for any platform features like Facebook Stories and Twitter Fleets.. There are several great captioning apps out there, including MixCaptions, Clipomatic, AutoCap, Kapwing, Clips, and Threads. Tik-Tok also has a unique text to speech feature where you can marry any text to add to your content within the app, as demonstrated here.
Tik-Tok Text to Speech reader:
Did you know Tik-Tok has a text to speech feature. Type your text and then press it. You’ll see a text to speech option that you can customize the timing of.
Alexa:
And finally, Live Streaming. When you host online events or do live streaming, consider using video services that have like captioning like Zoom or Google Meet or at the very least provide a full video transcript soon after your event ends. You can also hire an on camera interpreter for an additional level of accessibility.
But please be aware that just because someone is deaf or hard of hearing does not mean they know sign language. So an interpreter should not be hired in place of using captions.
Thanks again for watching today. If you have more questions for me after the session is over, you can find me at TheRealAlexa.com. I hope you come away feeling empowered and ready to make digital spaces and communications and come away feeling empowered and ready more inclusive for everyone.