R

Recording: A primer on social media accessibility

Did you miss this digital event on social media accessibility? We recorded it just for you.

Independent designer Jessica Oddi walked through foundational best practices for making sure your social media and design work meets accessibility standards. Find the full recording followed by highlights below.

The following highlights were pulled from Jessica Oddi’s presentation for our workshop. You may access the full slideshow here, which includes more resources and guides on bringing accessibility practices into your creative process.

Color Contrast

  1. What is the purpose for each color? Be intentional about how you’re using colors to convey meaning.
  2. Find the contrast balance. Minimum 4.5:1 for text, and 3:1 for graphics.
  3. How does it look greyscale? This will help you measure the accessibility in your color contrasts.
  4. MAKE RULES! Outline the purpose of the color pairings so clients know when and how to use them together.

Typography

  1. Use larger fonts.
  2. Minimum line height 1.5x, paragraph spacing 2x, letter spacing 0.12x, word spacing 0.16x.
  3. Left aligned is most readable.
  4. Check typefaces by comparing certain characters.

Image Descriptions

Image descriptions provide context to visuals. For blind/low vision, and processing easier by reading.

  1. Put it in the captions not comments. Comments can easily get lost!
  2. Never assume race or gender.
  3. Focus on the purpose of the visual.
  4. Type out all text.
  5. Keep freaking practicing! Try out with a few sample visuals to get the hang of image descriptions.

Alt Text for Social Media Accessibility

Alt text is embedded in the code of an image and provides textual context if images don’t load or are broken. Alt text is vital for screen readers.

PRO TIP! Don’t copy and paste the image descriptions. Screen readers will read the same thing twice. Specifically for adding Alt Text to Instagram:

  1. Advanced Settings
  2. Accessibility: Write Alt Text (This is all the way at the bottom!)
  3. Alt Text Input Window

Captioning and Transcripts

Captions are more than subtitles. They provide context for audio elements including sounds and added audio descriptions of the setting. Manual captioning is preferred over auto-generated.

Transcripts are similar to the document that was sent out for this presentation. On social media I provide them in the caption. Mabely Q has Accessibility Resources for captioning and transcripts.

Accessible Writing and Hashtags

Be concise with your words. I use apps like Hemingway Editor to check the reading level of my work. This helps to use less idioms, or passive text.

For hashtags, capitalize the first letter of each word. This will allow screen-readers to differentiate each word. It is also makes it easier to read in general.Good: #JessicaOddi / Bad: #jessicaoddi