Web accessibility is the inclusive practice of building websites that everyone can use, including the 1.3 billion people in the world who have a disability. Organizations stand to gain many advantages from ensuring web accessibility, and every team member has a role to play.
This article shares actionable best practices for anyone involved in the creation and distribution of digital content. It’s based on ‘Creating Accessible Content in Drupal 10’, a session I delivered at the 2023 Drupal GovCon in Bethesda, Maryland, US.
Read on for tips to build accessibility considerations into the foundations of your content lifecycle!
Whose Job is Web Accessibility Anyway?
The responsibility for web accessibility should be shared among various team members within an organization. This allows for greater scalability and sustainability than if it rests solely with one accessibility expert.
Everyone has a part to play—especially marketers, content editors, designers, web developers, social media experts, and managers. Together, these team members can ensure that accessibility best practices are followed at every stage of the content lifecycle.
It’s also important not to leave the job up to technology. Accessibility tools can be a great way to identify areas for improvement. But they need to be accompanied by a culture of prioritizing and implementing the solutions.
Building Accessibility into the Content Lifecycle
There are four principles of accessibility that we need to consider throughout the content lifecycle:
- Perceivable – is the content available to users via sight, hearing, and touch?
- Understandable – is it readable and predictable, with clear labels and instructions?
- Operable – is it keyboard-accessible, navigable, and compatible with different input methods?
- Robust – does it work with a variety of assistive technologies, browsers, and devices?
Assistive technologies are products or systems that help people with disabilities to do tasks that would otherwise be very difficult or impossible. Common assistive technologies include:
- Keyboards – keys can be used to navigate content and input commands
- Screen readers – convert text, links, images, and other digital elements into speech
- Screen magnifiers – can make elements on a screen bigger
- Head wands and mouth sticks – respond to head, mouth or chin movements to allow users to control their keyboard and cursor
- Refreshable braille displays – convert information into braille by electronically raising and lowering different combinations of pins
Next, let’s look at how to build accessibility principles into each stage of the content lifecycle. This lifecycle may look different from organization to organization, but I’ve covered seven common stages:
- Create the content brief
- Write & approve content
- Select images & media
- Add content to website
- Apply a style guide
- Create a PDF
- Create social media posts
1. Create the Content Brief
Whether you’re briefing internal writers or freelancers, make sure accessibility is considered from the outset. Aspects of the creative brief that affect accessibility include:
- Title – choose a meaningful title that provides a clear idea of what the page is about. Remember that the title will also often be reused as link text, alt text, and so on.
- Media – think about whether images need to include text and whether you can provide adequate descriptions in the alt text. Videos will need subtitles.
- Audience and readability level – aim for a reading level less than Grade 8 for public websites.
- Templates or style guides - these can be really helpful if they’ve been designed with accessibility principles in mind.
2. Write and Approve Content
Write for lower reading levels and follow plain language principles to make your content accessible to a wider audience. Use simple words, remove jargon, spell out acronyms, and keep sentences and paragraphs short. Even people with a higher reading level prefer it when they don't have to use brain power to understand complicated content. If you have a public website you should aim for a reading level below Grade 8. You can check the reading level of your content using a tool such as Word or the Readable app.
Meaningful headings and a clear page structure will make content easier to scan. Around 69% of people who use screen readers use headings to find information on a lengthy web page. Don’t skip heading levels (H1, H2, H3, etc) as this makes it difficult for screen readers to correctly interpret the structure.
Screen readers can also bring up a list of links on a page to help users navigate content. So it’s important to use descriptive, specific link text such as “2023 annual report” or “see our job vacancies”. Avoid generic link text such as “read more” or “click here”. You should also indicate if you’re linking to a downloadable file such as a PDF.
3. Select Images and Media
Written content is often supported with images, videos, and other media. These are usually chosen while the content is being written or just after.
Consider what you want to communicate with images. Are they there simply to set the mood, or are you trying to explain complex concepts or illustrate data? Text in images should be avoided where possible. When it can’t be avoided—such as in the case of diagrams or graphs—make sure you provide meaningful alt text and captions.
Alt text is read out to people who use screen readers. Write something that communicates the key message you want to convey with the image, not just a description of what it looks like. It’s ok to leave the alt text blank if the image is purely decorative. Finally, keep it concise!
Captions are important for users who struggle to see text in images but who don’t use a screen reader. For example, captions may be more easily enlarged for those using screen magnifiers or text resizing apps. Like alt text, captions should be meaningful and short.
Videos need subtitles to be accessible. YouTube provides auto-captioning of your videos, but you should check and edit these captions to improve the usability.
4. Add Content to the Website
Content is often written outside the website using a tool such as Word or Google Docs. When it’s ready and approved, it’s handed off to someone who’ll upload it to the website.
Many accessibility issues can arise when content is formatted using a WYSIWYG editor. Sites should ideally have locked-down permissions and pre-built components to minimize human error. Anyone who uploads content should be trained in accessibility considerations, such as adding alt text to images and nesting headings correctly.
Accessibility testing tools are a helpful way to catch errors and issues before content is published. There are paid options such as automating your accessibility audits with DubBot. If you want a free tool I’d recommend Editoria11y, a well-maintained Drupal contributed module. It’s great for content editors because it only shows them the problems that they have the power to fix, not issues that must be handled by developers or designers.
5. Apply a Style Guide
Your digital style guide determines the look and feel of every element on your website. Accessibility considerations should be built into it. Ideally, the style guide is applied at the theme level so that content editors don’t even have to think about it. This is one of the biggest benefits of creating components, such as blocks or paragraphs.
Your style guide should include:
- An accessible color palette, including combinations that allow for the correct contrast levels
- Clear guidelines for content editors who have the skills and permissions to be a bit more creative when building pages
- Rules for styling navigation and controls, including links, menus, and interactive features
6. Create a PDF
Generally we want to avoid PDFs, as 75% of people who use screen readers say that they pose a significant challenge. If creating a PDF is unavoidable, here are some ways to make your PDF more accessible:
- Follow all the same rules that apply to web content about structure, reading level, headings, and links
- Export to PDF instead if printing to PDF
- Use a testing tools such as the Accessibility Checker in Acrobat Pro
7. Create Social Media Content
Once you’ve created your content you’ll probably want to promote it on social media platforms such as LinkedIn, Instagram, and X. Make sure your accessibility standards don’t fall at the last hurdle:
- Keep posts short and simple
- Don’t go overboard with emojis
- Add alt text for images
- Create clear calls to action
- Use title case for your hashtags (e.g. #WebAccessibility not #webaccessibility) so that screen readers know where words end and start
Download our Free Drupal Accessibility E-Book
I hope this article gives you plenty of actionable tips for integrating accessibility considerations into your web content lifecycle. Following a holistic approach will lead to better results that are more sustainable and scalable. Want to take your knowledge to the next level? Download our Free Drupal Accessibility E-Book.
We also have several upcoming courses that might interest you:
- Introduction to UX Research & Design (March 7 -9, 2024)
- Content Strategy Best Practices (March 14 - 16, 2024)