Whether you’re running a business, providing information for your community as a non-profit, or offering services and resources as a government organization, your website has to meet basic ADA compliance standards.
The Americans with Disabilities Act (ADA) sets rules to ensure that your website is accessible to people with impaired vision. Because the government considers commercial websites “places of public accommodation,” an inaccessible site excludes users with disabilities in the same way an inaccessible physical storefront would. Failing to meet ADA compliance requirements may lead to lawsuits and penalties.
Here is a short list of the most common ADA compliance issues your website may have:
Headings
When creating or updating your website, you might be tempted to add headings to your pages because of the style. However, headings must follow strict rules of sequence and nesting.
Your page title is always H1, and it should be the only line of text with that heading tag.
The next heading below that must always be H2. If that section of text has smaller sections with subheadings, those must always be H3. The numbers get larger as you add sections within sections within sections. Then, the heading of the next big section is once again H2.
This is to ensure that when someone uses a screen reader, they can easily follow the page hierarchy and access the information in the order it was intended.
Fonts and Colors
Style is great. Adding color and fancy fonts to your website can definitely make a statement. But your text still needs to be readable by everyone, including people with impaired vision and colorblindness.
Your text must meet two requirements for ADA compliance: size and contrast. While size is self-explanatory, contrast can get tricky, especially when you’re using colorful backgrounds. For solid color backgrounds, use Adobe’s Color Contrast Checker tool to make sure your text remains compliant. If you’re using a photo or graphic as your background, it should be low contrast. For extra readability, try adding a white or black overlay (depending on the color of your foreground text).
Image Alt Text
Alt or Alternative Text is a brief description of the image that is entered into the metadata for the image. Screen readers do not have the ability to read images, so the Alt Text provides a clue as to what the visitor should be seeing.
Alt text is required on all images, except in cases where the image is purely decorative, such as an abstract background, or a staff member headshot whose name is included with their photo.
Graphics with Embedded Text
Sometimes you make a graphic or a flyer and it looks so good you want to display it on your site. Putting it up as a picture saves you a lot of time retyping and styling the content, so why not, right?
Wrong. As mentioned above, screen readers cannot “read” the information embedded in an image. For ADA compliance, large sections of text and important information must be typed on the webpage in order to be accessible and readable. If you want to showcase your flyer, include it as a thumbnail for decoration.
Scanned PDF Documents
When sharing PDF documents through your website, ADA rules still apply. Your PDF must be readable using a screen reader. Scanned documents do not meet these requirements, unless you use an OCR scanner. Regular office scanners convert the printed page into an image.
In order to make a PDF document ADA-compliant, save the original source document as a PDF directly. If you have multiple documents that need to be merged, use a tool like Adobe Acrobat Pro to do so.
Warning: AI chatbots can sometimes extract text from images, but they are not always reliable and should not be used to make PDF documents ADA-compliant. This is especially true for government organizations, non-profits, and businesses that face higher public scrutiny.
When is it time to call in the pros?
Proactive compliance is always better than the alternative. Your website should start with accessibility and mobile responsiveness as the primary requirements. If it didn’t, or if it’s been a while since your website was updated, it may be time to reassess and reevaluate.
Call the Nerds to schedule a free consultation. We can perform an ADA assessment, and let you know what needs fixing, what could use some work, and how your website can be improved.