Accesskeys: Unlocking Hidden Navigation

by Stuart Robertson

126 Reader Comments

Back to the Article
  1. Hmm. I should have read the text at the top of the page. ;-)

    “Welcome to the ALA forum. HTML displays but does not render. To create a live link, simply type the URL. “

    Copy & paste the code below to embed this comment.
  2. No one has really discussed how to use accesskeys with form buttons. When these are used the action of the button (submit, javascript onfocus, etc.) kick off automatically. Which is okay as long as the user knows that. However, if you use input buttons you can not em/underline the name= parameter in the input element.

    Or does anyone have a work around for this?

    Copy & paste the code below to embed this comment.
  3. We are very concerned about accessibility on our Web site and I am interested in studying further about this. Thank you for the article.

    A comment re: Zociety Magazine

    I would recommend against activating the link on focus, as that means people can no longer tab through links if that is what they would prefer to do.

    The question is, what happens (using the first-letter scheme) if two menu items begin with the same letter? I’d guess only one of them will work.

    Also, we have decided for accessibility reasons that nearly all links on our site (except for a few buttons) shall be completely underlined, so that people who are not internet savvy do not have to figure out that a link is a link. Is there a way to double-underline the accesskey shortcuts?

    Copy & paste the code below to embed this comment.
  4. In the past, I purposely did not implement access keys because I didn’t like the idea of my access keys overriding a browser or operating system’s own shortcuts. I’ve since reconsidered and have struck this compromise – on pages with the main navigation at the page top, I have one access key that goes to the page top. I like this idea, and it reduces the need for “go to top” links on long pages. For an example, on the http://www.grandblancchamber.com/directory/members.asp page, there is a box that explains the access key shortcut because this is such a long page.

    At http://www.grandblancchamber.com every page has a link to Site Usage Tips, which explains how to use the access key of 1. After I set that up, I learned that numbers do not work in Opera and Alt+1 conflicts with the faily popular headings reading mode in JAWS.

    At http://www.suskiwebdesign.com, I use the letter n instead (warning, tutorials section of site needs lots of work). Now Opera is included, and I haven’t found any big time conflicts. “N” for navigation seems easy enough to remember.

    Any feedback to this idea is more than welcome. Building accessible websites is such a balancing act!

    Copy & paste the code below to embed this comment.
  5. Yes you can format buttons, including text within buttons. The “trick” is to not use <input type=“button” … > but instead use something like <button type=“submit” value=“Search” name=“submit”> Search </button>. See my site (www.GeorgeHernandez.com) for a working example of this.

    PS1: I didn’t use accesskey for HTML until this article because when I tried it out years ago it didn’t seem to work. It probably did work (i.e. it put focus on the link) but I didn’t do the next step of pressing ENTER. Doh!

    PS2: I tried to use ALT+D for Dictionary.com but through use I found that I definitely prefer to use ALT+D to get to the address bar, so bye-bye Dictionary.com :( .

    Copy & paste the code below to embed this comment.
  6. Thomas Baekdal (et al.)

    There’s a better, more transparent way (and certainly less time consuming) to make accesskey links in IE auto-link with focus.

    First of all, your approach has a fundamental flaw. What if the the user simply doesn’t have a mouse (or is not using it) and begins to tab through the document. OOPS! they get linked to the first one they focus on. Hardly a desirable result. Instead, the process should be make to trip only when the ALT key is pressed congruently with a focus trigger.

    Now, since we only want this for IE, we can use a DHTML behavior to trasparently and easily add this functionality to our links. First, add this to your css

    a { behavior: url(misc.htc) }

    Then, create the HTC file




    [removed]
    function focusHandler()
    {
    if ( element.accessKey && event.altKey )
    {
    element.click();
    }
    }
    [removed]
    </public:component>

    That’s it! You don’t have to touch the HTML of EVERY SINGLE link.

    Copy & paste the code below to embed this comment.
  7. yes you can format form buttons using the syntax George Henandex describes. Unfortunately at least some verisons of IE/Win submit the text of the button instead of the value. :(

    e.g. “<u>S</u>ubmit” instead of “Submit”

    Copy & paste the code below to embed this comment.
  8. Peter,

    Thank you, that is indeed a better way – and I did have a problem when people used TAB to navigate the document. In most cases we ‘solve’ the problem by applying tabindex=”-1”, but that presents another problem.

    Now, I feel somewhat foolish since I use the HTC behavior in other parts of the system (for something else)…

    Again, thank you!

    Copy & paste the code below to embed this comment.
  9. I have Opera 7.11 and tried ALT+accesskey
    However Opera opens its own menus and don’t support access key feature!

    Copy & paste the code below to embed this comment.
  10. I implemented the onfocus=“location.href(this.href); return false;” suggestion by Thomas Baekdal. Yes, it did eliminate hitting the enter key in IE 5.5 (Win95) and IE6 (Win2K). Unfortunately, using the back button of the browser to return to the page with the accesskey caused that page to immediately redirect back to the page that the accesskey points to. A rather odd behavior which does not happen in Netscape, but then, Netscape didn’t need it in the first palce.

    Copy & paste the code below to embed this comment.
  11. In Opera, use Shift+Escape+accesskey, see http://www.suskiwebdesign.com/sitetips.htm#mouse

    Copy & paste the code below to embed this comment.
  12. Having read the article and all the comments posted so far, I have a few of my own.
    1. Thanks Harold, for your info about iCab. This means that I do have a browser which supports access keys although it is one of those which requires that focus is somewhere within the page before it works. Shame the rendering engine is so disappointing.
    2. I have 10 other browsers residing on my OS9.1 iMac’s hard drive (I’m a hobbyist web designer) on none of which I can persuade access keys to work including the 3 versions of IE5/Mac which the article claims to be supportive, Apartness.
    3. The feeling that almost overwhelms when reading the comments is that this system is too flawed to be useful and maybe it’s best to wait for a better one to emerge such as CSS3 mentioned by Anne.
    4. Finally, I am going to follow the advice of the Canadian access group cited by John Foliot and not use access keys. Instead, I shall continue with a system based on correct structural markup and a logical tabbing order.

    Copy & paste the code below to embed this comment.
  13. http://www.alistapart.com/stories/accesskeys/discuss/3/#ala-1993
    “on pages with the main navigation at the page top, I have one access key that goes to the page top”

    Keyboards have a Key for that. “Pos1” is probably the better solution (works on every site and evey PC supports it)

    The main navigation is probably better done with standard <link /> tags in the <head> of the page.

    http://www.w3.org/TR/html4/types.html#type-links
    Browsers can assign consistent shortcuts (or speech commands, pen gestures, whatever) to these elements which makes them much more accessible.

    Copy & paste the code below to embed this comment.
  14. “on pages with the main navigation at the page top, I have one access key that goes to the page top”

    “Keyboards have a Key for that. “Pos1” is probably the better solution (works on every site and evey PC supports it)”

    Thanks for your idea – I should probably know this, but can you explain further what you mean by “Pos1”? I am aware that pressing the Home key always goes to the page’s top, and there is a PgUp key also. The reason I don’t rely on these is that if a user is tabbing through links on a page, pressing the Home key does not change the focus of the links. This means that even though the screen shows that you are at the top of the page after pressing the Home key, the next time you press the tab key to go to the next link, it won’t be to the navigation bar (using the layout of the interior pages on my personal site as an example), but to the next link from where your tabbing left off.

    “The main navigation is probably better done with standard <link /> tags in the <head> of the page.”

    I like this, too, and have recently started implementing this in addition to having one access key that goes up to the main navigation. Opera does a great job of making this obvious to users.

    Copy & paste the code below to embed this comment.
  15. I’ve “underlined characters to indicate accesskeys” for over 3 years now—probably because I read the HTML specification and thought it sounded like an obviously good idea.

    examples:
    http://www.EmanonSystems.com/
    http://www.MissionViejoMontessori.com/
    http://www.ExpandingVision.com/
    http://www.Heyer.us/
    http://www.SUTHouston.com/

    Copy & paste the code below to embed this comment.
  16. reply to:
    http://www.alistapart.com/stories/accesskeys/discuss/3/#ala-2012

    “what you mean by “Pos1”? I am aware that pressing the Home key always goes to the page’s top”

    I have a german keyboard so “home” and “pos1” seem to be the same key.

    “…top of the page after pressing the Home key, the next time you press the tab key to go to the next link, it won’t be to the navigation bar”

    Oh, I wasn’t aware of that. Opera does not do this. (but IE/Win and Mozilla 1.3/Win)

    Copy & paste the code below to embed this comment.
  17. It is easier to find links if they are underlined. So, what would be a good way to emphasize shortcut keys on a site that underlines links?

    Copy & paste the code below to embed this comment.
  18. This is just plain stupid. There are no accessibility tweaks one has to apply to word processing documents, e-mail, or spreadsheets. Those are documents. HTML is used to create documents.

    Why bother trying to solve something that is a problem to be solved by the rendering software? This is not our problem to solve in any way, shape, or form.

    There are menus in browsers. There are tab functions that browsers support. There are screen readers and magnifiers. There are screen readers. Enough, already!

    It is with articles such as this one that the zeal for accessibility brings out the zealots.

    Copy & paste the code below to embed this comment.
  19. Just read the article and I am going to implement this on my site.

    Have decided after reading this forum not to use (as far as possible) the following letters as they are used in the top menu of browsers (IE, Netscape, Mozilla, Opera) “F,E,V,A,T,H,G,B,W,N,M” This means that I should not disable browser defined accesskeys too much. I know there are others but at least it will not disable the main menu.

    My next problem is that my sub menus are dynamically generated from a database, so I need to work out a way to dynamically generate the accesskeys ensuring there are no duplicates on the page (I feel a headache coming on)

    Copy & paste the code below to embed this comment.
  20. ive recently been banned from google for having ‘hidden’ content. my question is this. If google bans sites that validly hide content for accessability reasons then what should i do?

    there are a number of tricks that i believe are commonly used in accessible design e.g. using a h1 tag containing a text header where the text is hidden and the h1 contains a background image resulting in text based browsers seeing a text title and gfx based browsers getting some eyecandy…

    ..i know you’re all going to say something like ‘just stick to the standards’ but im getting a little tired of the standard 2/3 column xhtml blog style sites that are poping up…

    mark

    Copy & paste the code below to embed this comment.
  21. I tried to use accesskeys in MIDAS forms:
    <label for=“MIDAS” accesskey=“f”><u>f</u>oo</label>
    <iframe id=“MIDAS” />
    But it doesn’t work! I mean the MIDAS iframe doesn’t get focus (both in Mozilla and IE)
    Does anyone know how to solve such problem?

    Copy & paste the code below to embed this comment.
  22. Mark, take a look at zeldman.com and see his links to some fantastic XHTML sites that look nothing like blogs…

    Copy & paste the code below to embed this comment.
  23. I’ve been experimenting with accessibility options on my site at http://www.pdrummond.btinternet.co.uk/
    There is an option to show/hide the access key shortcuts for the main navigation links. It works perfectly in Mozilla, but not in Internet Explorer. Safari displays the access keys, but only when the mouse rolls over. (This bug has been spotted according to David Hyatt).
    If anyone can tell me why the text size option doesn’t work I’d appreciate it.

    Copy & paste the code below to embed this comment.
  24. A lot of posts here so sorry if i have repeated that of someone else. In the Uk the Government have adopted a policy of using access keys on their pages and have given directions and instructions of which keys to use so that all Government departments stick to the same set of rules enabling a user of these sites standardization. Therefore when a user visits a Government department’s website for the first time they bring their collective experience gained from all other sites. More information on Accesskeys can be found here,
    http://www.e-envoy.gov.uk/
    Click on the site map and then follow the information for webmasters.

    Copy & paste the code below to embed this comment.
  25. Found it at last !! Took me ages to find this info, lucky i can use a mouse !
    http://www.e-envoy.gov.uk/Resources/WebHandbookIndex1Article/fs/en?CONTENT_ID=4000092&chk=XHiT3L

    Copy & paste the code below to embed this comment.
  26. In Galeon 2 (1.3, actually), with Gecko from Mozilla 1.4, access keys work: however, the application keys take priority—therefore, alt-e doesn’t work. Alt-o, does, et cetera.

    Copy & paste the code below to embed this comment.
  27. I keep my carpal tunnels comparatively happy with reduced mousing and lots of keyboard work. I love Accesskeys, even when (though) they’re flawed.

    For me on IE5.5, having to press [enter] to get to the Accesskeyed link is a feature, not a bug. I don’t want to find myself at a new page without having made the decision to go there, equivalent to the mouse-click.

    I support Gareth Plevin’s decision:

    Have decided after reading this forum not to use (as far as possible) the following letters as they are used in the top menu of browsers (IE, Netscape, Mozilla, Opera) “F,E,V,A,T,H,G,B,W,N,M” This means that I should not disable browser defined accesskeys too much. I know there are others but at least it will not disable the main menu.

    This is really important, because we keyboarders use the keyboard shortcuts to the main menu reflexively. If you make us stop and think about what “Alt-V” means, we will become slow and thus cranky. The slowness is particularly aggravating because keyboard shortcuts are faster than those damn mice you-all are using, especially when we’re touch typists.

    You “normal” guys may think Accesskeys are catering to my limitations, but (properly done) they could also be a way of speeding up your surfing, too.

    Copy & paste the code below to embed this comment.
  28. .ie_fix

    Nobody caught that yet? “_” is invalid in css. You can use hyphen “-” though.

    .ie-fix

    Copy & paste the code below to embed this comment.
  29. Whatever you do, don’t mess with my ALT+{arrow} options – I use them to go forward, backward, up and down. The last thing I need is some nimrod webmaster thinking it would be cool to put ALT+Back Arrow to take me to the homepage.

    Please don’t screw this up.

    Copy & paste the code below to embed this comment.
  30. As another keyboarder, I love access-keys too, flaws and all. Access-keys being overridden by the OS or the Browser is absolutely fine, and the way it should be. The other way round is, of course, a bad thing.

    The best accessibility should be additive, not subtractive. It doesn’t matter if the browser can’t implement a feature, so long as the feature doesn’t disable the browser. So keep those access-keys coming for a while yet.

    I would suggest that we stick to numerics. They have their disadvantages, but fewer than most alphabetics. As far as I can remember, you can’t override browser commands with numeric access-keys in any browser or screen-reader. IBM HomePage Readers may be able to put me right on this, but I’m fairly sure that is correct.

    Don’t forget to put rels in too :-)

    Copy & paste the code below to embed this comment.
  31. hey Simon, instead of underlining or bolding the accesskey queue play with the value of the letter. Or you could mess with its opacity, or hue, or …something else that isn’t so techy/clumsy as adding typographic junk. Although underlining a letter is pretty much the same typographically as underlining a link in a paragraph (ugly but it works). Pretty soon I’m going to need more buttons and meta keys on my mouse and keyboard if this trend keeps up. Looking forward to the day when all the chrome disappears and the menus appear on the rendered-web-page (out of nowhere) based on key+mouse input.

    Copy & paste the code below to embed this comment.
  32. I think the only sensible way of using access keys is to use a defined standard.

    At the moment I am in the process of pushing through a redsign of a local government web site (nothing live from the redesign, so no link :p). We have settled on the UK e-government standard for access keys. The more widespread these become, the easier it will be for users to remember which keys are available, and what those keys always link to.

    All we then need to do is to indicate that their use is available, and to provide a list for those who need to know. The UK e-gov standard defines the following access keys:

    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

    I beleive that non-standard access keys have little use as they will be different across different sites, thus adding very little to the user experience.

    Copy & paste the code below to embed this comment.
  33. Hey I keep trying to validate as AAA at BOOBY… 508 no prob, but using javascript to force IE to pretend to be compliant… that seems to me that it will cause the page to fail AAA validation… help me out here :)

    Here is what I am working on not done but in the pipe for the 10th time :)
    http://tentonweb.com/2003b/

    Jim S.

    Copy & paste the code below to embed this comment.
  34. I tried using Peter’s example but it isn’t working for me. Explorer still requires the Enter key. I know very little about DHTML behaviors…do I have to do anything not mentioned in his explanation to make it work?

    Copy & paste the code below to embed this comment.
  35. Here is the link to the post I mentioned:

    http://www.alistapart.com/stories/accesskeys/discuss/3/#ala-1996

    Copy & paste the code below to embed this comment.
  36. Someone asked about the possibility of double underlining the access-keys and thus leaving the link underlined:

    solution one – puts the doubled line over the main underline

    a { text-decoration: none; border-bottom-style: solid; border-bottom-width: 1px; padding: 1px; }
    a em { font-style: normal; font-weight: normal; text-decoration: underline; }

    solution 2 – puts the doubled line under the main underline:

    a em { font-style: normal; font-weight: normal; border-bottom-style: solid; border-bottom-width: 1px;}

    Copy & paste the code below to embed this comment.
  37. I’ve recently discovered the label tag. It allows you to connect text labels to form elements. The label also carries an accesskey attribute which focuses the control to the form element specified by the for attribute. It’s way cool in this context.

    Copy & paste the code below to embed this comment.
  38. unless there is standard like what we have in desktop application (Alt-f for file and so on), I don’t see the necessity to have it. Users who have difficulty moving the conventional mouse, they would likely to have difficulty pressing ALT and the letter. They’d be better off getting a track ball mouse. what do you think?

    Copy & paste the code below to embed this comment.
  39. hhh

    Copy & paste the code below to embed this comment.
  40. I think you have /no/ clue what you’re talking about.

    Ever used a speach input program? Depending on the quality of the program (especially one designed for the handicapped) it’s usually fairly easy to input a keycombo, without moving anything but your jaw.

    Stickykeys (which was mentioned earlier in the thread) can be used by a user who types with a mouthstick or a single finger to press the two keys as seperate motions. The mouthstick user could not /possiblly/ use a trackball, and though the user with a single working finger /might/ be able to use it it would be signifigantly more difficult than the keyboard.

    Copy & paste the code below to embed this comment.
  41. Hello all, never knew there was a forum here so I’ll copy a post I just made in another forum. :), I hope someone here can help.

    Hello all once again.
    Ok, I have been playing about with css and looking around many different sites till I found an article from ‘a list apart’: Click here to view

    So, Here is the page I want two be able to change: click here

    I have this in the Head :


    quote:
    ————————————————————————————————————————
    <LINK rel=“stylesheet” href=“green.css” type=“text/css”>
    <link rel=“alternate stylesheet” type=“text/css” href=“red.css” title=“red” />
    [removed][removed]
    ————————————————————————————————————————

    and these are the links in the page:

    quote:
    ————————————————————————————————————————
    change style to default

    change style to red
    ————————————————————————————————————————

     

    The .js files contains this:
    function setActiveStyleSheet(title) {
    var i, a, main;
    for(i=0; (a = document.getElementsByTagName(“link”)); i++) {
    if(a.getAttribute(“rel”).indexOf(“style”) != -1 && a.getAttribute(“title”)) {
    a.disabled = true;
    if(a.getAttribute(“title”) == title) a.disabled = false;
    }
    }
    }

    function getActiveStyleSheet() {
    var i, a;
    for(i=0; (a = document.getElementsByTagName(“link”)); i++) {
    if(a.getAttribute(“rel”).indexOf(“style”) != -1 && a.getAttribute(“title”) && !a.disabled) return a.getAttribute(“title”);
    }
    return null;
    }

    function getPreferredStyleSheet() {
    var i, a;
    for(i=0; (a = document.getElementsByTagName(“link”)); i++) {
    if(a.getAttribute(“rel”).indexOf(“style”) != -1
    && a.getAttribute(“rel”).indexOf(“alt”) == -1
    && a.getAttribute(“title”)
    ) return a.getAttribute(“title”);
    }
    return null;
    }

    function createCookie(name,value,days) {
    if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = “; expires=”+date.toGMTString();
    }
    else expires = “”;
    document.ignore = name+”=”value+expires”; path=/”;
    }

    function readCookie(name) {
    var nameEQ = name + “=”;
    var ca = [removed].split(’;’);
    for(var i=0;i < ca.length;i++) {
    var c = ca;
    while (c.charAt(0)==’ ‘) c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
    }
    return null;
    }

    window. {
    var cookie = readCookie(“style”);
    var title = cookie ? cookie : getPreferredStyleSheet();
    setActiveStyleSheet(title);
    } window. {
    var title = getActiveStyleSheet();
    createCookie(“style”, title, 365);
    }

    var cookie = readCookie(“style”);
    var title = cookie ? cookie : getPreferredStyleSheet();
    setActiveStyleSheet(title);

    So I have it all uploaded but when I try to change to the red theme nothing happens and when I try to open the .js file I get an error. Can someone plz help

    Once again: click here to see the page I am working on.

    Thank you

    Copy & paste the code below to embed this comment.
  42. Plz email me the answer as I cant find where my post is! :(

    Thank you

    Copy & paste the code below to embed this comment.
  43. As well as pressing and releasing Alt to activate the Windows menu bar, the following also works in both Windows 95/98/XP AND Linux/Unix (I haven’t checked Macx recently)

    Just press the F10 function key, and the file menu will be highlighted…

    And to answer somebody above, Yes, Wap/WML does support accesskeys, where they are actually much more important considering many people will be using a mobile phone!

    Anyway, I fully support the numerical scheme as suggested by the UK government. You can’t go far wrong with numbers, and I can only hope that this becomes an international standard on every site. After all, Ctrl+C is ALWAYS copy in every application, isn’t it?

    Copy & paste the code below to embed this comment.
  44. You forgot to include the AMAYA browser, which also supports accesskeys from (I think) version 5.0.

    Copy & paste the code below to embed this comment.
  45. Well done!

    Copy & paste the code below to embed this comment.
  46. Nice work, congratulations!!

    Copy & paste the code below to embed this comment.
  47. well done

    Copy & paste the code below to embed this comment.
  48. If you are on a web page with, for example, the accesskey F it usually (IE NS Moz I’ve tried- but I have no Mac) is no problem to chose whether you want the file menu: Press and RELEASE [Alt] then [F]-viola you have file menu, or the accesskey: Press and HOLD [Alt] and press [F] you get the page element connected to F. Works fine.

    There can be some problems if you have frames. Ctrl + Tab can change the focus so you get to the right frame. It can also be a way to activate the page (w its accesskeys) without having to “click” in the page.

    Having info about accesskeys in title for a link can be useful if it is a common link that the persoen may use again later. (Otherwise it is rather unnnecessary since you already have the mouse there when you see the title).

    Copy & paste the code below to embed this comment.
  49. My experience (IE NS Moz on Windows) has been that there is no big problem with browser shortcuts and acceskeys. For example if I have a page with an accesskey F going to link “Fun and Games” but I want to open the File menu. In that case I press and RELEASE [Alt] and then press [F] and get the File menu. If I want the acceskey I press and HOLD the [Alt] and press [F].

    I like the IE variant with [Enter] to confirm, which makes it possible to handle situations with a) two or more identical accesskey on a page with sevaral frames b) actually wanting to jump to a link next to one with an accesskey.

    Another problem can be choosing which frame I want to be in. Ctrl + Tab can change the focus. I believe this can also solve the problem of not reaching the accesskey before “mouse click“ing on the page, which is not very consistent with keyboard steering.

    I would like to warn against schemes that just can mark the first character. If several choices have the same first letter, it should be easy to choose another.

    Since I prefer underlined links to “hard to find” ones I was happy to find that “overline” with stylesheet gave a (rather) familar marking way that was compatible with “classic” underlined links. (Interesting that Linux Konqueror browser didn’t underline the overlined character in an underlined link, tho IE NS did both. No problem tho.)

    Copy & paste the code below to embed this comment.
  50. Why don’t people just use this type of JavaScript to make one-touch hotkeys? I am not sure if they work on all or even many browsers, but they work well in IE.

    ———————————————-

    <!—TWO STEPS TO INSTALL KEY LAUNCHER:

    1. Copy the coding into the HEAD of your HTML document
    2. Add the last code into the BODY of your HTML document—>

    <!—STEP ONE: Paste this code into the HEAD of your HTML document—>

    <HEAD>

    [removed]

    <!—This script and many more are available free online at—>
    <!—The JavaScript Source!! http://javascript.internet.com—>

    <!—Begin
    var key = new Array(); // Define key launcher pages here
    key[‘h’] = “http://javascript.internet.com/index.html”;
    key[‘f’] = “http://javascript.internet.com/feedback.html”;
    key[‘n’] = “http://javascript.internet.com/new.html”;
    key[‘s’] = “http://javascript.internet.com/toc.html”;

    function getKey(keyStroke) {
    isNetscape=(document.layers);
    // Cross-browser key capture routine couresty
    // of Randy Bennett (rbennett@thezone.net)
    eventChooser = (isNetscape) ? keyStroke.which : event.keyCode;
    which = String.fromCharCode(eventChooser).toLowerCase();
    for (var i in key) if (which == i) [removed] = key;
    }
    document.onkeypress = getKey;
    // End—>
    [removed]
    </HEAD>

    <!—STEP TWO: Copy this code into the BODY of your HTML document—>

    <BODY>

    <center>
    <table border=0><tr><td>
    This site equipped with Key Launcher!

    The following launcher keys are available:

    Press the letter ‘h’ for: Home Page
    Press the letter ‘f’ for: Feedback Page
    Press the letter ‘n’ for: What’s New Page
    Press the letter ‘s’ for: Site Contents

    </td></tr></table>
    </center>

    <center>
    <font face=“arial, helvetica” size=”-2”>Free JavaScripts provided

    by The JavaScript Source</font>
    </center>

    <!—Script Size: 1.52 KB—>


    ————————————————-

    This is puplished with a working demo at
    http://javascript.internet.com/navigation/key-launcher.html

    Copy & paste the code below to embed this comment.
  51. http://javascript.internet.com/navigation/key-launcher.html

    has a working JavaScript that allows one-key hotkeys. Look Ma, NO ALT KEY! I have modified a version of this to launch both scripts ( many based on my favorite bookmarklets such as a CSS file switcher ) an links ( such as the link to the index, help page, or NEXT page in a browsable catalog. ) IS anyone interested in such a .js file? Post here if you are. I will past my site’S URL if interest is demonstred here.

    my e-mail account is winjapan on y*hoo.com

    Copy & paste the code below to embed this comment.
  52. Does anyone use, like, or distrust the JavaScript found on
    http://javascript.internet.com/navigation/key-launcher.html
    that launches links at the touch of a single key? This does not require Alt or Control keys! With modification, I use it to launch JavaScript functions at the touch of single keys. Imagine running a bookmarklet for your user when she types a single keystroke! I have used this to toggle table grid css files on and off for debugging in the design stage of my site. I also use it for zoom and NEXT/BACK keys in an on-line catalog containing a series of pages. KNow a better script or method to do this? Let everyone know. Let me know.

    Post comments here or write to me at winjapan on my com.yahoo account. (reversed to block spam)

    Copy & paste the code below to embed this comment.
  53. dsfsd

    Copy & paste the code below to embed this comment.
  54. Access keys are only valuable if there is a standard set across applications or if the same user frequents your site/application very often and has time to learn your accesskeys. Users don’t want to think about learning how to use your site, they just want to use it, and quickly. I develop web and windows applications and the majority of my daily users stick with the mouse even when accesskeys are available. Even after training only a very small percentage start using accesskeys, and then they only use the common ones they remember. They typically don’t search out any other accesskeys to use, that takes time and energy. Unless the user has a true need, such as a disability or repetative tasks, accesskeys will rarely be used by most of your users. As a develper, you perform the same repetative tasks day after day and quickly adapt to accesskeys to speed things up. Don’t make the mistake of comparing your skills and needs of those of the average user.

    Copy & paste the code below to embed this comment.
  55. In one of the websites we built, we used the First letter approach to indicate the accesskey, just as your first suggestion. The only disadvantage you mention is that this requires you to add <em> to all your accesskeys.

    I have found another major disadvantage: some speech browsers will mispronounce the word, splitting it into two: “F” “irst”. Especially when indicating an accesskey that is not the first key, this can be very co n fusing (if you see what I mean).

    Copy & paste the code below to embed this comment.
  56. Gareth Plevin wrote you shouldn’t use “F,E,V,A,T,H,G,B,W,N,M” as accesskeys since these are used in standard browsers to access the menus. I totally agree with him on that point.

    I want to point out however, that I don’t know what language my visitor’s browser uses. I’m Dutch myself, and most people here use a Dutch operating system where the File menu is called “Bestand” with accesskey B. This means in a Dutch Internet Explorer, you get a completely different set of accesskeys to exclude.

    Since I cannot predict what language the browser of my visitor is in, I cannot predict what letters will already be in use. And that’s just the browser. Who knows what other tools or assistive technology users have installed and attached accesskeys to which will be hijacked by accesskeys defined in a page…

    Unless and until user agents will disallow overwriting of the browsers accesskeys (or make this an option), I think it’s safer to stick to numerical accesskeys…

    Copy & paste the code below to embed this comment.
  57. As mentioned earlier: why not using W3C’s HTML4-defined Link-types more often?

    Why can’t they make the function-keys available for using with accesskeys?

    Copy & paste the code below to embed this comment.
  58. it seems to me tab is a better way to go for easy link access than access keys. unless you have a ton of links. access keys are limited too right? what happens if you have more than 100 links and wish to use access keys for all?

    Copy & paste the code below to embed this comment.
  59. Good article in favor of using first letter accesskeys.

    http://www.smackthemouse.com/20021031

    Copy & paste the code below to embed this comment.
  60. On an intranet-wep-application I wrote the accesskey-feature were only added in release 2 and not surprisingly: The user-experience increased quite a lot on release 2.

    On feature I like very much is to underline the letter of the accesskey, but my application uses buttons to submit web-forms.

    Up until now I haven’t been able to figure out a way to underline one letter of the text of a button. For now I add (x) behind the text on the button.

    I still have to look in to the full CSS2-specs if it’s possible, but if someone has any suggestion, ……

    Copy & paste the code below to embed this comment.
  61. Hello, I just wanted to say you have a very informative site which really made me think, Thanks !

    Copy & paste the code below to embed this comment.
  62. DiveIntoAccessibility.org suggests using some common access keys. By standardizing on a few, it’s easier to find the rest. They suggest:
    Access Key 1 = Home page
    Access Key 2 = Skip navigation link
    Access Key 9 = Contact us form
    Access Key 0 = Accessibility statement where, among other things, you can describe the rest of the access keys.
    Another link that suggests standardizing on some common access keys: http://www.cs.tut.fi/~jkorpela/forms/accesskey.html

    Copy & paste the code below to embed this comment.
  63. This prototype usage of one-touch access keys links next and back to the present page.
    (+, -)

    For me, the developer, it can call report making scripts to list
    1. estimated download time.(q)
    2. images and alt properies.(m)
    3. all link href values. (l)

    I can also zoom the page of main gif. (i, o)

    Text is Japanese
    – look in html code for list of hotkeys in English.

    What are people’s thoughts on this?  It does not seem to interfere with Alt-F of Alt-E.  IT DOES not make any sense to use on any page with an input textbox since input becomes impossible.  THE JS file will be updated and reanemed… so do not link your site to it, folks!  If anyone would like to use the JS file, please write to me at my yahoo.com address about it.  If anyone can better the table functions, write me and we shall post or permanently host them FOR MOR DEVELOPERS TO USE!
    —Walter-

    Copy & paste the code below to embed this comment.
  64. http://www.konoe.co.jp/neji/pro1/151004_00_0.html

    Copy & paste the code below to embed this comment.
  65. This was a terrible article, but what do you expect from ALA? This is a typical Javascript job. Using CSS for behaviour is very stupid. This is going on my website on Friday.

    Copy & paste the code below to embed this comment.
  66. Take a look at jstimes.vze.com….DC slammed this crappy article.

    Copy & paste the code below to embed this comment.