Rethinking accessibility in authoring tool products

Sara Boback, CPWA
UX Collective
Published in
5 min readAug 17, 2021

--

I think most people agree that digital product inclusion is important. But, while more companies are shipping products that meet web accessibility guidelines, many of these products are not designed to support authors in creating accessible content.

Let’s face it, user guides just don’t cut it any longer. Why not bake accessibility right into your product?

Let’s re-think product accessibility for authoring tools.

What is a digital authoring product?

Let’s define this slightly mysterious term (at least to me) using the W3C definition. An authoring tool is defined as “Any web-based or non-web-based application(s) that can be used by authors (alone or collaboratively) to create or modify web content for use by other people (other authors or end-users).” — Authoring Tool Accessibility Guidelines 2.0

The market for these types of products is large, varied and complex. An authoring tool could be any of the following types of products:

  • Customer Relationship Management / Business Platform (e.g. Zendesk, Salesforce, Calendy)
  • Publishing tool or Learning Management System (e.g. Canvas, Blackboard, Medium)
  • Data visualization tool (Tableau, Microsoft’s PowerBI, or Google Charts)
  • E-learning tool (e.g. Adobe Captivate, Powtoon)
  • Design tools (e.g. Canva)
  • And many more

Where things get complicated…

We know with authoring tools that accessibility is in the hands of the author. And because of this the author is responsible for ensuring that all users can consume your content. But,

  • What if the author doesn’t know how to use the product?
  • What if the author doesn’t know anything about digital accessibility?
  • What if the author forgets something important and doesn’t realize they are excluding users?
A process diagram where it shows three stages. A product starts out usable and accessible in the first stage. In the second stage, when it is used by someone, inaccessible content is created. In the third stage, an end-user tries to access the content, but it presents barriers.
Illustrating where the bottleneck occurs in authoring tools

It’s easy to see that when people get their hands on a product, there are a million things that can go wrong when it comes to accessibility. But before we continue, lets step back for a moment and define an accessible product.

Defining an accessible product

I like this quote.

An accessible product — in it’s simplest sense is making sure that all of your users can consume your content. — Adhithya, Designing Accessible Products

While this is a great, easy to understand definition. It’s worthwhile for us to expand this definition for our purposes to account for the authoring part of creating accessible products.

An accessible product is making sure that all of your users can consume and create accessible content.

Now, that we’re on the same page about authoring tools and definitions, let’s talk ideas…

How authoring products can support accessible outputs

There are endless ways product teams can start innovating and better support authors in the creation of accessible outputs, but here are a few of my musings:

Wizards

Wizards have been used for decades for installations and involve a sequence of boxes that lead the user through a series of defined instructions. Complex and infrequently performed tasks are often easier to perform using a wizard. Digital accessibility should be no different — learning through a guided tool may support users in creating more accessible outputs for end-users. A method like this has the potential to be effective as it includes components of experiential learning, otherwise known as “learning by doing” where the author is an active participant in the process.

Why not include a guided series of instructions for users on how to make their content accessible? The prototype below shows how the user would begin their accessibility journey using a wizard.

A web prototype of a dialog box where a user can begin the accessibility wizard. In the box, it states “The wizard takes you through a series of steps to make your web content accessible for persons with disabilities. Follow the instructions on each box to fix issues that we have identified.”
A prototype of an accessibility wizard intro page.

Once the user has started the accessibility wizard, they could be given opportunities to correct issues with their web content. The prototype below shows an image with missing alternative text in one of the graphs. Here, the user is:

  • alerted to the issue (issue identification)
  • learns how to fix the issue (education)
  • provided an opportunity to fix the issue by entering alt text into an input box (remediation)
  • mark the image as decorative if it is not meaningful
A web prototype of a dialog box where a user has begun the accessibility wizard, and the box shows that there is missing alternative text in one of the graphs.
A prototype of the accessibility wizard guiding the user through how they may enter alternative text.

Wizards can be used to alert users to many other issues that lend themselves well to automated detection, and provide a great opportunity to educate users on digital accessibility. Win/win!

Notifications

Why not build notifications into the user interface to support users with making accessibility fixes throughout the authoring process?

In the prototype below, when a user attempts to upload an image, they’re notified that the image is missing alternative text and may be inaccessible. They’re also provided an opportunity to make edits before continuing.

Prototype of an image upload where a user is informed there is missing alt text, and is given the chance to add it.
A prototype where a user is notified upon upload that it is incomplete.

Preventing Inaccessible Content

In the future, there may come a time when there are no longer any excuses in creating inaccessible web content.

Preventing inaccessible content from being posted is another option to ensure product inclusion through more stringent measures. In the prototype below, a warning message is presented to the user letting them know that they have to fix the outstanding accessibility issues before posting their content.

Prototype of a warning message that is preventing the user from posting the content because it is inaccessible.
Warning message preventing users from publishing.

Accessibility Aids

Why not create more awareness of inaccessible content in educational settings? With the massive shift to online learning this past year, the needs of students with disabilities having access to equitable education has been overlooked. Both students and instructors both have a responsibility in creating an accessible learning environment where fellow students can access and interact with shared content. In the prototype below, an accessibility checker is embedded directly into the learning management system interface.

A prototype of a learning management system interface. The interface has an accessibility checker where headings, contrast, attachments and alternative text and checked.
A simplistic example of how an accessibility checker built into student learning management system interfaces might support greater product accessibility for end users.

Education

And finally, education. This might seem quite simple, but companies absolutely have a responsibility to educate product users on how to use their products to create accessible outputs.

Creating complicated user guides does nothing to advance your company’s digital accessibility agenda. Why not be a leader in this space and design a tool that solves this tricky problem.

Wrap-Up

No more excuses. Hard stop.

Its time for product teams to start thinking out of the box when trying to address this complex issue authoring tools create.

Credit note: A few of these ideas evolved out of a collaborative design process at OCAD University, where I worked with fellow student Josie Gray to improve accessibility in Open Educational Resources.

The UX Collective donates US$1 for each article we publish. This story contributed to World-Class Designer School: a college-level, tuition-free design school focused on preparing young and talented African designers for the local and international digital product market. Build the design community you believe in.

--

--

A little bit of what matters to me: inclusive design, #a11y, tech & social justice.