Usability & Web Accessibility – Social Media

Posted by Yale University | Date Accessed: August 16, 2022

Table of Contents

1. What
2. Why
3. How
   1. Keyboard Accessibility
   2. Autoplay
   3. Headings
   4. Images
   5. Animated GIFs
   6. Emojis & Emoticons
4. Alternative Options
   1. Provide Contact Information
   2. Repeat Content Across Platforms
   3. Suggest Alternatives to the Application
   4. Use Clear Language & Describe Actions
   5. Test Your Content
5. Platform Specific Guidance
   1. Facebook Accessibility
   2. Instagram
   3. LinkedIn
   4. Pinterest
   5. Twitter
   6. YouTube
6. Resources

What

Always address the accessibility of Social Media content and provide alternatives when necessary. This article provides guidance for accessibility on the following social media platforms: Facebook, Instagram, LinkedIn, Pinterest, Twitter, and YouTube.

Why

Social Media platforms are essentially websites containing user-generated content. There are roughly 3.4 billion active social media users around the world; users have on average 5.5 social media accounts each and spend at least 2 hours a day using social media, according to Pew Research Center(link is external).

Your social media accounts are likely one of many ways you share content and connect with your audience. The content you deliver via social media should be accessible. If you are not able to share accessible content on a social media because of limitations inherent to that platform, you should be prepared to provide alternatives.

How

Keyboard Accessibility

Many of the most commonly used social media platforms have accessibility issues inherent to the platforms themselves– issues that users of these platforms cannot fix. Keyboard traps, inaccessible right hand columns, absent keyboard focus indicators and incorrect keyboard focus orders are present to varying degrees in all of the social media platforms discussed in this article. Test your social media account with a keyboard to make sure the content you’re posting is accessible to users.

• See also, Focus & Keyboard Operability

Autoplay

Videos and other media should not automatically play on default. Users should have the ability to pause videos and other media. If media plays by default and this feature cannot be turned off, users should be made aware of this, e.g., “This video will automatically play in a new window.”

• See also, Animated, Moving, Scrolling, Flashing, or Changing Content & Sound

Headings

Heading structures in social media platforms may not be accessible. For example, of the social media platforms discussed in this article, only Facebook properly uses the H1 heading, and none of the platforms properly nest headings. Keep this in mind when adding your content.

Images

All images should have alternative  text, or alt-text, added. If alt-text is not available, describe images in the body of the post. You can add alt-text on Facebook, Instagram, LinkedIn, Twitter, and YouTube. You cannot add alt-text to images on Pinterest.

• See also Images for general guidance on creating alt-text.

Animated GIFs

There is very little support for animated GIFs on social media platforms. Do not rely solely on animated GIFs to convey content.

Emojis & Emoticons

Screen readers will read emojis appropriately, e.g., “clapping hands.” Do not overuse emojis and place a space between each one. Emoticons, or representations of expressions created through a variety of keystrokes, e.g., :), will be read as “semi-colon parenthesis” and should be used sparingly if at all.

Alternative Options

Until social media platforms comply with accessibility guidelines and fix issues on the back end, users posting content should consider the following workarounds.

Provide Contact Information

• Make sure your contact information is available on your social media account.
• Provide a link to the appropriate contact information if the full information cannot be posted.
• Provide contact details for Yale’s accessibility support group, much like you already provide accessibility statements on university webpages.

Repeat Content Across Platforms

• Make content you post on social media sites available on your university website, as well.
• Consider offering daily/weekly digests of information posted on social media sites.
• Post the same content on multiple platforms, e.g., a video in posted in your Instagram Stories, where captioning is not available, should also be posted on Facebook, where captioning is available; Images posted on Pinterest, where alt-text is not available, could also be posted on Twitter, where alt-text is available, etc.

Suggest Alternatives to the Application

• Provide links to the social media platform’s accessibility tips and support.
• Provide links to alternative apps and websites that create accessible interfaces for social media.

Use Clear Language & Describe Actions

• Use camel case in your hashtags, e.g., #ThisIsCamelCase.
• Avoid abbreviations.
• Use hashtags only as needed and at the end of posts.
• Avoid misspellings.
• If you link to inaccessible content on social media platforms, let the user know if it will auto-play, if there is no transcript or captions, etc.

Test Your Content

• Have someone with a disability test your social media content
• Hold it to WCAG 2 AA standards

Platform Specific Guidance

Facebook Accessibility

• Add alt-text to images (link is external).
• Add captions to your Facebook videos(link is external).
  • Alternatively, load videos to YouTube and add captions there, then link to the video in your posts.
  • Link to transcripts for videos if possible.
