This is the second in a series of articles I’m writing on accessible web experiences. In the first article, “The ADA and Universal Design: Why Do We Develop Accessible Web Experiences?” I discussed the “why” of accessible digital design. In this article and those that will follow, we’re looking at the “how.”
In the early days of the Americans with Disabilities Act (ADA), it became common to see wheelchair ramps retrofitted to the entrances of stores, restaurants, libraries, government centers, and other businesses and public buildings. They were often added as an afterthought to architecture that had not been designed with accessibility in mind.
Building engineers later learned to hack better retrofits, but the more radical transformation came when architects started designing for universal access in their blueprints for new construction. Universal access went from appended accommodation to the core of good design.
Today, we’re at a similar inflection point with accessible websites, and it all begins with drafting better blueprints for digital experiences.
Below, I’ll be discussing familiar topics such as UX, information architecture, content organization, and wireframing, but to be clear, this isn’t intended as a comprehensive discussion of these topics. Rather, I’ll look at how principles of universal design can be integrated with these competencies to build better blueprints for websites that will serve everyone better.
Diversify Your Personas
Universal design is inherently user-first design. We’re designing digital experiences for real people to use. If we’re committed to universal design, we’re designing them to work well for as many people as possible.
Personas are a key tool of user-first UX design. Are any of your personas vision- or hearing-impaired? Color blind? Is one of them unable to use a mouse or trackpad? Is there any neurodiversity represented in your personas? If people with disabilities aren’t represented in your personas, you’re unlikely to understand and empathize with their needs.
A universal design approach to user-first experiences starts with understanding that your users will have many different experiences, then doing everything you can to understand their perspectives.
Follow Their User Journeys
Once you include the personas of people with disabilities, what do their user journeys look like? What paths will they want to follow through your site? Do they have the same goals as your other personas? Do they have the same pain points?
An architect designing an office building might consider that a person who uses a wheelchair could choose to enter the building from the parking garage, but they also might take the bus then enter through the street-side entrance. Are all entrances wheelchair accessible?
Following our diversified user personas through our planned web experience, we have to design more accessible journeys. What are all the likely entry points? How easily can they navigate from that point to the next key step toward their goal? Are all the steps really necessary?
This exploration might lead you to realize that a six-step journey on your website could actually be accomplished in three steps. It might clarify what content is actually supporting that user journey and what is just getting in the way. In the end, you’re likely to map out a user journey that is more direct and easier for everyone to navigate.
This streamlined journey will help the user who relies on a screen reader and keyboard to move through a site. Removing distracting content may help the user with ADHD or dyslexia to better process key information.
All of it helps any user more easily accomplish their goals. It’s a more elegant and effortless experience for all.
Obsess Over Your Sitemaps and Content Structure
Let me start by stating something obvious to anyone in this community: HTML links can be arbitrary. They don’t demand that the content on your site be organized in any logical, hierarchical, or process-driven manner. You can group your content however you want or not at all, then link from resource to resource as you please. There’s power in that, but also peril for content organization.
This is not to suggest that you shouldn’t use contextual links. My point here is that you shouldn’t use them as an excuse to treat sitemaps — content organization — as an afterthought. You should obsess over the optimal organization of your site content, and accessible design is one of many reasons why.
If a user can smoothly move focus over a navigation menu and easily scan the dropdown submenus, they’ll probably eventually find what they’re looking for on your site, even if where they find it doesn’t make a lot of sense. The same goes for scanning a page for buttons and other contextual links.
But what about a user who uses a screen reader and keyboard navigation to work through those menus or links? They’d rather not have to tab through every menu choice, but if they don’t find the content they’re looking for where they expect it, that’s just what they’ll have to do. The costs in time and frustration are high. It may prevent them from finding the services or information they need. It may cost you conversions.
Organize your content to bring important resources to prominence. Make the pathways toward user goals simple to find and easy to follow.
Good content organization helps people with physical disabilities, people with neurological differences, and, once again, anyone who has ever wasted time and effort trying to find what they needed on a poorly organized website. (Has anyone out there not had this experience?)
Bring Your Wireframes Into Clear Focus
Wireframing is the more detailed work of building a better blueprint for your website, though the idea here is largely the same. Once a user gets to a particular page in their journey, how can you make it easy for them to find the information they’re seeking or the action they need to complete? How can you clearly guide them to the next step or their end goal in the journey?
On larger sites, wireframes also encourage consistency among pages of similar types and purposes. A user knows where the information will be on one page because it’s the same place it is on all the other pages of that type.
For a person with impaired vision, autism, ADHD, or many other disabilities, good wireframes give proximity and predictability to the web experience. They give prominence to key information and actions, establish conventions for similar types of resources, and strip away unnecessary content that doesn’t actually serve the user or advance their journey. They do the same thing for people without disabilities.
Better Blueprints are Better for All
I made this point in the article that launched this series, but I want to reemphasize it here: Better blueprints lead to web experiences that are better for everyone, not only for people with disabilities. The rigor of universal design pushes us to refine how we organize information, both on the page and throughout the site. It compels us to create clearer, frictionless paths to the most important information and actions. It forces us to consider what content actually serves the user, and what just gets in the way of the user’s goals.
When we build web experiences based on such blueprints, we create websites that are better for everyone. E-commerce sites with better conversions. Government services sites that better serve their citizens. Information resources that help people find or discover the information they seek.
It’s how we begin to design accessible websites that are better for all, and it all starts with the hard work of drafting a better blueprint.
The post The ADA and Universal Design: Building a Better Blueprint appeared first on Torque.
