What is accessible content?
Accessible content is content that helps allow every person—including those with visual or audio disabilities—to understand it There are several ways web design teams can adjust content to make it more user-friendly for these individuals, but the ultimate goal is to make websites easier to understand for all who visit them.
Picture your favorite emoji or the last photo you posted on social media. Those thoughts conjure images, but for some, casual emoji use or an embedded picture results in a different experience.
Welcome to the life of someone who relies on screen readers to navigate the digital world.
Screen readers help users that are blind, low-vision, or have reading disabilities experience digital content by speaking the content aloud to them. But when they come to an image, emoji, or meme, screen readers read the file name instead of describing the image. All too often, the file name is a random string of digits or a nonsense phrase, resulting in a poor user experience.
Fortunately, there’s a solution. In fact, there are a variety of practices that anyone can begin using right away to improve the experience of people who are blind, deaf, low vision, or color blind.
Here are seven accessible content best practices so we can all do our part in increasing accessibility—creating a more inclusive environment for everyone.
7 ways to make your content accessible
1. Write meaningful alternative (alt) text
One of the most common accessibility errors on the web is the lack of image alt text.
Alt text is a short description of an image for people who use screen readers or other assistive technology, or who have slow internet access. Before posting an image, take the intentional step of adding a description of the image. Doing this makes images and their intent understandable to a broader audience.
Think of alt text this way: If an image failed to load and you couldn’t see it, what text would make sense in its place? What does that image represent? What is its specific purpose for being there?
Alt text should be clear and concise so readers can visualize the content without seeing it. For example, alt text that says “Teenage boy wearing a red t-shirt and jeans looks at job ads on a laptop” conveys more purpose and emotion than “Boy sitting at computer.”
We’re all responsible for adding alt text to images, icons, and other visual media, whether it’s in a document, social media post, emails, or website. You don’t have to be an engineer or a designer to do this. All you have to do is add appropriate alt text to turn any image into accessible web content.
If an image is purely decorative, you don’t need alt text. Just define the image as decorative for developers, who will leave the alt attribute empty (alt=“”). A screen reader will skip the blank tag.
2. Use accessible content design
Intuit’s content design website is a great resource for best practices to ensure our products and experiences are accessible to all.
The site describes four principles that underpin Intuit’s accessibility guidelines. They spell out the acronym POUR—Perceivable, Operable, Understandable, Robust.
- Perceivable. If there’s anything in our product or on our site that a blind, deaf, low-vision, or color-blind person can’t perceive, do what you can to remedy it. For example, make sure videos have captions, and create text alternatives for charts and graphs. Don’t refer to color, or where elements are located on a screen. And if text is meant to be read, don’t put it in an image.
- Operable. Make sure interactions and targets are well separated and easy to hit, and don’t make screens overly dense.
- Understandable. Make content readable and easy to listen to. Remember that when someone is using a screen reader, the content is spoken aloud. Aim for 5th to 8th grade readability to keep sentences simple. And use headings, subheadings, and bullet points to make content easy to scan.
- Robust. Make sure things work well across platforms, browsers, and devices.
3. Consider color and contrast
Color-blind and low-vision users need lots of contrast between background and text. Some people use screen magnifiers, and others prefer to zoom or enlarge text to make it easier to read.
When creating slides or other visuals, check your contrast. Is there enough contrast between foreground text and background color? Make sure linked text stands out from body text and include icons with text for clarity.
Typically, an accessible content color palette begins by selecting a color, checking its contrast against a background, and then modifying the value to meet contrast ratios.
4. Don’t forget about accessibility in a hybrid work environment
For remote workers, video meetings present their own set of accessibility challenges.
For example, imagine being hearing impaired and trying to lip-read in a video meeting where multiple participants are talking at once or have their cameras turned off.
You can also be part of the solution. Be prepared to help a deaf or hard-of-hearing colleague by using a whiteboard solution to explain or clarify content in a meeting, or by offering to provide clarification and fill in gaps via chat.
Interested in learning more? Check out our blog, 3 ways Intuit helped me make my word accessible to find out how one Intuit software engineer solved communication speed bumps in hybrid settings.
When it comes to accessible content, the bottom line is this: All our users need to be able to process what’s on the screen.
5. Write meaningful link copy
Assistive technology allows users to pull up links in a list, separate from other web page elements. The list is much easier for blind or low-vision users to navigate, but it needs its own context since it exists separately from the rest of a webpage.
To create that context, developers and designers must focus on writing meaningful link text. Links that say “Learn More” or “Click Here” may be good calls to action, but they aren’t very helpful out of context. From an accessibility standpoint, a user reading that link would have no idea what to expect upon clicking.
Make sure the link text you use provides context. It should explain what users can expect to see upon clicking. You may need to rearrange or rephrase a paragraph to include a more informative link, but the accessibility benefits are worth the extra effort.
6. Provide captions in videos
When creating accessible video content, what should you consider including? Captions are one of the most essential elements to consider. These scrolling lines of text help individuals who are deaf or hard-of-hearing access content they otherwise wouldn’t be able to understand.
But providing captions also has other benefits. Even users who can hear fine can benefit from captions if they’re viewing content in a loud environment. In fact, most short-form videos on social media today have captions so they can be consumed without audio—to benefit people watching in a public place. Captioning also allows search engines to better index your content for search engine optimization (SEO) purposes.
Certain platforms have native captioning functions that allow you to add captions to your videos as you upload them. On other platforms, you may need to use third-party software or hire a freelancer to use software to apply captions to your video content.
7. Structure your content
Readability is essential for any content, especially accessible content. An effective best practice for making content more readable is content structuring.
Web designers structure content by using header and sub-header tags to create a hierarchy to their text. Not only does this make content easily digestible for users, but it also makes it easier for search engines to crawl the content on your website.
Clear headings make it easier for users to quickly scan your content and locate the information they need, which improves the overall user experience. As you design content for a particular page, break up larger sections with subheadings and use bulleted or numbered lists whenever possible. Put yourself in the reader’s shoes, and your design elements should fall into place accordingly.
Accessible content FAQs
What is accessible content and why is it important?
Accessible content is digital content that includes all users, especially those with low vision or who are hard of hearing. Content structure and layout allow all users to consume and understand your site’s message and elements. This includes videos, links, images, and more.
How can I ensure my web content is accessible?
Some steps you can take to ensure your content is accessible are:
- Adding informative alt text to images
- Allowing users to enlarge font sizes
- Providing captions for videos
- Giving webpage sections and text proper spacing
- Use color contrast to your advantage
What should I include when creating accessible video content?
When creating accessible video content, web designers need to include captions. These allow deaf and hard-of-hearing users to access your videos and may also provide other added benefits.
Help be part of the solution
Don’t assume it’s someone else’s job to produce accessible content. It’s up to each and every one of us to be part of the change to build a more inclusive world every day.