This article originally appeared at Forbes.com.
According to the Centers for Disease Control and Prevention, around 27% of all Americans are living with some form of disability. It should come as no surprise, then, that federal and state governments alike are working around the clock to protect these individuals' ability to freely participate in every aspect of public life.
You’re likely already familiar with some of these protections, like the Americans with Disabilities Act (ADA), which prohibits discrimination against those with disabilities in many areas of public life. However, you may not know that websites are one of those areas.
The U.S. Department of Justice clearly states that "the Department has consistently taken the position that the ADA’s requirements apply to all the services, programs, or activities of state and local governments, including those offered on the web."
Some states, like California, are imposing even stricter regulations. One bill working through their government now, AB 1757, would require all websites to adhere to the "WCAG 2.1 Level AA" digital accessibility standard or face increased legal exposure.
All of this begs the question: Is your website accessible? If not, then today’s the day. Below are five tips to help make your website more accessible and more compliant.
Accessibility compliance begins at the planning stage of any website. For many of us, that means choosing a website builder or working with an agency that takes accessibility seriously. You, or your builder of choice, should prefer standardized, descriptive HTML elements.
For example, when writing HTML code, you can choose to create a button using the "<button>" element, a descriptive and standardized element with built-in accessibility features, or a bespoke, custom button using the generic "<div>" element.
If that sounds like nonsense to you, don’t worry. The actionable advice here is to reach out to your agency, developer or website builder and ask what steps they’re taking to ensure accessibility. Accessibility is all about being specific, so generic code just won’t do!
Image alt-text is, as the name suggests, alternative text to describe an image when, for any reason, it can’t be viewed. This is a great accessibility practice, especially for those with visual impairments, and, as an added bonus, is also beneficial for SEO (search engine optimization, or making sure your website ranks well on Google). That’s because, at least for now, search engines cannot see your images—they need them described.
These descriptions should be concise, thorough and, of course, descriptive. Don’t just enter “dog” to describe an image of a dog—be specific. Dig into the color, the breed, the environment. Give your users any and all relevant information so that they can truly experience the photo.
If that sounds time-consuming, don’t worry. There are tools available today that can generate image alt-text automatically with the help of AI.
Paired colors with low levels of contrast can be difficult to discern for some users, especially when applied to text. Even your visitors without any known disabilities may struggle with yellow text on a white background, for example.
When designing your next website, working with a contrast-checking tool can save you, and your visitors, a lot of headaches. Utah State University offers a high-quality tool that you can use for free to test color combinations for appropriate levels of contrast.
To maintain compliance with WCAG 2.1, your normal website text should have a "7:1" contrast ratio while large text can have a "4.5:1" contrast ratio. For text to be considered large, it should be 14-point and bold or larger, or 18-point and normal weight or larger.
Where do you think the phrases "learn more" or "here" would lead when clicked? Not very descriptive, is it? Instead, aim to use more specific language to describe your links. Not only does this benefit those with disabilities, but it’s also, once again, great for SEO.
Some users need unique accommodations like larger text, even higher levels of contrast or dyslexia-specific fonts. A common practice is to offer the ability to make those changes as needed, often via a third-party tool or custom-developed pop-up.
You may recognize these on certain sites as the little white stick figure placed above a blue background.
Building an accessible website is your legal obligation, but it’s also the morally correct thing to do. Why not choose today to do your part to create a more equitable internet for everybody? You can test your own website today using the free WAVE tool, once again developed by Utah State University’s Web Accessibility in Mind group.
