How I Made My Websites More Accessible for People with Disabilities
Effective communication, and Communicating with FINESSE, is the responsibility of the message sender and not the paid professionals
Both of my websites are currently undergoing major updates, so it is a good time to check both for their accessibility for disabilities. Disabilities associated with communicating via a website include blindness and low vision, deafness and hearing loss, learning disabilities, cognitive limitations, limited movement, speech disabilities, and photosensitivity.
Two Websites
JD Solomon Solutions is our business website. The site was created by a professional web developer in January 2020 and received an update in October 2021 by a different web developer. Except for a few minor text and visual changes, I had not performed a dep-dive into the site details.
Communicating with FINESSE is a professional website for a not-for-profit community that I founded in early 2022. The site was created with a friend-of-a-friend, who would become a part-time employee, and me using WIX. The site went live in late March 2022.
Our Focus on Accessibility
Both sites were swept to identify accessibility issues. There are the major things that we modified.
1. ALT Text for images
Alternatives for any non-text content, usually images, are provided so that the non-text content can be changed into other forms people need, such as large print, braille, speech, symbols, or simpler language.
Most of us are prompted for ALT Text whenever we add a picture to some form of written content.
We were missing a lot of ALT Text. Most surprisingly, more ALT Text was missing from the business website that two professional web developers had developed.
Remember, too, that web search engines use the ALT Text when they crawl your website in search of keywords. ALT Text has power beyond making your site more accessible to people with disabilities.
2. Contrast
Contrast relates to the visual presentation of text, images, and background combinations. Industry guidance is a contrast ratio of at least 4.5:1.
In our cases, most of our contrast ratios met the standard. However, there were some issues with grey text on dark blue and white text on orange. The trouble was that both entities used color pallets developed by paid branding professionals. In the case of JD Solomon Solutions, the branding professional and the website developer belonged to the same firm.
We were lucky in both cases that the contrast issues were not widespread. In some cases, we changed the font colors. In most cases, we changed the background contrast level from 56 percent to 46 percent and the desired ratio was obtained with no real visible difference. In other words, we were lucky because we were close to begin with.
3. Heading Types
Headings and labels describe the topic or purpose. Headings and labels are important for the disabled because they provide the flow of how the information fits together.
In our case, the issue related to several tables we used on pages to provide details. In two cases, there was not enough original attention paid to the H2 and H3 headings and their relationships.
Getting the heading types right in the text is usually easier than in tables. Or at least tables provide more room to get sloppy.
4. Link Text (shapes that redirect)
The industry guidance is that purpose of each link can be determined from the link text alone or from the link text with its programmatically determined link context.
Our issues came in the form of text boxes that linked to other pages. The main problem was that the text was not brief and concise. For example, one rule is to keep the text to no more than two words.
This issue was not a widespread problem and was mostly related to being a little sloppy. Making the text more concise helped the readability for all users.
5. Ability to Zoom
A standard is the text can be resized without assistive technology up to 200 percent without loss of content or functionality, except for captions and images of text.
We had one exception, in total, on both websites.
Web Content Accessibility Guidelines
Web Content Accessibility Guidelines (WCAG) 2.0 and 2.1 covers a wide range of recommendations for making web content more accessible. The standard has been around since the mid-2000s and is continually reviewed and updated. Unfortunately, in practice, the guidelines are often not followed strictly unless an entity must be compliant and audited.
Four Principles
Four principles are used to group the recommended guidelines.
Perceivable includes providing text alternatives for any non-text content so that it can be changed into other forms people need (such as large print, braille, speech, symbols, or simpler language), creating content that can be used in different ways, and easier for users to separate the message from background noise.
Operable includes making all functionality available from a keyboard, providing users enough time to read and use content, and finding ways to make it easier to navigate (or not get lost).
Understandable is all about making text content readable and understandable and making the pages appear and operate in predictable ways.
Robustness is concerned with maximizing compatibility with user agents, such as assistive technologies.
Do Not Forget the Basics
These are five basics that should be considered as a minimum standard.
- Do not contain anything that flashes more than three times in any one second or the flash is below the general flash and red flash thresholds. This may induce seizures.
- Avoid slang so that assistive devices can determine the default language. Avoiding slang and keeping language concise also provides a co-benefit for people with different native languages, These Tips Will Improve Your Presentations as a Non-Native English Speaker.
- Get the logic correct so that information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.
- Color should not be the primary visual means of conveying information, indicating an action, prompting a response, or distinguishing an element. Visit the CWF blog for articles such as “Do Park Here”: How Are You Communicating Effectively with the Color Blind?, Are Your PowerPoint Slides Ready for the Color Blind?, and Use These Colors To Convince A Decision Maker for more insight on colors.
- Always provide users enough time to read and use the content.
Moving to Action
The major upgrades to our two websites provided an opportunity to review and improve accessibility for disabilities. One lesson learned is not to assume that the paid professionals are automatically getting it right — the responsibility rests solely on the communication sender (you). Another lesson is that it does not take much effort to get it right, so it should be an easy decision to do it.
Hopefully, the five things we did and the six basics contained in this brief article provide you with the foundations for improving your website with people with impairments and disabilities. Are you communicating with FINESSE?
Founded by JD Solomon, Communicating with FINESSE is a not-for-profit community of technical professionals dedicated to being highly effective trusted advisors. Learn more about our publications, webinars, and workshops. Join the community for free.
