Atajos de teclado en HTML

Quizás sea una cosa que no se ve mucho por las páginas web, pero que es una capacidad del lenguaje, es el poder crear atajos de teclado en HTML. Es decir, que una combinación de teclas en una página web concreta produzca un efecto que nos permita realizar una acción sobre una página.

En concreto, la idea es poder asociar el atajo de teclado a un enlace, de tal manera que cuando pulsemos el atajo de teclado se lance dicho enlace.

El atributo accesskey

Pero vamos por partes, lo primero es saber que el atributo global accesskey es aquel que nos permite indicar cuál es la tecla que actúa de atajo de teclado en la página.

Este atributo accesskey se lo podemos asignar a elementos como enlaces anchor, area, textarea, input, label,… el valor que recibe dicho atributo es el carácter de la tecla que hará de atajo de teclado.

Crear atajos de teclado

De esta forma, si se lo queremos asignar a unos enlaces mediante su elemento a, haremos lo siguiente:

<a href="[http://www.manualweb.net/html5/](http://www.manualweb.net/html5/)" accesskey="h">Manual de HTML</a>
<a href="[http://www.manualweb.net/java/](http://www.manualweb.net/java/)" accesskey="a">Manual Java</a>
<a href="[http://www.manualweb.net/mongodb/](http://www.manualweb.net/mongodb/)" accesskey="m">Manual de MongoDB</a>

Lo que hemos conseguido es que cuando pulsemos el atajo de teclado más la tecla h iremos al Manual de HTML, cuando pulsemos el atajo de teclado más la tecla a iremos al Manual Java y, finalmente, cuando pulsemos el atajo de teclado más la tecla m iremos al Manual de MongoDB.

Atajos de teclado por navegador

Hasta aquí hemos leído en varias ocasiones “atajo de teclado”, pero, ¿qué teclas hacen de atajo de teclado? Pues aquí no hay estándar y dependen de cada navegador web y de cada sistema operativo.

Así que deberás de revisar cuál es para el navegador que utilices. Aquí te dejamos una tabla de referencia para los más utilizados:

Navegador	Windows	Linux	Mac
Firefox	Alt + Shift + Tecla	Alt + Shift + Tecla	Control + Alt + Tecla
Internet Explorer	Alt + Tecla	N/A	N/A
Google Chrome	Alt + Tecla	Alt + Tecla	Control + Alt + Tecla
Safari	Alt + Tecla	N/A	Control + Alt + Tecla
Opera	Shift + Esc + Tecla	Shift + Esc + Tecla	Shift + Esc + Tecla

undefined

Prueba los atajos

De hecho, en esta propia página hemos gestionado los atajos de teclado del ejemplo y puedes probarlos ahora mismo. Si estás en un Google Chrome verás que como pulsando Alt+h o Control+Alt+h irás al Manual de HTML.

Cómo se puede comprobar, de esta forma tan sencilla podemos implementar los atajos de teclado en HTML.