How to bake accessibility into digital products from the beginning

Expand your reach, reduce costs, and minimize legal risk by building accessibility considerations into your product from the start.

Sagal Muse

Sagal Muse

Oct 13, 2021

Illustration of laptop with a Stark branded checklist on the screen.

8 in 10 companies are now working to achieve digital accessibility. This means that what was once considered an afterthought for many is now a main ingredient in the product development lifecycle. Even so, there’s no question that accessibility considerations should be made throughout the entire process and by all departments. How exactly these considerations fit into each stage of the life cycle is a friction point for many teams. Not because the positive intent isn’t there, but because product design and development, in general, is still a struggle. To make things easier, we’re covering the who, what, and when of building accessible digital products from the ground up.

When to get started

The short answer to this question is right from the start! Baking accessibility into your digital product from the beginning, be it during the ideation or conceptualization stages, is super important and valuable for both your business and customers.

For starters, according to Forrester, about $10-16 billion in design spending between the US and Canada alone will shift towards tech companies that are prioritizing accessibility. This means that as a company, building accessibility considerations into your product from the start will allow you to reach this often neglected community, leading to better customer satisfaction. And don’t forget, an accessible product isn’t just beneficial to users who may have a disability; being accessible inherently leads to major usability improvements and a more positive digital experience for all users (think close captions on TikTok and Facebook videos for example).

Placing an emphasis on digital accessibility as early on as possible also allows you to avoid non-compliance, which in turn minimizes legal risk. One example of this occurred in 2006 when The National Federation of the Blind sued Target Corporation because their website was inaccessible at the time—making it difficult for blind users to purchase from the e-commerce site independently. Even so, digital accessibility lawsuits like this aren’t a rare occurrence and are actually rising in number, with there being over 3,500 cases or about 10 lawsuits filed every business day in the US alone. Worth noting that it’s very easy to bring someone to suit in the United States. However, it wouldn’t be so easy if 97% of websites on the internet weren’t so painfully inaccessible. And we haven’t even touched on web apps, mobile products, and other platforms…

When it comes down to it, baking accessibility into your product early on allows for your team to reduce both the time and money spent during the development, maintenance, and support stages. For instance, early-stage testing, which includes disabled individuals, identifies exclusionary design and helps your team go into the production phase without having to create a backlog of tasks that require you to implement fixes. It doesn’t need as much maintenance and rectification if it’s done properly from the beginning. It also allows for your company to reduce the number of support requests since your early-stage accessibility considerations will result in usability increases, making it easier and more efficient for all.

Illustration of a diverse group of individuals socializing including individuals with visible disabilities.

Who should be involved

No matter your current situation or role, it is important to educate yourself on digital accessibility and compliance, while working towards building a company with top-down commitment and ideally a dedicated accessibility team down the road.

In any case, having support from the executive team is important in making early-stage decisions around accessibility as they will be able to set policies and programs in place for the entire company.

According to Forrester’s annual report, about 84% of companies are implementing accessibility efforts, even though only 36% of companies have a top-down commitment to developing accessible digital products. This is because even if there isn’t any particular accessibility commitment from the executive team, smaller teams or individuals within the company have made the commitment themselves.

Hiring experts with disability(s) is very important as they will be able to bring light to accessibility issues or considerations that may be overlooked otherwise. As the saying goes, “nothing about us without us”, which means building accessible digital products should never occur without the voices and experiences of people with disabilities included—be it through the hiring of experts with a disability as suggested here, or at the very least, being inclusive of their voices during early-stage testing.

The onus of caring about building digitally accessible products should never fall solely on accessibility experts. It’s important for everyone working on the product in roles such as product management, design, development, research and content development, to be involved and passionate about accessibility. Having role-based experts who are passionate about accessibility makes it easier for everyone to contribute to building accessible digital products from the point of view of their particular line of expertise.

How to get started

Now that you know why it’s best to start early and who should be involved in the process, let’s look at some steps you can take to bake accessibility into your digital product from the very beginning.

1. Get on the same page

Before diving into the ideation stage it’s crucial for everyone on your team to get on the same page about accessibility. The first step is to make sure that designers, developers, project managers, and so on understand, (1) why they should care about accessibility, (2) the role product development has in ableism, (3) why accessibility is critical to your company’s innovation and success, and (4) how accessibility impacts each respective discipline in the organization.

Next, it’s important to spread awareness of common accessibility mistakes in order to avoid them within your own projects. Some common mistakes include but are not limited to:

  • Poor focus order or keyboard navigation
  • Contrast issues or insufficient font size
  • Lack of alt-text for important imagery
  • Custom controls that don’t behave in expected ways
  • Controls that aren’t properly labeled or lack appropriate roles/traits indicating what kind of controls they are
  • Not respecting user preferences (reduce motion, color preferences, etc.)
Quick tip: Use Pocket Biases or Stephanie Walter’s 52 UX cards to discover cognitive biases to bring awareness to your own biases and how they may influence the development of your own products. This exercise is great to try with your team as it invites diverse perspectives and allows you to learn from each other.

2. User Journey Mapping

