This article is posted with permission from Sophicity’s CitySmart blog and shares non-technical, municipal-relevant insights about critical technology issues, focusing on how technology reduces costs, helps better serve citizens, and lessens cybersecurity risks. Sophicity is solely responsible for the article’s content.
Despite the perceived importance of ADA-compliant websites, many city websites do not comply with best practices that help disabled people access content. While ADA, W3C, and other organizations provide detailed guidelines and best practices, very few enforceable laws exist to keep cities accountable. Plus, even if a website designer follows all ADA best practices, a city employee may upload content to the city's website that doesn’t meet these requirements.
While some signs exist that the Department of Justice may create enforceable ADA-related website regulations in 2017, it’s not definite at this time. But that doesn’t mean your city should ignore ADA-compliant website best practices.
By making your website ADA-compliant, you:
- Help extend your website services to disabled people.
- Improve the overall functionality of your website.
- Anticipate following future laws and regulations that may be expensive to correct later.
If you haven’t thought about ADA compliance for your website, then where should you start? While existing guidelines cover a lot of technical ground, here are some best practices that should be easy to tackle with the help of your website designer and whoever creates and uploads content to your website.
1. Describe images with text
Many people just upload an image to a website as quickly and simply as possible. However, there should be an option on the back end of your website to provide alternative text (or “alt text”) for an image. For example, if you place a picture of city hall on your website then the alt text may say “Picture of city hall on a sunny day.” If someone is blind or cannot see very well, they may use a screen reader tool that describes all images on a page. When you fill out the alt text, you make images “readable” and accessible to people with vision problems.
2. Provide alternate ways to access video and audio content
Videos and audio files (like podcasts) have become more and more embraced by cities. But what if someone can’t see a video? Or what if someone can’t hear the audio? Provide alternate ways for people to access the content. For example:
- Offer closed-captioning for videos with audio content. Some video services will do this automatically for you (although it’s a good idea to spot check the quality of the closed-captioning) or you can do it manually.
- Offer transcripts for videos and audio files.
- In some cases, a summary description may be sufficient for visually-heavy videos with little spoken word or a lack of heavy substance.
3. Provide a clean, simple navigation and website structure
If your website is a structural mess, then it will be even worse for people with disabilities who try to navigate it with screen readers or keyboards alone. Your website’s information architecture (meaning the way your webpages are structured and organized) needs to be as simple and clean as possible. For example, you wouldn’t want to clutter your homepage with a dozen things about your city’s history while barely mentioning or providing links to your most important city services.
4. Work with your designers to ensure that people can adjust colors and font sizes with ease
Many disabled people with vision problems often need to adjust the contrast and sizing on their computers to see what’s on their screen. While the design specifications for ensuring ADA compliance are complex, most modern websites allow disabled people to adjust contrast and sizing. If you’re not sure about your city’s website (especially if you haven’t modernized it in a long time), then ask someone with website design experience to help you assess this aspect of accessibility.
5. All content should be accessible by keyboard alone
Some disabled people cannot use a mouse and click on website content such as buttons or links. They need to rely only on a keyboard to get to it. If you have content on your website inaccessible by keyboard, then make it accessible as soon as possible. You should also consider adding a “skip navigation” link so that keyboard users can skip the often long navigation tabs (the ones seen on every page). That will save those people from wasting a lot of time.
6. Avoid flashing images
Luckily, most modern websites avoid flashing images because they look tacky. However, if you are tempted to use them then consider that they may cause seizures in some people.
7. Follow writing best practices
Write simply, clearly, and concisely. This is a good best practice anyway but it also helps disabled people who need information stated as clearly as possible. Rambling text, typos, and bad grammar prevent you from communicating to your audience. Consider hiring a professional writer to write your content if you’re unable to ensure a high writing standard.
8. If you hyperlink text, then make sure it’s descriptive
9. Offer an alternate version of PDF documents
“Click here” is not descriptive. “January 5, 2017 City Council Agenda” is descriptive. When disabled people use screen readers, they often look for links to take them to another webpage. Make the text you hyperlink contain a specific description instead of something vague.
Unfortunately, screen readers cannot read PDF documents. If the thought of converting tons of PDF documents to HTML or rich-text format horrifies you, then talk to your IT staff or vendor. You may be able to find a tool that can convert your PDFs to HTML. Then, it’s a matter of going through the PDFs you offer on your website and creating HTML versions of each document.
10. Avoid cutting and pasting pre-formatted content to your website
When city employees upload content to websites, we often find that they make the mistake of posting pre-formatted content. For example, people may cut and paste content from a Microsoft Word document to the city’s website. The problem? Microsoft Word content contains a lot of HTML code that makes sense when you’re working in Microsoft Word—and not so much sense when you transfer it somewhere else. That’s why what looked great in your word processing software can look awful on your website.
Usually, cutting and pasting into Notepad first (a free application that comes with nearly all computers) and then cutting and pasting the Notepad version into your website’s content management system will remove junk formatting and convert your words into clean, plain text.
Following these best practices will give you a good head start for making your website ADA-compliant. For more detailed best practices, refer to the following resources.