> Manuales > Taller de HTML

Utilizando el atributo accesskey se pueden definir atajos de teclado para acceder a los enlaces directamente con la pulsación de ALT y una tecla que indiquemos en el atributo.

Las teclas rápidas son atajos de teclado para realizar diversas acciones de una manera más directa. Se implementan en todos los programas en general y sirven para mejorar la comodidad del usuario y la rapidez de uso del software, así como aumentar la accesibilidad de los programas, al no ser necesario el uso del ratón para ejecutar diversas acciones.

En una página web también podemos utilizar teclas rápidas para acceder a ciertos enlaces o campos de formulario. Existe un atributo llamado accesskey que nos sirve para indicar la tecla rápida o atajo de teclado que asociaremos al elemento.

Por ejemplo, en un enlace podemos definir una tecla rápida de esta manera:

<a href="http://www.estiloymoda.com" accesskey="e">Estiloymoda.com</a>

Como se puede ver, simplemente hemos indicado "e" como la tecla rápida para el enlace que nos llevaría a la página estiloymoda.com. Para poner en marcha una tecla rápida tenemos que combinar su pulsación con la tecla ALT (alternativa).

En la práctica la tecla rápida simplemente nos llevará el foco de la aplicación hacia el enlace, de modo que no lo ejecuta. Para que el navegador cambie la página y se mueva hacia el link deberíamos pulsar luego la tecla ENTER.

La compatibilidad con navegadores cada vez es mayor para las teclas rápidas. Ya es posible utilizarlas en todos los más habituales, como Firefox, Internet Explorer u Opera. (Está disponible a partir de Internet Explorer 4.0, con ciertas restricciones y de Netscape 6). No obstante el W3C recomienda el uso de accesskey, por lo que es normal que todos los navegadores las vayan incorporando.

Como recomendación, debemos señalar de alguna forma que existe una tecla rápida para un enlace, posiblemente poniendo en negrita en el enlace la letra que implementa la tecla rápida, o subrayándola. Este último caso (el subrayado) es en mi opinión más intuitivo, pero como los enlaces ya aparecen subrayados, deberíamos hacer algo para quitárselo a fin de que se vea el subrayado de la tecla rápida. Veamos cómo se puede hacer esto con un ejemplo:

<html>
<head>
<title>Teclas rápidas para enlaces</title>
<style type="text/css">
a {text-decoration:none}
</style>
</head>
<body>

Vamos a hacer enlaces con teclas rápidas

<br>
<a href="http://www.estiloymoda.com" accesskey="e"><u>E</u>stiloymoda.com</a>
<br>
<a href="https://desarrolloweb.com" accesskey="d"><u>D</u>esarrolloweb.com</a>
<br>
<a href="http://www.guiarte.com" accesskey="g"><u>G</u>uiarte.com</a>
</body>
</html>


Como vemos, se ha hecho uso de las hojas de estilo para quitar el subrayado de los enlaces. Luego utilizamos la etiqueta <u> para subrayar la letra que tiene la tecla rápida o atajo de teclado. No tiene ninguna complicación.

Podemos ver el ejemplo en marcha en una página aparte.

Miguel Angel Alvarez

Fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Com...

Manual