Skip to Content

Law Firm Sites Blog

ADA Compliance: Use of Color

March, 26 2021
Article by
Avatar photo
Jo Stephens
ada color

Using specific law firm colors on your website can be among the most fun and creative decisions when building attorney websites.

Perhaps you’ve been excited to select a lawyer color palette that matches your firm’s logo, or perhaps a certain color has always stood out for you as being particularly interesting.

But having a great color scheme is only the first step. You also need to make sure that your colors are ADA compliant.

What’s the problem with colors?

Well, there are a few issues that can come up if you choose the wrong colors, or rather, the wrong color combinations.

These issues mostly come down to an issue of contrast. Contrast is how different two or more colors are from each other.

For Example

Black elements against a white background will have high contrast, whereas a dark pink next to a red would have low contrast.

If your law office colors aren’t contrasted enough, your law firm web design elements may be hard to distinguish, especially if the two colors involve text.

This can be frustrating to your current and potential clients who are trying to navigate the resources on your website, and this can be extra difficult for clients who have impaired vision.

Here’s a great video that dives into color contrast a bit more, as well as some tools to check your website:

How to Avoid ADA Color Problems

Luckily, as a professional lawyer website design company, we know how to avoid some of the problems that arise from colors on your website.

Color Contrast

One way to ensure there’s enough contrast is to look at the contrast ratio of colors (this ratio ranges from 1:1 to 21:1). According to the Web Content Accessibility Guideline (WCAG), colors should have a 4.5:1 ratio for contrast for small text and a 3:1 contrast for larger text.

ADA Colors

Multiple Indicators

Another way to avoid these problems is to include multiple indicators for interactive law firm web design elements. For example, if when you hover over a link you want the text to change color, we will also make the text become underlined: multiple indicators.

Free Website Design

Accessibility for Color Blindness

Besides making sure there’s enough contrast in colors, you also need to keep in mind how your choice of colors will impact those who are color blind.

The most common type of colorblindness is with red and green, so it’s important not to put green text or elements on red backgrounds, or vice versa.

Traditionally, red and green colors may have been symbolic of something good (green) and something bad (red). This is something that should be avoided in an ADA-compliant website.

Helping Your SEO

Having an accessible website will benefit your SEO, protect your firm, and will be of great service to your users.

Law Firm Sites can help you make sure your colors not only look good but are contrasting and ADA compliant. Please contact us today to get started on your law firm website design.

Do you want to see your site with a new look?