Best Practices for Inclusive Design – Part 2

Part Two: Inclusive Design and Accessibility

In part one of this series, we defined the concept and practice of inclusive design and its relationship to digital accessibility for people with disabilities. This article provides practical advice on creating inclusive digital content that provides the best experience for people with disabilities (and other groups too).

Even more, these best practices don’t rely on a knowledge of coding, only a commitment to accessibility.

How to Make Text Content Accessible

Text is one of the most fundamental types of content on the web. The good news is that assistive technologies like screen readers work well with text, and text can be adapted to make it easier for people to read. But the text content you produce does need attention with an accessibility perspective.

Use these tips to make text accessible:

• Use plain language that is appropriate to your target audience. That includes language that is clear and concise, avoiding unnecessary use of technical jargon. This is particularly important for people with reading disabilities such as dyslexia, and people with broader cognitive disabilities. It also helps people learning to read or who are less fluent in the text’s language. At the same time, don’t make the content too simple, which could potentially patronize your target audience. Use these guidelines for reference.
• Use inclusive language, especially when talking about disability. Avoid using ableist terms – use this guide as a reference.
• Structure your content using headings, paragraphs, lists, tables, and other navigational elements. This helps users understand what information is present and how that information is organized. The structure is also extremely useful to screen reader users, who use these structural elements to navigate through a page by specific content types, like headings.
• Support resizing of text so that users with low vision can increase the magnification, sometimes up to 200%.
• Choose a readable typeface. This is a bit of a murky area, so in general, avoid justified texts and italics and lean towards sensory typefaces and larger font sizes with plenty of line and paragraph spacing.
• Make sure there’s enough contrast between text and its background so that people with low vision or who are colorblind can distinguish text from background colors.
  • TPGi’s Color Contrast Analyzer can help with this.

How to Make Images Accessible

For many people, images can communicate some types of information more effectively than text, so don’t assume that “accessible” means “only text”. But when you do use images, make sure that those images don’t introduce additional barriers:

• Avoid using images of text (logos are an exception). Actual text won’t become pixelated when it’s zoomed in. It also loads faster than an image and is easier to translate.
• How you use an image dictates what type of alternate text is required: If an image forms part of the content, such as an image or a chart in a news article, you should include a succinct description of the information provided by the image. This is called alternate text (alt text).
  • If an image is used for formatting purposes or as a background image, it should be marked as decorative so that screen readers will ignore it.
  • If an image is interactive, such as a button, the alt text should describe the functionality, not the image.
  • If you have a play button, don’t describe it as a “black triangle pointing right.” Instead, describe it with the function it provides: “play.”

How to Make Video Accessible

Video can be a very inclusive way to communicate with your audience, including people who learn from demonstrations and who may have cognitive issues that affect concentration and text processing. If you’re producing a video, or selecting a video to publish online, the following checks help make sure those videos are accessible to disabled people.

• Make sure the video has captions – synchronized text that presents what people in the video say, along with any additional sound that is important to understanding the video. Tools like YouTube have features to help you create caption files, including the ability to edit automatically generated captions. However, don’t rely on auto-generated captions alone, as they can often contain errors that may distort what people say.
• If you’re producing or writing the script for a video, encourage speakers to describe what’s going on visually so that someone who is blind can understand the video.
• For situations where video has substantial visual content that isn’t obvious from the dialog, you will need to consider options to make that content accessible to people who can’t see it. Audio descriptions are additional spoken content that complements the video soundtrack, providing descriptions of visual events important to understanding the video. An alternative option is to provide a descriptive transcript, which is a text version of the video’s dialog along with text descriptions of key visual events.

How to Make Forms Accessible

If you are creating forms, make sure the form is designed with accessibility in mind. Forms are essential for many online interactions. However, not all forms are easy to use, especially for people with disabilities. Form accessibility is important for users and your business.

• Provide a visible label for each form field that explains what data is needed in each field.
• Indicate any required input fields visually.
• Use appropriate input elements for the data you’re collecting. If you have a question that requires users to choose a single option, use a radio button. If they need to choose multiple options, use checkboxes.
• Error messages must clearly indicate where the error occurs and what users can do to fix the error.

Beyond accessibility, forms are one area where inclusive design can help avoid creating barriers for some groups.

First, before adding a field that asks for data from a user, evaluate if you really need that data. If there’s no clear reason for using that data, then save your and the users’ effort by not asking for it. Second, make sure that you provide users with options to answer questions in their own way. For example, if you must collect gender information, give people options to provide the gender they identify with. Third, try to make sure that form fields don’t make assumptions about personal names and other data.

How to Make Digital Documents Accessible

Accessibility doesn’t stop with web content. There are a few things you can do to make sure digital documents like Microsoft Word documents, PowerPoint presentations, and PDFs don’t contain accessibility barriers.

• Keep layouts as simple as possible. Complex layouts can make it hard for screen readers to infer the correct order to read out content.
• Use styles to identify headings, lists, and table captions. Don’t rely on visual styling to turn text into headings.
• Take advantage of the Microsoft Office automated Accessibility Checker, which can be found under the Review tab in Word and PowerPoint. It not only highlights some potential issues in your documents, but it can also give helpful advice on how to fix them.
  • Note: We recommend not relying on Microsoft Office AI to generate text alternatives. Currently, this feature doesn’t work very well, and you’ll likely have to edit whatever is generated for it to be meaningful.
• One reliable way to create an accessible PDF is to export an already accessible document as a PDF from a well-structured Microsoft Word document.

How to Make Social Media Accessible

Even if your organization is making great strides in web content accessibility, remember to include social media in your accessibility efforts.

Some social media platforms have better support for accessibility than others. Always check the documentation the platforms provide and take advantage of any accessibility features on the platform, like adding alternative text for images you share.

Additionally, sharing third-party content can create a reputational risk and an accessibility risk. Review the content you want to share and take steps to address any barriers, such as writing your own alt text for images. Also, consider reaching out to third-party content creators to ask for accessibility improvements and for documentation for accessibility efforts.

Avoid some of these common social media accessibility pitfalls with these best practices:

• Be wary of sharing animated content, which can be distracting for some people, especially if there is no way to pause or stop the animation.
• Avoid overuse of emojis. Emojis can be interpreted accurately by screen readers, but using multiple emojis in a single post or repeating a bunch of emojis can distort the meaning of content when read aloud by screen readers. The screen reader will repeat the description of the emoji over and over.
• Use CamelCase for hashtags. This means starting each new word with a capital letter (e.g., #CamelCase vs. #camelcase). This tells screen readers to read each word separately instead of trying to mash words together.

Conclusion

Employ these best practices and remember that a deliberate focus on accessibility through inclusive design will help you create better user experiences for more people.

Learn more about inclusive design:

• On-Demand Webinar: A Beginner’s Guide to Inclusive UX Design

Additional resources:

• Connecting UX With Digital Accessibility Strategy
• Universal Design and Digital Accessibility
• Inclusive Design Principles

This article was originally published on the TPGi website.