11 tools to improve your sites accessibility.
Written by: Paul Anthony | October 8, 2009
Catering for Accessibility is something which should be at the forefront of every web developers and designers mind. It is all of our responsibility to ensure the experience we provide on the web is as trouble free for ALL users. Prior to going live, take a look at some of these tools and run your site through them to see how it performs from an accessibility perspective.
Colour Tools
Colourblind Web Page test
URL: http://colorfilter.wickline.org/
This invaluable tool allows you to run your live site through a series of colour blind “filters” – highlighting any problematic areas before you are too far into your production cycle. It covers the three types of colourblindness – protanopia, dueteranopia and tritanopia.
Colourblind Image test
URL: http://www.etre.com/tools/colourblindsimulator/
Similar in nature to the tool above, this allows you to upload a JPEG rather than specifying a web page URL. If you’ve only got to the mockup stage, rather than a prototype – its a great testing tool.
Juicy Studio – Luminosity Contrast
URL: http://juicystudio.com/services/luminositycontrastratio.php
Guideline 2.2 of the web accessibility Guidelines suggests that the contrast between foreground and background color combinations provide sufficient contrast when viewed by someone having color deficits or when viewed on a black and white screen. This tool uses an algorithm to determine if you are doing so, albeit by inputting the colours you intend on using manually.
The Accessibility Colour wheel.
URL: http://gmazzocato.altervista.org/colorwheel/wheel.php
Whilst the contrast tool provided by Juicy Studio offers a manual entry of the colours, followed by a contrast ratio; this tool allows you to utilise the provided colour wheel to select the colours which are used within your web design via the mouse, and the contrast ratios are provided in real -time.
GrayBit
URL: http://graybit.com/main.php
Graybit converts any web page to grayscale, allowing you to quickly determine if the contrast is sufficient for those visually impaired visitors who may have difficult distinguishing between low contrast colours.
Check My Colours
URL: http://www.checkmycolours.com/
Check my colours offers another easy to use contrast checker which dives into your HTML and CSS and highlights the problematic styles – all from the browser.
Web Accessibility Flicker Rate Test
URL: http://tools.webaccessibile.org/test/check.aspx
Some web viewers may have photosensitive epilepsy, this tool checks animated gifs and web page flicker to see if you are likely to set off a seizure. Hopefully the web is learning from web design mistakes of 1990, and the faithful animated gifs is less likely to make an appearance in a professional design.
Readability Tools
Juicy Studio Readability Tool
URL: http://juicystudio.com/services/readability.php
The Juicy Studio readability tool uses mathematical formulas to determine readability, in keeping with the guidelines set out by the W3C. Useful for blog articles as well, it may highlight places that require sentences and prose to be broken into more comprehensible parts.
Compliance Tools
WCAG are guidelines set out by the World Wide Web Consortium. These are the closest thing we have to official usability standards on the web. Compliance tools help highlight potential areas of your site that may have usability issues – validating against WCAG.
Web Aim Accessibility Tool
URL: http://www.wave.webaim.org/wave35/index.jsp
The Wave accessibility tool marks online pages of your choice with icons revealing the accessibility of that page. It easily allows you to see at a glance sections of your site in need of attention.
Total Validator
URL: http://www.totalvalidator.com/
Total Validator is a free one-stop all-in-one validator comprising a HTML validator, an accessibility validator, a spelling validator, a broken links validator, and the ability to take screenshots with different browsers to see what your web pages really look like. It also offers a useful Firefox extension.
Truwex
URL: http://checkwebsite.erigami.com/accessibility.html
Truwex manages website compliance with web accessibility and provide WCAG1 priority 2, WCAG1 priority 1 and Section 508 all from the one online tool.
Topics: Web Site Design | View Comments
Posted on 08 October 2009 by Paul Anthony
Paul is a multi-disciplined individual, although he currently works as a software developer for an independant e-commerce provider in Northern Ireland.
Over the past fifteen or so years he's taught himself the fundamentals of at least two programming languages, the jedi art of SEO and web marketing - and showcases these skills in a personal capacity on his own website - Webdistortion.
During the little spare time that he has - Paul has taught himself to play guitar and occasionally enjoys rocking out with his proverbial out. He's also currently trying to master the Saxophone.
You can connect with Paul on Twitter - or via his own blog on Webdistortion.
Paul Anthony has written 5 articles for Cloud Mixer
October 9th, 2009 at 00:28
[...] This post was mentioned on Twitter by cloudmixer and Angie Haggstrom. Angie Haggstrom said: RT @cloudmixer: Blogged:- 11 tools to improve your sites accessibility. http://bit.ly/fULPC [...]
October 9th, 2009 at 06:54
Dammit Paul, this list means I have just destroyed my whole schedule for the day playing with all these tools to see what they do, thanks a bunch! :P
Out of them all do you have any preference or any that you have found to be particularly effective?
October 9th, 2009 at 11:54
Dammit Paul, this list means I have just destroyed my whole schedule for the day playing with all these tools to see what they do, thanks a bunch! :P
Out of them all do you have any preference or any that you have found to be particularly effective?