Accessibility Hub

 

site header

Social Media Accessibility - Facebook, Twitter, and YouTube

Download PDF version (99 KB)

This document is available in alternate formats upon request. Please contact the Accessibility Hub Coordinator.

Why make Social Media accessible?

Social Media is a useful tool for both instruction and promotion. It is changing how people interact with one another, gather information, and changing how business and governments share information and deliver services.

Social Media platforms such as Facebook, Twitter, and YouTube are not accessible on their own and may never be. Anyone using a screen reader often has difficulty navigating social media due to lack of headers, no keyboard shortcuts, no alternate text for images, poor colour contrast, and videos with no closed captioning.

Before using social media as a teaching tool, consider that some students with disabilities will not be able to effectively use it. There are tips and methods that improve accessibility for users but since social media platforms evolve constantly, these tips and methods can change frequently. If you are aware of a different tip to enhance the accessibility of social media, please contact  Andrew Ashby, Accessibility Hub Coordinator.

This document will look at Facebook, Twitter, and YouTube since they are the most popular social media platforms in academic settings.

Facebook | Twitter | YouTube

Facebook

Facebook is a popular social networking tool that allows users to create a personal profile, add other users as friends, exchange messages, and share information and media.

Accessibility Issues

  • Timeline layout does provide a logical reading order of top-to-bottom but can be difficult and confusing to navigate.
  • No alternative text on photos and pictures. Facebook does allow and recommends the profile owners to enter captions for photos they upload.
  • CAPTCHA during the sign-up process. Although there is an audio alternative but many users have reported that this does not work very well depending on which device or web browser is being used.
  • Facebook will change its layout frequently which makes remembering navigation difficult.

To its credit, Facebook has done a lot of work to improve accessibility of its sites and profiles. Facebook encourages feedback and has provided a page of information to improve accessibility.

[TOP]

Tips to Improve Facebook Accessibility

General Account Information

  • Ensure your website address is listed in the “About” section of your Timeline/Page in order to provide an easy point of entry to more information.
  • Include other ways to contact your organization, such as your department number with an extension, an online “Contact Us” form, or general contact email address for more information.

Photos, Video, and Audio

  • Provide a caption for any photo you post. On your Facebook page:
  • When creating a new album, add captions to your photos by going to the edit input field associated with a photo. Enter caption text. Repeat this step for all photos in the album.
  • When uploading a single photo, type a caption in the text field that will be used as a caption for the photo.
  • If the photo/video/audio is on your website you can provide a link back to the webpage that hosts a copy of the photo, video, or audio with full caption/transcript.
  • After posting the photo, video, or audio, immediately post a comment that directs users to the full caption or the full transcript.
  • If you have a YouTube channel, upload your video to your channel and make sure you enable closed-captions (you’ll want to upload your own transcript to make sure the captions are accurate). Then post a link to your YouTube video as your status update, rather than uploading the video into Facebook. This will ensure that visitors will be taken to your accessible version on YouTube.

[TOP]

Status Updates

Many Queen’s departments use acronyms. When only the acronym is used for the department name it can be confusing to screen readers. It is always best to use the full department name followed by the acronym in parentheses. For example: Health, Counselling, and Disability Services (HCDS). A screen reader will read the full name and the acronym so the user can associate the sound of the acronym with the department.

Other Tips

For some, using the mobile version of Facebook is a more accessible alternative. It is more basic in function and layout and uses html code making navigation easier.

There are also many apps for Facebook that can yield a more accessible experience. An example is the Facely HD app for Apple devices (iPhone, iPad, and iPod Touch) and works well with the VoiceOver screen reader built-in to Mac iOS.

Information on making your Facebook page more accessible

[TOP]

Twitter

Twitter is a popular social networking tool that allows users to send a short text-based message up to 140 characters long known as a ‘tweet’. These tweets are then published online to a profile page and can be publicly viewed. Twitter users can post their own tweets, follow the tweets of other profiles they follow or contribute to a wider online discussion based on a particular topic or event.

