Ask Dave Taylor
  • Facebook
  • Instagram
  • Linkedin
  • Pinterest
  • Twitter
  • YouTube
  • Home
  • YouTube Videos
  • Top Categories
  • Subscribe via Email
  • Ask A Question
  • Meet Dave
  • Home
  • HTML & Web Page Design
  • Accessibility Tools for Web Developers?

Accessibility Tools for Web Developers?

June 2, 2018 / Dave Taylor / HTML & Web Page Design / 1 Comment

I’m working on a Web site for a client and need to ensure that it’s accessible for people of varying ability. What are the best resources to help me out?

Web site design for accessibility is a critical question applicable to more people than you might realize. It’s also a topic that too many Web designers simply ignore. After all, if they aren’t visually impaired and have excellent vision, doesn’t that mean everyone else does too? Maybe, maybe not. In fact, color vision deficiency (also known as CVD) affects approximately 1 in 12 men (8%) and 1 in 200 women in the world. In England alone this means that there are approximately 2.7 million color blind people (about 4.5% of the entire population), most of whom are male.

The most common form of color blindness involves what’s known as red/green color blindness, otherwise known as deuteranopia. Consider the following image of apples with both normal color vision (on the left) and deuteranopia:

deuteronopia-apples

source: https://en.wikipedia.org/wiki/File:Apples.jpg

Luckily, seeing the world through the eyes or experiences of those requiring additional consideration when they browse the web is as easy as a set of tools anyone can use for free. I checked in with my friend and Web developer Mario Lurig (his latest site is HeroMuster) and here are some of his recommendations:

colororacle logoFirst off, ColorOracle, a color-blindness simulator available for Windows, MacOS, or Linux. Simple, compatible with a wide variety of graphics editors and systems, it lets you essentially use your computer as if you had a form of color vision deficiency. Quite eye-opening as there are a lot of sites that get more confusing or downright unusable…

If your audience is part of an older generation, they may be suffering from blurry vision, glaucoma, or maybe just work in an environment with poor lighting. All of these conditions can be simulated using a Google Chrome extension called NoCoffee Vision Simulator.

What about those that are legally blind and use a screen reader? That’s where WAVE comes in, the Web Accessibility Evaluation Tool. You give it a URL and it analyzes the page and design, returning a list of errors, warnings, and suggestions for those who accessed the same URL with a screen reader. The most common issue: images with alt attributes describing the image. It can be a lot of work to get things 100% compatible too. Here’s how the AskDaveTaylor home page looks once analyzed by the WAVE software:

askdavetaylor wave analysis

The final tool offers more testing than just accessibility, but since it’s part of building an accessible site in the first place, it’s worth a mention. From Google, the Lighthouse extension performs an audit on a web-page for performance, accessibility, progressive web app, SEO, and best practices. It’s always a good idea to optimize not just for accessibility but the various other factors critical to Web site success.

Let’s Stay In Touch!

Never miss a single article, review or tutorial here on AskDaveTaylor, sign up for my fun weekly newsletter!
Name: 
Your email address:*
Please enter all required fields
Correct invalid entries
No spam, ever. Promise. Powered by FeedBlitz
Please choose a color:
Starbucks coffee cup I do have a lot to say, and questions of my own for that matter, but first I'd like to say thank you, Dave, for all your helpful information by buying you a cup of coffee!
accessibility, accessible web, color blindness, vision, web accessibility, web design

One comment on “Accessibility Tools for Web Developers?”

  1. Sanjay Nasta says:
    June 5, 2018 at 8:40 am

    Dave,

    Thank you for bringing attention to this important issue. Vision issues such as Color blindness is indeed one of the issues you have to check for. However, there are a list of issues that you have to deal with to make a website accessible–mobility, hearing, cognitive, etc.

    Generally for a website to be considered acceptable it has to meet the WCAG AA standard. Our Vivian Cullipher wrote a checklist based on WCAG AA at https://www.microassist.com/digital-accessibility/digital-accessibility-checklist/.

    Great start on the tools as well. Automated accessibility testers are a great start. It is important to do some manual testing by using screen readers (such as JAWS, NVDA, etc.) Believe it or not your keyboard is a great accessibility tester–you can test if a visitor can use your website without a mouse (can you Tab through form fields for example). There’s a good list of common issues and tools at https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility

    Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Search

Recent Posts

  • What’s the Difference Between Chrome, Chromium, and ChromeOS?
  • Add a “Work” Address Shortcut to Google Maps for Android?
  • How Do I Disable The Empty Trash Confirmation in Windows?
  • How Consultants Can Help Digital Businesses Become More Competitive
  • How Can I Force An Apple Watch WatchOS System Update?

On Our YouTube Channel

DREO 6.8QT Air Fryer Pro - DEMO & REVIEW

NAENKA Runner/Diver Bone Conduction Headphones -- DEMO & REVIEW

Categories

  • AdSense, AdWords, and PPC Help (106)
  • Amazon, eBay, and Online Shopping Help, (161)
  • Android Help (195)
  • Apple iPad Help (144)
  • Apple Watch Help (52)
  • Articles, Tutorials, and Reviews (344)
  • Business Advice (199)
  • Chrome OS Help (22)
  • Computer & Internet Basics (757)
  • d) None of the Above (164)
  • Facebook Help (381)
  • Google, Chrome & Gmail Help (176)
  • HTML & Web Page Design (244)
  • Instagram Help (47)
  • iPhone & iOS Help (602)
  • iPod & MP3 Player Help (173)
  • Kindle & Nook Help (92)
  • LinkedIn Help (85)
  • Linux Help (162)
  • Linux Shell Script Programming (86)
  • Mac & MacOS Help (887)
  • Most Popular (16)
  • Outlook & Office 365 Help (24)
  • PayPal Help (69)
  • Pinterest Help (53)
  • Reddit Help (17)
  • SEO & Marketing (81)
  • Spam, Scams & Security (92)
  • Trade Show News & Updates (23)
  • Twitter Help (217)
  • Video Game Tips (66)
  • Web Site Traffic Tips (62)
  • Windows PC Help (910)
  • Wordpress Help (204)
  • Writing and Publishing (72)
  • YouTube Help (45)
  • YouTube Video Reviews (159)
  • Zoom, Skype & Video Chat Help (56)

Archives

Social Connections:

Ask Dave Taylor


Follow Me on Pinterest
Follow me on Twitter
Follow me on LinkedIn
Follow me on Instagram


AskDaveTaylor on Facebook



microsoft insider mvp


This web site is for the purpose of disseminating information for educational purposes, free of charge, for the benefit of all visitors. We take great care to provide quality information. However, we do not guarantee, and accept no legal liability whatsoever arising from or connected to, the accuracy, reliability, currency or completeness of any material contained on this site or on any linked site. Further, please note that by submitting a question or comment you're agreeing to our terms of service, which are: you relinquish any subsequent rights of ownership to your material by submitting it on this site. Our lawyer says "Thanks for your cooperation."
© 2022 by Dave Taylor. "Ask Dave Taylor®" is a registered trademark of Intuitive Systems, LLC.
Privacy Policy - Terms and Conditions - Accessibility Policy