WebAIM - Web Accessibility In Mind

E-mail List Archives

accesskeys - underlining letters

for

From: Matthew Lindop
Date: May 16, 2003 5:01AM



Apologies if this is a newbie question...

I know there are already quite a few accesskey recommendations based around
different number & letter keyboard combinations.

As the general consensus is that numbers should be used for generic
shortcuts pages (ie 1=home, 0=accesskeys etc), how about using the letter
keys, and visually indicating the accesskey by underlining the appropriate
letter?

So for your homepage link you could use

<a href="home.html" accesskey="h"><span class="un">H</span>ome</a>

[where class 'un' is text-decoration: underline]

For keys already assigned by the browser's menus, use the next available
letter in the word, eg

<a href="biographies.html" accesskey="i">B<span
class="un">i</span>ographies</a>

php.net is already using this in a small way with its search accesskey:

<u>s</u>earch

When extended to the navigation bar of a site, this solution seems to
combine clarity with accessibility.
It is also a really prominent indication to all that you care about these
things (you could even have a link called 'why are some letters underlined?'
linking to your 'About this site' page).

The one downside we can think of is that screen readers will trip up over
the link text because of the span tag ("H - ome") - any suggestions?

Thanks

Matt Lindop
www.WebProjects.co.uk



----
To subscribe, unsubscribe, or view list archives,
visit http://www.webaim.org/discussion/