Accessibility Issues: 5 Common Issues To Avoid | Compliant

Accessible designs are all around us. Most brick-and-mortar places of business have some form of accessible design. A ramp for wheelchair access would be one example.

But, accessible accommodations aren’t limited to mobility issues. In our day, most information is consumed, shared, and enjoyed in the digital environment. But, just like a building, the internet presents its own share of accessibility issues.  

When it comes to web accessibility, equal access to digital content is the goal. Creating web content with accessibility in mind allows users with disabilities the same access as everyone else.

What Is Web Accessibility?

In short, web accessibility focuses on designing and developing websites, web applications, and products that are more accessible for individuals with disabilities, whether used from a desktop at home or through mobile devices.

In effect, web accessibility seeks to remove the common barriers that limit the access content on the internet for those with disabilities. Disabilities impact over 61 million adults in the United States alone.

Disabilities include:

• Visual impairments – Blindness, low vision, and color blindness.
• Hearing impairments – Auditory issues such as deafness or hard of hearing.
• Physical impairments – Those with limited mobility or motor functions skills.
• Cognitive disabilities – Learning disabilities or that affect memory or processing.

Thankfully, the Americans with Disabilities Act (ADA) helps protect individuals and employees with disabilities from discrimination in the public sphere. These regulations also touch on issues related to digital accessibility.

Title III of the ADA relates most closely to web accessibility. Standards for accessibility compliance are found in the Web Content Accessibility Guidelines (WCAG 2.1).

These guidelines provide best practices for web accessibility and help address the most common barriers when it comes to inaccessibility online.

How Can I Make My Website Accessible?

The best practices for website accessibility can be found in the standards mentioned above, the WCAG. The good news is, these accessibility guidelines are also aligned with most business goals, such as search engine optimization (SEO) or mobile-friendly designs.

These guidelines are meant to help you make your website as accessible as possible — to ensure the best overall experience for all users. Plus, the use of assistive technologies (e.g., screen readers or screen magnifiers) is also taken into account.

Let’s take a look at some of the most common issues that may present an accessibility problem for your website.

Color

It would not be an overstatement to say that color can make or break a website. Of course, most opt for exciting, attention-grabbing color palettes; but, these don’t always bode well for accessibility.  

Color can be used both as an emotional tool and a practical tool on your website. But, finding the balance is key. You want visual content to be appealing but not overwhelming — or inaccessible.

Some users may have low vision or color blindness, so choosing colors with them in mind is important.

You should avoid green on red or red on green color palettes since these color combinations are inaccessible to many with color blindness. Also, it is best to work with a few dominant colors to avoid color chaos.

Good accessibility practices recommend using a 60/30/10 percentage split — 60 percent dominant color, 30 percent secondary color, and 10 percent accents.

Insufficient color contrast can also hurt accessibility. According to a WebAim accessibility analysis, nearly 87% of home pages suffer from low contrast text. Per WCAG, the ideal contrast ratio for text to background color is 4.5:1 for normal text and 7:1 for larger text.

You can also opt to use a color contrast checker to ensure you meet these requirements.

Moving Text and Graphics

Moving text and graphics can be accessible, but it is best to use these elements sparingly. One concern with animated, moving, scrolling, flashing, or changing content could trigger vestibular issues (e.g., dizziness, nausea, etc.). But, they can also cause seizures for some individuals.  

WCAG characterizes these elements as information that moves, blinks, or scrolls for more than five seconds and is presented in parallel with other content. WCAG 2.2.2. states users must be given a mechanism to pause, stop, or hide these elements unless the element is essential. The finer points are outlined more in the guideline above.

Multimedia

It’s nearly impossible to find a website that doesn’t utilize some form of multimedia, whether it be images, videos, audio, etc. But, utilizing these with accessibility in mind is the goal.

Any multimedia that provides information or context that is crucial for the user to understand must have corresponding text elements to make it accessible—for example, the use of alt texts for complex images, diagrams, or graphs.

Font

Font accessibility is also important in order to serve those with visual impairments and cognitive disabilities, such as dyslexia. Most experts agree that sans-serif typefaces are the most accessible for online readability (e.g., Arial, Helvetica, etc.). More tips include:

• Using a consistent, readable typeface limit font variation.
• Avoiding decorative fonts, such as script-type fonts.
• Using sufficient color contrasts (mentioned above).
• Letter spacing should be at least 0.12 times the font size.  

Also, use 24-point font for display headings, no less than 12-point for body text, and no less than an 8-point font for captions.

Alerts and Warnings

Some websites utilize alerts or warnings to display important messages. Usually, these are time-sensitive. While most screen readers can render alerts automatically, it is still important to give them enough time to react. Also, alerts should be used as infrequently as possible to inhibit the usability of the user interface.

What Are Common Accessibility Issues to Avoid?

One of the most important things to remember is that individuals with disabilities might be navigating your site differently, i.e., not using a mouse. That is why optimizing your site for keyboard users is important.

All navigation should be able to be done through keyboard focus tools, such as the tab key. Here are some other things to remember.

Relying on Color

One thing to avoid is relying on color alone to express key points. Again, color can be an emotional tool, but in terms of accessibility, it should be used as a practical tool.

It should be used to enhance the experience, not hinder it; in this case, functionality and readability trump aesthetics. Bolding and underlining can be used to drive home a point instead.

Forgetting Closed Captions or Alt Text

Don’t forget to include alternative texts for multimedia. Here are some common tips:

• Alt text for images – Any complex image on your site needs a text alternative; this even applies to images of text. Screen reader users rely on alt text to interpret content on web pages. If the image infers information or context vital for understating content, alt texts should be used.

• Captions for audio – All audiovisual content should have corresponding texts, such as captions or transcripts. This ensures those with hearing impairments don’t miss out on important content.

Using Flash

Adobe Flash is a popular animation technology, but it is not always conducive to an accessible design and is unsupported on many browsers — making it a barrier to accessibility for multimedia. Use Flash alternatives when possible, such as H5P or WebGL.

Making Forms Too Difficult to Fill Out

It is also important not to let forms be a barrier to accessibility. Forms are common for registering and purchasing or for capturing information. Use short, simple form fields whenever possible with clear, grouped label controls.

They should also be easy to navigate for users and structured in a logical, sequential manner. Also, utilizing a focus indicator can also help keep users on track.

Not Moving Beyond the Page

Simplicity is best when it comes to accessibility. The goal is to keep users on the page by removing all potential barriers to usability. Navigation links can present a real problem for screen readers.

It is best to supplement with ARIA attributes to avoid confusion with navigation menus. You can assign roles to navigation menus using ARIA to indicate the purpose and to make things more navigable on the page.

Conclusion

Accessibility is crucial in our digital environment. Most information is consumed and shared online these days, but the internet is not without its barriers.  

Designing your website with accessibility in mind helps mitigate those common barriers and provides an opportunity for your content to be enjoyed by all.  

When it comes to accessibility, there are certain things to avoid. Thankfully, web accessibility guidelines can help you as you navigate the road to a more accessible design.