1. Home
  2. Computing & Technology
  3. Web Design / HTML

How do I set up an access key on my links and form fields?

By , About.com Guide

Question Mark Key

Question Mark Key

Image courtesy hdoddema from StockXchng #619007.
Question: How do I set up an access key on my links and form fields?

I got the following question from MissPete:

I have been noticing in the HTML the use of access keys, I was wondering if you could explain to me how and why they work, and are used.
Answer:

What you're looking for is not specifically CSS, but rather an HTML attribute - accesskey.

You can use the accesskey attribute on the a, area, button, input, label, legend, and textarea tags.

To use an accesskey, you place the attribute inside any of those elements on your page. Then when your customers hit the Alt or Cmd key in conjunction with the letter you've defined, that link is activated or if it's a form field, that form field gets the focus.

For example, you might have a link to your home page that you want accessed through Alt-h (or Cmd-h on a Mac). You would write:

<a href="/" accesskey="h">Home</a>

Or if you wanted to create a first name field on your form and have it be accessed with the Alt-f (Cmd-f) key, you would write:

First Name: <input type="text" id="firstname" name="firstname" accesskey="f" />
Explore Web Design / HTML
About.com Special Features

Holiday Central

What to eat, where to go, fun things to do and how to save money on the perfect gifts. More >

Family Tech Center

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

  1. Home
  2. Computing & Technology
  3. Web Design / HTML
  4. Web Design
  5. Accessibility
  6. How do I set up an access key on my links and form fields?>

©2009 About.com, a part of The New York Times Company.

All rights reserved.