Accessibility Issues

  • No accessibility hotlink which lists the accessibility features of the site
  • Registration is done with a CAPTCHA system; audio option available however the link for it is small
  • Text resizing is locked
  • Links to complete certain tasks (ex. replying to a tweet, making a tweet a favourite and deleting a tweet) can only be activated using the mouse
  • The afore-mentioned commands only appear when you hover your mouse over a tweet

[TOP]

Tips to improve Twitter Accessibility

General Account Information

  • In the “Bio” section of your profile, include other ways to contact your organization, such as your department number with an extension, an online “Contact Us” form, or general contact email address for more information.
  • Ensure you have good colour contrast between the background, avatar, and bio information.

Photos, Video, and Audio

Put the following prefixes before tweets that have photos, videos, or audio. This allows people using screen readers to know what to expect before it’s read out loud. The uppercase formats are for further clarity to sighted users.

  • Photos: [PIC]
  • Videos: [VIDEO]
  • Audio: [AUDIO]

If your website has a full closed captioned video or transcript posted online, include a link back to the page.

Make your tweet serve as a descriptive caption so it has context for the item and then link back to your website if necessary.
[TOP]

Composing Tweets

  • Place any hashtags or @mentions at the end of the tweet. This allows a screen reader to voice the main content of the tweet more clearly in the beginning, and saving the service-specific speak for the end (the parts that sound confusing).
  • Avoid using unfamiliar acronyms or “text-speak” that would sound strange if read by a screen reader. If space allows, try to spell out the acronyms or use full words to better convey the information.
  • Use "CamelCase" for multiple words for hashtags; that is, capitalize the first letters of compound words (e.g. use #QueensUniversity not #queensuniversity).
  • If your phone has built-in text-to-speech (VoiceOver for iPhone) or a text-to-speech app, try listening to your tweet prior to distribution so you know how your message would be conveyed to a person who is blind.

Displaying Tweets in a Widget

If you’re Twitter Feed is displayed on a website through a widget try using the Twitter API or Embedded Timelines feature to display your tweets on your website.

Embedding a Tweet on your website or blog

[TOP]

Other Tips

For some, using the mobile version of Twitter is a more accessible alternative. It is more basic in function and layout and makes navigation easier.

There are also many apps for Twitter that can yield a more accessible experience. Plume for Android devices and Easy Chirp: an accessible alternative to Twitter. This website operates in a similar way to the main Twitter website but provides a more consistent layout, good keyboard navigation and better support for assistive technologies such as screen readers.

[TOP]

YouTube

YouTube is a popular video sharing website. It contains a variety of user-generated videos. YouTube also has a range of professionally created content including clips from television shows and commercials, movie clips and music videos. Users who visit the YouTube website can view these videos, but only people who have registered accounts may upload videos online.

Accessibility Issues

  • Registration is done with a CAPTCHA system and may be difficult to use with persons who are blind or low vision.
  • Lack of keyboard controls for the interface of the video player
  • Lack of closed captioning or described video.
  • If the closed captions are not supplied by the account owner, YouTube’s provides machine-generated captions automatically and may be inaccurate.

[TOP]

Tips to improve YouTube Accessibility

When using a Screen Reader

As previously mentioned, screen reader users may have difficulty using the player interface due to lack of keyboard shortcuts. A way around this to use an alternate viewing portal that has accessible player controls. For example:

YouTube also provides instructions on Using YouTube with a screen reader.

Creating Closed Captions

As mentioned, YouTube can create machine-generated captions automatically. However, the resulting captions may be inaccurate. It is best to create your own or out-source.

YouTube: Add captions

The basic steps in captioning YouTube video are:

  1. Get a transcript
  2. Editing/Synchronize the transcript with the video
  3. Upload the caption file.

These steps are outlined in detail in the Accessibility Hub’s How-to Guide – Video Accessibility.

[TOP]

Resources

External Resources

[TOP]