Decades ago, when I was a young girl, my family was taking a road trip to Canada. We were playing a game reading signs with my mother. My mother pointed to a specific green sign with yellow text and asked my younger brother to read it. He was upset because he wasn’t seeing the words on the sign, and he thought we were playing a joke on him. The following image comes from allaboutvision.com. It’s a great visual display of how a person with red-green color-blindness, would struggle to interpret content on a sign or website if the colors weren’t set to an accessible contrast.
At AgencyQ, part of designing, building, and maintaining websites today includes accessibility. In 1998, Congress amended Section 508 of the Rehabilitation Act of 1973 to include electronics and information technology. Today, we have standards we must follow to adhere to 508 compliance. The section508.gov site lists Web Content Accessibility Guidelines (WCAG).
I find the statistics of the population with accessibility needs staggering. The following is a list of statistics from monsido.com:
We typically think of sight-impaired individuals when we talk about accessibility on websites. Devices called screen readers to aid blind users to interpret the content on a webpage. But there is a list of other disabilities we account for as well.
Sight impaired individuals have varying degrees of blindness. When I was growing up, my father would come home from work, loosen his tie, set his hat on the kitchen desk, and his suit jacket would drape over the desk chair. He would take his drink into the Family Room, settle in his favorite easy chair, and read the newspaper until it was time for dinner. Many years later, on one of my trips to visit, he was settled into his easy chair, newspaper in his lap, but now he had a 6” diameter magnifying glass and a bright light hovering over the paper. You see, he had lost an eye, and the remaining eye only had partial vision. Today, we can build websites to increase font size, and devices can add a higher level of light contrast.
In web design, we consider color contrast. Yellow on green, red on black, or white on light blue, can be unreadable for someone who is colorblind. We have online tools available to determine the percentage of contrast when we design.
For users with cataracts, migraines, macular degeneration, or many other ailments leading to blurry vision, text must be able to zoom to 200%.
A screen reader is a device used by the blind to relay information to them either through braille or voice from a website. This is where development plays a large role in accessible websites. The page should have options for the user to skip navigation, tab through headings, and relate information from a table correctly. I’m sharing a video below that was an eye opener for me.
Do you remember the story about my father needing the help of a large magnifying glass and high light to read the paper? Did you get a visual in your thoughts about what that looked like? These details are important in adding a value to an alternate text field (alt tag) for images. You are giving the user a verbal description of the image so they can relate to the content. Alt tags are required on all images.Videos with voice overs should be close captioned for users with hearing impairments. When transmitting live content, providing a sign language interpretation is also beneficial.
Close captioning also helps users who need to watch a video in an environment with a lot of background noise, or an area where they need to turn off the volume of their device.
Loss of Motor Function
A physical loss of motor function may be permanent or temporary. Nervous disorders that cause tremors, arthritis, loss of limb, or a spinal injury are all permanent motor function losses. A mother carrying her child while trying to manipulate a touchpad on her phone with one hand is a temporary loss of motor function. Devices to aid in accessibility for loss of motor function include:
In the design phase, agencyQ keeps the page clean and easy to comprehend. Links and call to action (CTA) buttons are clearly displayed and allowed enough room for the user to touch without overlapping adjoining CTAs. The page again needs to have the ability to be 100% keyboard driven without requiring the use of a mouse.
Dyslexia is one of the most common learning/reading disabilities. Here are some statistics from hootbooks.app:
One of the ways AgencyQ adds accessibility to sites for users with Dyslexia is through icons and clean design. Imagine having difficulty reading because letters sometimes become jumbled for you. When trying to read a link address, or heading, a user with Dyslexia can be overwhelmed. Too much text on a page can look like alphabet soup. We add icons prior to some links and headings to simplify the consumption of the content. A picture of an envelope is a common form of expressing that the following link will be an email. An external link icon will tell the user they will be directed to another site.
Clean design and ‘chunks’ of content allow the user to understand the concepts on the page without becoming overwhelmed.
Here is a list of items AgencyQ includes in our designs for accessibility:
The following statistics come from WECO:
To reduce the risk of seizures while using a website, AgencyQ follows the recommendations provided by the WCAG. They include:
Cognitive and intellectual disabilities include memory, attention, and comprehension. Our design team is trained to keep designs simple by using white space and correctly using headings. Icons and graphics are used for users with low reading skills. Navigation is carefully thought out and easy to use.
The United Nations has deemed Web Accessibility a basic human right.
The Americans with Disabilities ACT (ADA) includes websites as they are a place of public accommodation. Below are a few points from ADA:
At AgencyQ, we are the champion of customer experience. When sites are correctly designed, developed, and edited, generally all users have equal access to information and functionality. Our designers, developers, and content editors, all adhere to 508 compliance standards.
I mentioned personal relationships with people who have disabilities. We all know someone, a family member, neighbor, friend, or coworker, who has a disability. By providing a highly accessible site, AgencyQ is giving users the opportunity to access the sites we build without excluding content because of their disability.
References and links for more information are listed below:
https://en.wikipedia.org/wiki/Web_accessibility
https://www.templatemonster.com/blog/designing-colorblind-friendly-website/
https://uxdesign.cc/web-accessibility-for-hearing-impairment-3f49fc7b5a34
https://www.telerik.com/blogs/motor-disabilities-and-what-you-need-for-accessibility
https://usabilla.com/blog/how-to-design-for-dyslexia/
https://theweco.com/websites-seizures-developing-accessibility/
https://siteimprove.com/en/blog/cognitive-disabilities-and-web-accessibility/
https://www.w3.org/WAI/business-case/archive/soc
https://www.ada.gov/pcatoolkit/chap5toolkit.htm
https://medium.com/@krisrivenburgh/the-ada-checklist-website-compliance-guidelines-for-2019-in-plain-english-123c1d58fad9
https://www.section508.gov/
https://www.allaboutvision.com/conditions/colordeficiency.htm
https://www.youtube.com/watch?v=3f31oufqFSM
https://monsido.com/blog/accessibility-statistics
https://www.youtube.com/watch?v=dEbl5jvLKGQ
White Paper
How can you make sure your customer experience strategy is successful? These three simple rules will help get you started.
LEARN MORE ABOUT THREE RULES TO CX SUCCESSSign up to receive our latest insights right in your inbox.