Making Graphics Accessible Content Creators Guide

From communicating to keeping up with news, social media is more important to us than ever. It’s also become one of our main sources of entertainment. This has made digital content creation an increasingly popular career choice.

It was reported that nearly 30% of children in the US want to have a YouTube or vlogging career when they grow up. And honestly, they might just have the right idea! By 2030, the global digital content creation market is predicted to reach $181 billion.

Content creation has high-earning potential if you have a big audience. So, it’s a good idea to make your content available to as many people as possible. However, many creators continue to cut off people with disabilities from their content. This is terrible business sense, as well as being morally wrong.

Over 15% of the global population has a disability. Inaccessible content instantly blocks off this massive potential audience. It also deprives these users of accessing the content they need or that interests them. Overall, it’s a lose-lose situation.

It can be difficult to know how to make graphics accessible. Even more so because this area doesn’t get enough attention. That’s where we come in. Here are some top tips to make sure your graphics can be enjoyed by everyone. This guide covers any graphic content, including photos, that would usually be found on an image-based social media. This includes apps like Instagram, Pinterest, etc.

Use Alt-Text

The best thing you can do to make graphics more accessible is to add alt-text. This is a short piece of copy that describes an image on a webpage when it fails to load. More commonly, screen readers use it to depict images to users with visual impairments.

Good alt-text should be short yet descriptive. Include all the important details but be straight to the point. Leave your captions for all the little things!

All major social media platforms have an alt-text feature. Note that some platforms have story features that do not support alt-text. This means story features can be inaccessible. Never post important information there that you can’t find elsewhere.

How to Add Alt-Text (From iOS Apps)

Instagram:

• Begin creating post as normal
• Press Advanced Settings on the New Post page
• Scroll down to Accessibility
• Press Write Alt-text
• Write description and click done

Pinterest:

• Click Create Pin on the bottom bar
• Select image and click next
• Scroll down to Alt-text on the Create Pin page
• Enter description and click next

Facebook:

• Click What’s On Your Mind at the top of page
• Press Photo/Video and select chosen image
• Press white ellipses on top left-hand side of image
• Select Edit Alt-text from menu
• Add description and press done

Twitter:

• Press Compose Tweet button on bottom right-hand corner
• Select desired photo
• Press white +ALT button on bottom right-hand side of image
• Write your alt-text and hit done

LinkedIn:

• Press Post button at the bottom of the home page
• Click Add Photo, then select photo, and press the add button
• Press the ALT button at bottom right-hand side of photo
• Add description and press done

Make Colors Pop

Around 300 million people are color-blind. Yet color is often overlooked in web accessibility. Poor use of color can prevent people from perceiving important information.

The first step to using color well is to increase color contrast. Ample contrast helps make your content more visible. WCAG guidelines state you should have a minimum text-to-background contrast ratio of 4.5:1.

People often use black and white as they have the largest contrast. However, this can be difficult to read due to its starkness. People with dyslexia may find this combination particularly problematic. Dark text on a pastel background is a dyslexia-friendly combo which causes less eye strain. If you prefer the black and white look, then make sure both are off-tone. Use cream-white and grey-black instead.

Always avoid complementary colors on top of each other. This includes combos like red and green or blue and yellow. These are highly inaccessible for people with color blindness. Plus, most people find these difficult to read as they vibrate and lack clarity.

Never use color by itself to represent something. Always add a text description alongside it. Many people with color blindness are unable to differentiate colors. This means color indicators don’t end up conveying their intended info. If you’re making infographics, you can use basic patterns instead of colors to differentiate data. However, always be sure to label these as well.

Know Where to Draw the Line

A lot of accessibility is just going back to the basics. The simpler a graphic is, the easier it is to identify.

It can be tempting to over-edit your photos, particularly if you’re going for a certain aesthetic. However, this can make the photo inaccessible. Keep editing on the simple side. Make sure your photo is high resolution with clear colors. There should be a good contrast between shadows and highlights.

Stick to simple designs for graphics and illustrations. It’s best to have a single focal point on a plain background. Use strong lines, shapes, and colors. There’s no need to over-complicate minor details. Simplicity is just as effective.

You also need to think about inclusivity. Are your illustrations and photos representative of your whole community? Inclusive graphics reflect the diversity of the world we live in. This includes people of different shapes, ethnicities, genders, and sexualities. This also means including people with different disabilities. It’s important that everyone gets to see themselves represented!

If You’ve Got It, Font It!

A font can make or break how accessible your graphics are going to be. Be sure to choose a clear font that contrasts with the background. The text and background should both be solid colors. Keep everything minimal. This is often the most striking option, so no aesthetics compromised here.

Always use the standard font provided when writing on your social media. Some websites offer ‘cool’ fonts which you can copy and paste. Many of these are actually mathematical symbols or foreign language letters. This is terrible for screen readers and can be confusing to read. Steer clear of these.

Captions in Action

Many people with vision impairment rely on screen readers to interpret images. Alt-text is pretty basic, so you should use your captions to add personality to your content.

What is your image trying to convey and how can you put this into words? Unlike alt-text, you can include as many frivolous details as you like. The more context, the better! This helps your post stick out. Captions can build a connection by letting your followers get to know you.

Treat your captions like a mini letter to your audience. Write in clear and concise sentences. This prevents you from going over the character limit and is easier to read. It’s best to avoid symbols, hashtags, and emojis mid-sentence as they can be confusing. Good things come in small doses. Only use a couple of each and keep them at the end of your caption.

Use Camel Case for any hashtags. This is when you capitalize the first letter of every new word. This is easier to read and helps screen readers figure out where new words begin. For example, use #AccessibilityForAll instead of #accessibilityforall.