Introduction

JATH is a JavaScript intended to highlight accessibility errors on the page. It can be added to your template during development or used as a bookmarklet on any page (see Documentation#Bookmarklet).

Usage

Setup

To add JATH to your page or template, simply add the following code to your script:

<link rel="stylesheet" type="text/css" href="http://jath.googlecode.com/svn/trunk/jath.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://jath.googlecode.com/svn/trunk/jath.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('body').jath();
	});
</script>

If you already include jQuery, remove that script line to prevent including it twice. This code points at the latest version of JATH online. Development occurs on branches so the trunk should, hopefully, be stable. No guarantees though.

So, if you don't want changes as they are committed to the project, just download jath.js and jath.css and point the scripts to your local copy.

If you know jQuery you've probably guessed that you can apply JATH to something other than the body. Just change the jQuery selector to the appropriate element if you want to target a smaller piece of your page.

Exclusions

JATH tests for multiple accessibility errors, and more will be added over time. If you don't want to test for a particular error, you can exclude it.

Currently available tests which can be ignored are:

• labels Check that all input elements other than hidden inputs or buttons have either a label tag pointed at them or a title.
• radios Check that radio buttons are inside fieldsets.
• alts Make sure images have alternative text specified.
• captions Make sure tables have captions or summaries.
• headers Make sure tables have appropriate headers.
• legends Make sure fieldsets have legends.
• color Make sure color is not used as the sole means of identifying text.

Just change the code above to specify the elements to ignore:

<link rel="stylesheet" type="text/css" href="http://jath.googlecode.com/svn/trunk/jath.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://jath.googlecode.com/svn/trunk/jath.css"></script>
<script type="text/javascript">
	$('body').jath({
		'ignore':['labels','alts','color']
	});
</script>

Bookmarklet

JATH can also be used as a bookmarklet, if you just want to check an individual page now and then. Simply create a bookmark with the following code for the URL:

javascript:(function(){var head=document.getElementsByTagName('head')[0],script=document.createElement('script');script.type='text/javascript';script.src='http://jath.googlecode.com/svn/trunk/jath-loader.js?' + Math.floor(Math.random()*99999);head.appendChild(script);})(); void 0