User Journey mapping helps teams visualize the touchpoints users go through to accomplish any given goal. With an accessibility lens in play, it can be an even more powerful tool in helping your team recognize at which point(s) within your users’ journey you will need to fulfill their unique needs or address their collective pain points.

Some benefits of user journey mapping:

  • Removes the bottlenecks within your user flow
  • Improves usability, conversion rates, and sales
  • Enhances your team’s ability to be compassionate with users
  • Helps identify how you can make your product more inclusive to different groups of people
  • Improves user experience and creates a better solution for anyone who interacts with your product

To get started with journey mapping, you will need to first get various teams on board in order to get a better understanding of the entire user journey (from end to end). This means designers, developers, managers, marketers, researchers, and more should collaborate together and establish a clear understanding of the various user personas that exist within your target market.

A quick illustration of what a user journey map can look like. It starts with a touchpoint titled, 'no food in the fridge' and ends with a touchpoint titled, 'success! There's food at home.'.

Establish the goal you hope to achieve through user mapping.Next, you’ll need to create your journey map:

  1. Think through user roles. Each journey map will focus on one particular user role (i.e. the relationships between users and the product or service). For each user role, define a collection of behaviors, needs, interests, motivations, and expectations in relation to your product. This is important because it will help you focus on the goal, challenges, and actions within the context of the user experience of your product.
  2. Define the situation or scenarios your user will face (i.e. the goal they’re trying to achieve; like ordering a quick meal off your app).
  3. Define your user’s expectations while using your product.
  4. Map out your user journey by identifying the stages your user will have to go through before reaching their goal. Typically these stages include awareness, consideration, evaluation, purchasing, and post-purchase).
  5. Under each stage make a list of how the user will interact with your product (i.e. a list of touchpoints such as through your app, website, newsletter, TV ad, physical store, etc.)
  6. Note the user’s motivation to use your product, and the actions they take to get to the next touchpoint.
  7. Make sure you also pay attention to your user’s needs and pain points while using your product. This will help your team identify opportunities to build in accessibility features that enable a better user experience for all.
  8. Include a section titled opportunities to outline the improvements you can make to your product as you analyze the user journey.
  9. Lastly include a section titled ownership to note which team owns the responsibility of making those said improvements.

In the midst of building a viable and accessible product, make sure that you also regularly go back to revise your user journey map so that it accurately reflects any new information your team may have gathered to improve your users’ experience and ultimately your product offering.

Quick tip: Another good exercise to try in addition to journey mapping is Cards for Humanity: A practical tool for inclusive design. During the exercise, you will deal two random cards at a time that coincide with a person and a trait, and your team will then have to work together to figure out how you can meet their needs.

3. Early-stage testing

When it comes to digital accessibility, there are several ways including concept validation and usability testing, to test out your idea or design concept before going into production.

Concept validation

At this stage, your team has brainstormed a solution that hypothetically meets its target market’s needs. Now it’s time to develop early-stage designs and mockups, which can range in fidelity from low-fidelity wireframes to a rough UI design.

Once completed, you can now test for accessibility issues by putting your design in front of your team and a small batch of users. A few things to look out for include: usability issues, how users are navigating your product (i.e. the user flow), and the initial response to the product as a whole. This will help map out what needs fixing and where any new opportunities for accessibility updates lie.

Usability testing

When you and your team are done validating the concept and applying any user feedback, it’s time to build a high-fidelity prototype followed by a rigorous usability test.

Before moving on to usability testing you should make sure that you're considering accessibility guidelines and proactively implementing them into your designs as you go. The design team should also utilize accessibility tools like Stark to check for design considerations including color contrast, font size, typography, and even focus order. Developers should check images, icons, and buttons (with images-only) to ensure they have a set label that includes the actual title of what it is you’re pointing to. For example, If you have a gear icon that opens to settings, make sure that users utilizing a screen reader aren’t hearing the word "gear", but rather what it actually points to which is "settings" in this case.

Once the prototype is in a place where you and your team feel comfortable to share with users, you can begin a more detailed user testing process by allowing small batches of users to interact with the screens, components, animations, and more. At this point, you’re looking out for the functionality AND accessibility of your product in order to validate your prototype, develop empathy, note any issues, and make sure your product meets users’ expectations.

Quick tip: Before conducting a usability test try using this web usability checklist to catch common issues.

It’s no longer an exception to build accessible digital products, it’s the rule. Shipping a product that isn’t accessible is a non-starter if you as a company intend to succeed. From the very beginning, the process of building out these products should be a collaborative effort from top-down support, passionate team members, and insight from the people this impacts on a daily basis—disabled people.

As mentioned earlier, this process should never exclude the voices and experiences of people with disabilities and should instead be inclusive of them every step of the way. Building accessibility considerations into your product can take many forms but should start with a unified, educated, and passionate team, a focus on building accessibility into the initial concept through journey mapping, and continuously iterating and validating your solution through early-stage testing.

After all, we’ve said more than once: any business leader that doesn’t account for accessibility injects massive risk into the company and a framework for compounding failure.

Want to join a community of other designers, developers, and product managers to share, learn, and talk shop around accessibility? Join our Slack community, and follow us on Twitter and Instagram.

To stay up to date with the latest features and news, sign up for our newsletter.