Are you excluding a percentage of the population from fully experiencing your website? Can people who are visually impaired or deaf or who have a physical disability navigate your site?
Accessibility doesn’t only apply to physical accommodations—like ensuring there’s a ramp to your place of business—it also applies to your website. In fact, the Americans with Disabilities Act (ADA) considers public sector business websites public accommodations:
"Although the language of the ADA does not explicitly mention the Internet, the Department has taken the position that title III covers access to Web sites of public accommodations. The Department has issued guidance on the ADA as applied to the Web sites of public entities, which includes the availability of standards for Web site accessibility."
The ADA specifically defines a public sector business as having 15 or more employees, but whether your business has 15 or more employees should not matter. We can all do our part to make the internet an inclusive place for all.
What does making my website accessible mean?
It starts with understanding how people with disabilities navigate websites. There are many different ways depending on their needs and preferences. It can vary from using specialized software and hardware to configuring standard software and hardware.
For example, many people with visual disabilities use voice readers like VoiceOver, NVDA, and JAWS. This is how they navigate content:
Making your website accessible means making it easy for these tools, and the people that use them, to navigate your site.
Here are some best practices for Web accessibility:
This list of basic principles comes from WebAIM’s Principles of Accessible Design.
- Use thoughtful ALT text.
Use alternative text on non-text content, like images. It’s helpful for people who rely on a screen reader to have the content of the website read to them.
- Provide appropriate web page structure.
Headings, lists, and other structural elements provide meaning and structure to pages and also facilitate keyboard navigation.
- Provide headers for data tables.
Tables that are used to organize tabular data should have appropriate table headers (<th>). Data cells should be associated with their appropriate headers, making it easier for screen reader users to navigate and understand the data table.
- Ensure users can complete and submit all forms.
Every form element (text field, checkbox, dropdown list, etc.) should have a label and make sure that label is associated to the correct form element using the <label> element. Also make sure the user can submit the form and recover from any errors, such as the failure to fill in all required fields.
- Ensure links make sense out of context.
Every link should make sense if the link text is read by itself. Screen reader users may choose to read only the links on a web page. Certain phrases like “click here” and “more” are too vague.
- Caption and/or provide transcripts for media.
Provide captions and transcripts to videos and live audio.
- Ensure accessibility of non-HTML content.
PDF documents, like downloadable offers, should include a series of tags to make it more accessible to a person using a screen reader.
- Allow users to skip repetitive elements.
Provide a “Skip to Main Content,” or “Skip Navigation” link at the top of the page which jumps to the main content of the page.
- Don't rely on color alone to convey meaning.
The use of color can enhance comprehension, but do not use color alone to convey information. That information may not be available to a person who is colorblind and will be unavailable to screen reader users.
- Make sure content is clearly written and easy to read.
Your content should be typo free, and it should also have correct punctuation. Always proofread for spelling and grammar.
- Make JavaScript accessible.
Ensure that JavaScript event handlers are device independent (that they do not require the use of a mouse) and make sure that your page does not rely on JavaScript to function.
- Design to standards.
HTML compliant and accessible pages are more robust and provide better search engine optimization. Cascading Style Sheets (CSS) allow you to separate content from presentation. This provides more flexibility and accessibility of your content.
While this list does not include all accessibility issues, you can find a robust guide in WCAG 2.0’s Web Content Accessibility Guidelines. If you’re a HubSpot user, you can find some additional information on HubSpot Designers. HubSpot also wrote this blog that dives deeper into four accessibility principles.
It’s only a matter of time before accessible websites are common practice. Laws are slowly updating to enforce web accessibility. Do your part in making the World Wide Web accessible for all by being mindful of your next website changes. Also, since accessible content and SEO overlap in many ways, you’ll be doing your website a huge favor!
