Internal Accesskeys

11th Oct 2006

It's probably not a new concept nor is it rocket science but it's helluva useful and I haven't seen it anywhere else. And in the light of the recent flurry of blog posts questioning what web accessibility actually is it puts things in a clearer light, from my own perspective anyway. I'm talking about Accesskeys. Not the plain old hyperlink Accesskeys you are probably aware of but Internal Accesskeys.

This isn't a diatribe about defining what accessibility is or isn't. From my viewpoint there's a vast grey area stretching between Accessibility and Usability; two seperate subjects in almost any other area of daily life but on the web (and when it comes to designing websites that work) they share a lot of common ground. Having a 'usable' site should be the main aim of any professional web designer. And what better way is there to make your site more usable than letting your visitors set their own Accesskeys?

It's easy to provide this functionality because Dan Champion has already produced a simple to use and highly effective PHP script that you can implement into the accessibility page on your site. Gez Lemon produced a similar script in ASP. I've been using Dan's script for a while now and it occured to me that the handiest shortcut keys are missing from all the implementations I've made so far: back to top and jump to content.

It's simple to update Dan's script to include these extra internal links. If you check out Dan's script you'll find a multi dimensional PHP Array declared near the top called $accesskeypages; this array lists all the pages you want to provide an accesskey for. Below is an example of how I've updated this array in a recent site (The Bard Game) with my additions in bold:

$accesskeypages = array(
"index.php" => array("token" => "home", "default" => "", "label" => "home"),
"sitemap.php" => array("token" => "sitemap", "default" => "", "label" => "site map"),
"contact.php" => array("token" => "contact", "default" => "", "label" => "contact us"),
$_SERVER['PHP_SELF']."#content" => array("token" => "jumpto", "default" => "", "label" => "jump to content"),
$_SERVER['PHP_SELF']."#top" => array("token" => "top", "default" => "", "label" => "top of page"),


This takes the current page and appends an internal link.

And, because I usually sit with my left hand on the keyboard (Alt+Tab between pages all the time), I find that setting 'jump to content' as Alt+z and 'back to top' as Alt+a work well. Also, once or twice I had problems getting Dan's script to work. The reason was down to a conflict in setting cookies. The solution was to include the Accesskeys script before any other scripts.

I hope you find this useful.