Posted by on Friday, March 19th, 2010 at 12:08 pm.
Hi and welcome to this week’s web design video blog. As we mentioned last time, this week we are going to look at HTML Accesskeys and ask if they are worth using on your website.
So for those of you who don’t know what Accesskeys are, they are essentially keyboard shortcuts that allow the website user to instantly jump to different parts of a web page or website. PC users do this by holding ALT and pressing the appropriate key, or CTRL if using an Apple Mac instead. Accesskeys were designed to aid Internet users with mobility issues who predominantly use the keyboard instead of the mouse for negotiating websites.
The only problem with Accesskeys at the moment is that they are still rarely used or understood by web designers. Unlike most computer shortcuts, Accesskeys rely on being installed and being correctly implemented by the web designer for them to work.
The best place to start with HTML Accesskeys is to learn the standard or guideline for distributing and defining Accesskeys on your website. In the UK, there are government guidelines for defining Accesskeys that British based websites should adhere to. These are:
UK Government recommendation for Accesskeys
- S -- Skip navigation
- 1 -- Home page
- 2 -- What’s new
- 3 -- Site map
- 4 -- Search
- 5 -- Frequently Asked Questions (FAQ)
- 6 -- Help
- 7 -- Complaints procedure
- 8 -- Terms and conditions
- 9 -- Feedback form
- 0 -- Access key details
The Skip Navigation shortcut should direct users below the navigation and to the start of the primary content. Access keys 1 through 9 are page navigation short-cuts to take users to specific pages or forms on your website. The ’0′ Accesskey should take your users to your Accesskey information page that explains to users how they can use Accesskeys and which are available on your website.
In order to install Accesskeys on your website, it is important to understand what HTML elements they can be added to. At present, they can be used for following tags: A, AREA, BUTTON, INPUT, LABEL, LEGEND and TEXTAREA.
This obviously means that Accesskeys are not exclusive to activating links. If we refer back to the UK standard for Accesskeys -’ Number 4′, should take users to your search facility. Therefore applying the Search Accesskey to a search form’s ‘input field’ allows users to use an on-page search form, which may be more beneficial than redirecting users to a dedicated search page.
A good example of this use of the Search Accesskey can be seen on the BBC News website. As you can see, if you activate Accesskey 4 -- the cursor jumps into the search box without use of the mouse or tab button.
Are Accesskeys Worth Installing?
If we go back to our original question, ‘Are Accesskeys worth installing?’ we believe the simple answer is yes. For a start, Accesskeys are being maintained and promoted in HTML 5 and they provide increased accessibility to your website. Setting up Accesskeys based on the recommended standards should only take a couple of hours to install, and only has to be done once.
Although Accesskeys were invented over 10 years ago, web designers are taking more steps than ever to improve accessibility and usability on their websites. Search Engines favour websites that take Accessibility and Usability into account, so integrating Accesskeys onto your web pages correctly can only be ticking a box on many levels.
Thank you for watching this week, we’ve added some links and more information about Accesskeys on our supporting blog post at crearedesign.co.uk/blog/videos/.
Next week we will be looking at Shadows in CSS3.
