ADA, or Americans with Disabilities Act, compliance should be a top priority for all people who have a website for their business. Being ADA compliant means that your website is accessible and readable for people with a variety of disabilities.
Some aspects of ADA compliance include:
- Creating alt text for any visual elements, like images and charts
- Captioned videos
- The site is navigable with a keyboard
- Font can be enlarged and must have the correct contrast ratio
That last point is the one that we’ll focus on today. Some people don’t consider disabled users when they choose which font they will use and which colors they will use. Often, these choices are made purely based on design.
However, certain designs can hinder disabled users from gaining access to the information on your website. In creating and designing your website, you need to consider color blind or visually impaired users. Will they be able to read the information on your website?
Here are the 4 things you need to know about ADA website font compliance to ensure that these users will be able to access your content:
- Font Color Matters
Many people do choose font color carefully when they design a website. However, the factors surrounding their decision are typically aesthetic first. Colors are generally matched to a color scheme that is applied to the entire website.
However, you should first consider which colors will serve the widest audience. Where young people and others with good vision may have no problem reading your content in the color you’ve chosen, older people or visually impaired people may have a more difficult time.
One practical way to test out your font color choice is to have multiple people in your business or on your team look at the font and say whether they have a hard time reading it. (Make sure that the people you ask are not all young people with great eyesight, of course.) This will be a good starting point for you to weed out any colors that are an absolute “No.”
On top of choosing an appropriate font color, you need to make sure that the color of the text is alterable for those who have different needs. You may have a specific vision of how you want your website to appear to customers, but it will be more beneficial to them if you allow them to make changes.
Some people can see better with white text on black, some with black text on white, and yellow on black or black on yellow are also used. These combinations work well for people who have impaired vision.
These font settings can generally be changed in the browser or operating system that the user is on. But, some websites make it impossible for these settings to work. Ensure that your website is programmed in a way that will allow these settings to do their job.
- Check Your Contrast Ratios
The relationship between the font color and background color also comes with some rules. This relationship is called a contrast ratio. According to ADA guidelines, these contrasts need to have a minimum ratio to ensure that visually impaired and color blind people can easily recognize characters.
The minimum contrast for regular text is 4.5:1. In these ratios, the first number refers to the luminance of light colors while the second number refers to that of dark colors. For large text, that ratio is 3:1.
Make sure that your font and background colors maintain these ratios at a minimum.
- Font Size Matters
Now that we’ve covered the color of your font, let’s look at the size of your font. Of course, larger fonts will be easier to read for visually impaired users. However, many website creators want to make sure that their site looks modern and is designed well. So, where’s the line, and how can you compromise your design to suit the needs of all users.
There is no official rule in the ADA that states a minimum required font size. According to Digital Authority Partners, 16 point font is an appropriate choice that can serve both your design and your users well. This rule of thumb applies specifically to body text on your site. Headings and titles should, of course, be in a larger font to catch the attention of the reader.
Another way to cater to visually impaired users is to make sure that your website is readable and usable if someone were to zoom in with their browsers. No matter how far they zoom, users should be able to read text top-to-bottom without scrolling side-to-side.
Even if you are writing with large text, you can’t prepare for everyone’s needs. What you can do is make sure that your website is compatible with their browser and operating system so that they can alter the appearance of your site on their end.
- All Fonts are Not Created Equal
One last rule of thumb. Try to use fonts that are clear and easily readable rather than decorative and elaborate fonts. There is no particular rule about which fonts you can or cannot use, but here are some recommended fonts:
- Helvetica
- Calibri
- Arial
- Tahoma
- Verdana
- Times New Roman
Not only are these fonts easy to read, but they come preloaded on most computers regardless of the operating system.
You don’t have to use these fonts on everything. You can still have decorative, attention-grabbing fonts. But, these fonts are useful for lengthier text–blog posts, articles, or body paragraphs–as well as essential information–logins, forms, or warning messages.
Use your judgment, just make sure that everyone will be able to easily get important information from your site.
ADA compliance is not something that your business can ignore. It’s been known to result in expensive fees and lawsuits that have the power to put you completely out of business. So make sure that you are providing content for your audience in a way that everyone can access, regardless of their particular needs or work with an agency that can help you fix these issues (here’s a great list).