Pick a website. Look at it through a design lens. Do words like “sleek” and “simple” come to mind? Or are your eyes dancing across the page, struggling to read text, and trying to create organization out of chaos?
If the latter, you have a site with bad design. But worse, you’re likely looking at a site with inaccessible design too. That’s not just bad for users, it’s bad for business.
Since 1990, the Americans with Disabilities Act (ADA) made accessible technology a requirement of businesses open to the public. With more goods and services moving online, that includes websites. Yet a study of the 1 million most popular websites found more than 51 million distinct accessibility errors—an average of 51.4 per page. Research shows only 3% of the internet is fully accessible to people with disabilities.
Simple steps exist to dramatically improve the accessibility of your design. The more than 61 million people in the United States living with a disability stand to benefit, and so does your organization.
What Is Accessible Design?
Accessible design specifically considers and incorporates the needs of people with disabilities. The process moves beyond preconceived notions of the “typical user” to focus on design accommodating the widest range of people. The goal is to ensure people with disabilities can access websites and other digital products effectively.
Why Is Accessible Design Important?
The ADA prohibits businesses from discriminating against people with disabilities inside their stores and through websites. In 2021, web accessibility lawsuits under ADA Title III jumped 12% from the prior year. These types of lawsuits have consistently risen since 2013 and can create years of litigation. Just ask Dominos, which finally settled after six years of courtroom battles regarding its mobile site accessibility.
What Are Strategies for Making Design More Accessible?
Color and Contrast
Color is a key tool in any designer’s toolbox but may not be as reliable as you might think. Nearly everyone sees color differently, especially when different colors interact. The color contrast ratio measures the brightness or luminance of colored text compared to a background color on a scale of 1:1 to 21:1. Higher contrast ratios create the most accessibility.
Ever struggled with white text on a yellow background? That scores very low. The Web Content Accessibility Guidelines (WCAG) recommend a minimum contrast of 4.5:1 for most text. The highest level of compliance is 7:1 or greater. Remarkably, 86.4% of homepages score below minimum WCAG thresholds. Inspect your color combos with the WCAG Color Contrast Checker.
Accessible design also requires not relying solely on color. For the more than 12 million Americans with color blindness, color cues may not work. Consider the digital form that highlights red when missing information. A better accessibility practice is including a symbol or text alert also. Introducing patterns to colors helps people suffering from visual impairments distinguish between them as well.
Fonts
Select easy-to-read fonts. While both serif and sans-serif fonts can work, sans-serif tends to improve readability because of its more block-like and less decorative appearance. When selecting a font, consider width, height, and thickness. Remember, eyes and accessibility devices crave contrast.
Avoid ornate or cursive fonts. They are harder to read for all users, but especially difficult for people with dyslexia. Small font sizes, italicized text, and all uppercase words also present a challenge. Remember this rule when designing with fonts: bigger, shorter, taller, larger. Bigger text using shorter line length. Taller heights with larger spaces between letters. This creates a more accessible reading experience.
Readability
#whodoesntloveagreathashtag? If your social media hashtags look like this, you have an accessibility problem. CamelCase capitalizes the first letters of words in hashtags. The practice allows screen reader technology to distinguish the different words of the hashtag and increases legibility for everyone. #WhoDoesntLoveAGreatHashtag—see the difference?
Most Americans read between a seventh- and eighth-grade level. Keeping sentences concise and simple is important. Avoid jargon or terms exclusive to your business or industry. Make reading through your website easy for the user.
Good readability also requires ample white space. The empty space surrounding design elements provides organization and shows the relationship between pieces of content. Use white space to reduce clutter, break up text blocks, and improve readability. The design element also helps people using assistive technology better scan and understand the page.
Boldthink Builds Accessible Designs
At Boldthink, we specialize in accessible design. Everyone wins when websites serve all people. Accessibility expands your product market, improves user access, and helps keep you out of the courtroom. Schedule a call with our team of certified brand experts to assess your website and discover ways to make it work even better—for your company and its consumers.
