Designing a website that’s as much successful as it is effective takes time, skills, and a lot of testing. Normally, when we’re talking about web design and we hear the word testing, the first thing that comes to mind is usability, and that’s fine, but when was the last time you sat down to analyze the level of accessibility of your website?
Testing on other aspects of your website are important, however, a lot of us seem to neglect our websites accessibility. This can ultimately lead to the loss of a wide range of users and poor elements of design.
But not to fear, below we’ve compiled a set of tools that will help you combat poor accessibility. Every tool is free to use and has been chosen because it’s easy to use and offers quality testing.
Color Blindness Simulator
The Colour Blindness Simulator will help you assess how accessible images and colors are seen through the eyes of an individual who is color blind. You’re able to quickly upload a JPEG image of about 1000px by 1000px and analyze how you’ll be able to make your webpages more accessible to users that may be color blind.
Juicy Studios Image Analyzer
With this tool we’re able to examine each and every image found on a specified web page for accessibility problems. The tool will carefully examine the width, height, alt, and longdesc attributes to determine if they are fitted with their corresponding values. The accessibility on your website also depends on how well users are able to interact with images and how they are displayed. This why the Image Analyzer is a great tool.
Firefox Accessibility Extension
If you’re a part of the large portion of designers that use Firefox, then this is an important extension to have. This Firefox add-on allows you to cross-examine and actively inspect every element of design on your web pages. You can quickly create lists for images and other elements and you’ll be informed if they’re standard compliant or if they have issues that need to be addressed. Also, one other nifty feature is that you’re able to run 3rd party apps such as the the W3C HTML Validator and more from the toolbar.
Test and Improve Readability
This free online tool allows you test and measure the readability of articles and/or any form of content. A few things it tests for are: Grade Level, ARI (Automated Readability Index), Flesh Kincaid, SMOG, and more. This tool will also determine the amount of comprehension and level of education of the user who will be reading the specified content. Because testing for readability is coherent with improving your websites accessibility, make sure you take this tool seriously, and take steps to improve where content needs improvement.
Broken links make webpages and other areas of your website unaccessible, this is why it’s important to use a tool such as LinkPatch to check the amount of broken links on any URL you choose. With LinkPatch you can achieve the above and, install your “tracking” code in a few seconds, make use of the great user interface, you’ll have smart notifications, and a round-the-clock monitoring.
AccessColor tests the color contrast and color brightness between the foreground and background of all elements in the DOM to make sure that the contrast is high enough for people with visual impairments. Assuring that you provide enough color contrast between foreground and background colors takes time and we hope that this tool will help web developers to build accessible websites by visually flagging the section(s) of a page with problematic color combinations. AccessColor will find the relevant colour combinations within your HTML and CSS documents rather than requiring you to find each value to input yourself in order to test the contrast between each colour combination.
aDesigner is a disability simulator that helps designers ensure that their content and applications are accessible and usable by the visually impaired. Voice browsers and screen readers read aloud the text on Web pages and are used by visually impaired people. However, these devices are less effective with certain kinds of content, such as highly graphical material. Web developers can use aDesigner to test the accessibility and usability of Web pages for low-vision and blind people. aDesigner also helps users to check accessibility of ODF documents and Flash content. It also has accessibility information (MSAA/IA2) inspection functions.
Accessibility Gurus to Follow on Twitter
Shawn Henry → Tweet
Shawn Henry leads worldwide education and outreach promoting web accessibility for people with disabilities at the W3C Web Accessibility Initiative (WAI). Shawn focuses her personal passion for accessibility on bringing together the needs of individuals and the goals of organizations in designing human-computer interfaces.
Alan Colville → Tweet
Alan is a user experience designer and founding member of Analog. Having worked on the Web since 1996, his clients include BlackBerry, Vodafone Visa, and Telewest (now Virgin Media). Alan resides in Bristol, England.
Shay Howe → Tweet
Shay Howe is a professional web and user interface designer currently living in Chicago, IL.
Dr. Peter J. Meyers → Tweet
Dr. Peter J. Meyers (AKA “Dr. Pete”) is the President of User Effect and a cognitive psychologist.
Theresa Neil → Tweet
Theresa Neil is an Experience Designer in Austin, Tx, and co-author of “Designing Web Interfaces: Principles and Patterns for Rich Interactions” O’Reilly Media, 2009. Her newest project is the DesignGalleRIA, a tumblelog showcasing the best Rich Internet Application designs.
Your turn To Talk
I hope you liked this post! Please take a minute to share your thoughts by leaving a comment below :)