• Consult American Foundation for the Blind’s Facebook’s Accessibility Tips(link is external) to understand how users with disabilities might navigate through your content.
• Check the color contrast in your images if you are conveying textual information.
• Use camel case in your hashtags, e.g., #ThisIsCamelCase. Use hashtags only as needed and at the end of posts.
• Recommend alternatives to Facebook’s interface. These alternatives can sometimes provide more accessible experiences for people with disabilities.
  • m.facebook.com (offers a streamlined FB experience)
  • Facely HD on iOS(link is external)
  • G-Whizz! on Android(link is external)
  • Metal on Android(link is external)

Instagram Accessibility

• Add alt-text to images(link is external).
• Burn captions into your videos. Instagram does not support the addition of caption files to videos, so you should burn captions into video files using tools like Kapwing(link is external) (paid) or Handbrake(link is external) (free).
• Check the color contrast in your images if you are conveying textual information.
• Use camel case in your hashtags, e.g., #ThisIsCamelCase. Use hashtags only as needed and at the end of posts.
• Recommend alternatives to Instagram’s interface. These alternatives can sometimes provide more accessible experiences for people with disabilities.
  • Facely HD on iOS(link is external)
  • G-Whizz! on Android(link is external)

LinkedIn Accessibility

• Add alt-text to images. LinkedIn does not currently provide help documentation on adding alt-text to images. Accessibility advocates have provided step-by-step instructions(link is external) elsewhere online.
• Add captions to LinkedIn videos(link is external).
  • Link to transcripts for videos if possible.
• Make sure your profile photograph is clear and representative. People with Prosopagnosia (colloquially known as face blindness) may rely on your profile photo.
• Check the color contrast in your images if you are conveying textual information.
• Use camel case in your hashtags, e.g., #ThisIsCamelCase. Use hashtags only as needed and at the end of posts.
• Recommend alternatives to Instagram’s interface. These alternatives can sometimes provide more accessible experiences for people with disabilities.
  • Facely HD on iOS(link is external)
  • G-Whizz! on Android(link is external)

Pinterest Accessibility

• Identify your content, e.g. [PIC], [VIDEO], [AUDIO].
• Add a description to your Pin(link is external) when you create it. Pinterest does not support the addition of alt-text, but this is a workaround. If you are using a plug-in to Pin objects from a WordPress site, you may be able to add alt-text to images via that plug-in.
  • Alternatively, create a Pin by adding a URL(link is external) to an image that includes alt-text.
• Pinterest does not support the addition of videos directly to its platform. You can add videos by pinning links to videos on YouTube or other media players. Make sure those videos are captioned.
• Consult Pinterest’s Best Practices for Inclusive Product Design(link is external) for tips about accessibility options available in the platform, such as color contrast.
• Check the color contrast in your images if you are conveying textual information.
• Use camel case in your hashtags, e.g., #ThisIsCamelCase. Use hashtags only as needed and at the end of posts.
• Recommend alternatives to Pinterest’s interface. These alternatives can sometimes provide more accessible experiences for people with disabilities.
  • Facely HD on iOS(link is external)
  • G-Whizz! on Android(link is external)

Twitter Accessibility

• Add alt-text to images(link is external).
• Add subtitles to your Twitter videos(link is external). Twitter does not support closed captions.
  • Alternatively, load videos to YouTube and add captions there, then link to the video in your posts.
• Check the color contrast in your images if you are conveying textual information.
• Use camel case in your hashtags, e.g., #ThisIsCamelCase. Use hashtags only as needed and at the end of posts.
• Recommend alternatives to Twitter’s interface. These alternatives can sometimes provide more accessible experiences for people with disabilities.
  • EasyChirp(link is external)
  • Twitterific on iOS(link is external)
  • Metal on Android(link is external)

YouTube Accessibility

• Warn users of auto-play when posting links to videos hosted on YouTube.
• Caption your videos(link is external). Include a transcript or a link to a transcript where possible.
  • See also Multimedia and our Captioning Instructional Video: YouTube(link is external)
• Use YouTube with a screen reader(link is external) to understand how the experience might function for a person with a disability.
• Recommend alternatives to YouTube’s interface. These alternatives can sometimes provide more accessible experiences for people with disabilities.
  • Accessible YouTube(link is external)
  • Access YouTube(link is external)
• Host your videos on YouTube and play in an accessible player on your website.
  • OzPlayer(link is external) (most accessible option but paid).
  • AblePlayer(link is external) (less accessible option but free).

Resources

The slide deck from our Social Media Accessibility training(link is external) is available to the Yale community via Box.

For more information, visit the WCAG links (link is external)for this topic.

About This Article:

A Life Worth Living has copied the content of this article under fair use in order to preserve as a post in our resource library for preservation in accessible format.  Explicit permission pending.

Link to Original Article: https://usability.yale.edu/web-accessibility/articles/social-media