Content / Social Media
Content Writing & Marketing for Accessibility
A big area of accessibility impact is in content:
Image Alt Text: Do the images have alt text that makes sense to users who cannot see the image?
Captioning: Do Videos, Podcasts have captioning available?
Readability: is the content easy to understand?
Headings: Is the content organized and “chunked” out into sections?
Links: Do links make sense on their own?
Lists: Are lists marked up properly?
Tables: Are there Table Headers and Rows available?
Images: Writing Meaningful alt-text
Through the screen-reader, the image alt text provides a description of the image to a user who is blind. Conveying the context, emotion and information contained in the image helps the user understand its purpose. Alt-text is not restricted to only the content pages but also important and useful for social media images.
A good alt-text is short and concise. Think of it like a tweet; pack as much as you can in as few words as you can. How would you describe this image?
Weak Example:
A man & laptop.
This is not descriptive enough to provide the context and information that this is a telemedicine appointment and he seems engaged.
Better Example:
A senior adult leans forward towards the laptop during his telemedicine virtual appointment.
As sighted users, we can see that a senior adult can be engaging and interactive during a telemedicine visit. So as content writers, we can communicate this through the alt text so that users who cannot see the screen gain that context.
For more, visit https://www.deque.com/blog/great-alt-text-introduction/
Adding Alt Text to Social Media Images
Although Facebook provides automatic alt text, it is essential that content creators check it for accuracy. You may see and edit the alt text for a photo before posting it by following these steps:
To see and edit alt text for a photo before you post it:
Click Photo/Video at the top of your News Feed.
Select the photo you want to add.
The automatically generated text will be shown on the left side of your photo. Click Override generated alt text to edit it.
Write your alt text in the box. To change back to the automatically generated text, click Clear.
To save your alt text, click Save in the bottom left.
To change the alt text of a photo after you've posted it:
Click the photo to open it.
Click Override generated alt text or change the alt text in the text box. You can also click Clear to change your edited alt text back to the automatically generated text.
Click Save.
How to add image descriptions in Tweets from twitter.com
Click on the Tweet compose button, or press the “n” key to use the keyboard shortcut.
Attach your photo(s). Note: For detailed instructions about adding photos to your Tweets, read this article.
To insert descriptive text, click Add description.
Type your description of the image and click the Done button. To edit the description, re-open the Add description dialog prior to posting the Tweet. (The limit is 1000 characters.)
You can add a description to each image in a Tweet. Note: Image descriptions cannot be added to videos.
Similar to Facebook, Instagram has automatic image recognition to provide a visual description of the photos.
To see and edit alt text for a photo before you post it on Instagram:
Start by taking a photo or uploading an existing photo to Instagram.
Tap Advanced Settings at the bottom of the screen.
Tap Write Alt Text.
To change the alt text of a photo after you've already posted it on Instagram:
Tap Edit.
Tap Edit Alt Text in the bottom right.
Closed Captioning: Updating or Adding Captions to YouTube Videos
Most videos uploaded to YouTube have automatic transcription. It’s important to check these videos for typos and any errors to be corrected. You may use the YouTube Editing Studio to make these in-line adjustments.
As another option, if you were part of the production of the video and the speakers read off of a script / teleprompter, you can upload this script to the YouTube Video in the Editing Studio and the software will automatically set the time codes.
If you go to your organization’s YouTube channel, you can identify which videos have an edited or uploaded caption track by the [cc] icon.
For further reading, visit the YouTube Support Page: https://support.google.com/youtube/answer/2734796?hl=en
Readability: Checking Content Reading Level
The Hemingway Editor App (https://hemingwayapp.com/) allows you to copy and paste sections of your existing content to provide guided suggestions for improved readability.
It is recommended that content not exceed a 6th grade reading level. Hemingway App also helps with ensuring content is in
active voice,
uses simple wording and phrases, and
readable sentence structures.
These measures help increase content readability, scannability and being able to get through content quickly.
Here is the link to the Hemingway Editor:
Headings
Think about a newspaper. Do you recall different sizes of headlines on the page? Does your eye get drawn to the bigger ones first, then the smaller ones? The most important stories have the biggest headline, effectively catching your attention. Then the “other” newsworthy articles have smaller headlines. Our brain is trained to consume information in this manner, so the same applies to writing for the web.
In structuring a page, content creators should organize headings and subheadings in order, taking care to not skip headings.
Links
Read through your copy and check that links make sense on their own. Can you look at the link by itself and understand exactly where it will take you? For example, “click here” vs. “Register”
SCREENSHOT
If you cannot, then update the link text to be more descriptive. This is important because screen-reader users may pull up a list of link shortcuts, which means that these users do not read the links within the context of surrounding text.
[SCREEN READER SCREENSHOT]
Clear links help everyone have confidence on what they’re clicking on, so wins all around!
There are exceptions to this recommendation. The “Learn More” links are appropriate on Homepage and Landing Page content teaser cards or hero cards because they may have additional context programmatically added to the link text for the screen-reader user.
[SCREENSHOT]
Lists
Check your content for lists. If any content in paragraphs aren’t broken out into list form, then break it up by using the bulleted list (unordered list) icon in the WYSIWYG. This helps users scan content quickly.
Check, also, that dashes or asterisks are not used to mimic a list. If so, please replace using the bulleted list functionality.
Tables
Last updated
