Respuesta corta: aria-current marca el único elemento de un grupo que representa dónde está la persona, como el enlace a la página actual en un menú o en una ruta de navegación. Usa aria-current="page" para páginas, step para un proceso y true para todo lo demás. Marca un solo elemento por grupo.
Qué le dice aria-current al lector de pantalla
Los menús, las rutas de navegación y las listas de pasos suelen mostrar el elemento actual con otro estilo. MDN dice que aria-current da a quien usa tecnologías de apoyo la misma información que quien ve la pantalla recibe de ese estilo.
El atributo va en el elemento que representa el elemento actual dentro de su grupo. MDN pide marcar como actual un solo elemento de cada conjunto. Nuestra guía de navegación web explica cómo hacer los menús.
Qué valor usar
| Valor | Qué marca | Ejemplo |
|---|---|---|
| page | La página actual de un conjunto de páginas | El enlace de la ruta o del menú a esta página |
| step | El paso actual de un proceso | El paso en el que estás de una compra |
| location | La ubicación actual en un contexto | La caja resaltada de un diagrama de flujo |
| date | La fecha actual de un conjunto de fechas | El día resaltado en un calendario |
| time | La hora actual de un conjunto de horas | La hora actual en un horario |
| true | El elemento actual de un conjunto | Cualquier otro grupo |
Los valores tal como los enumera MDN, en inglés, consultado el 5 de noviembre de 2026.
False es el valor por defecto y significa que el elemento no es el actual. MDN añade que cualquier otro valor que no esté vacío cuenta como true, así que una errata también marca el elemento como actual.
En menús y rutas de navegación
El tutorial de menús del W3C pide marcar el elemento actual de un menú para que la gente se oriente. Muestra dos técnicas: cambiar el enlace por texto con una etiqueta invisible, o dejar el enlace y añadirle aria-current="page" cuando no se puede quitar.
El patrón de ruta de navegación del W3C la pone en una región de navegación con una etiqueta. El enlace a la página actual lleva aria-current="page", y si la página actual no es un enlace, el atributo es opcional. Nuestra guía de breadcrumbs explica cómo añadir una ruta.
Actual no es lo mismo que seleccionado
MDN separa las dos cosas. Actual es dónde está la persona; seleccionado es lo que eligió, como una pestaña. Las pestañas usan aria-selected para indicar qué panel se muestra.
MDN advierte de no usar aria-current en lugar de aria-selected en una celda de cuadrícula, una opción, una fila o una pestaña. Para los estados y las propiedades en general, mira nuestra guía sobre qué es ARIA.
Cómo marcar la página actual
- Busca el elemento con estilo de actual en cada menú, ruta de navegación o lista de pasos.
- Añade aria-current con el valor que corresponda: page, step, location, date o time.
- Marca un solo elemento en cada grupo.
- Mantén también el estilo, para que quien ve la pantalla lo note.
- Mueve el atributo cada vez que cambie el elemento actual.
- Usa aria-selected, no aria-current, en pestañas y opciones.
- Comprueba en el árbol de accesibilidad que lo lleva el elemento correcto.
Dónde marcan nuestras páginas la página actual
Revisamos todos los elementos con aria-current de nuestra página de SEO y de una guía, en los dos idiomas, el 5 de noviembre de 2026. Todos usan el valor page, y ningún grupo marca más de un elemento.
El selector de idioma marca el idioma activo, al que Chrome llama «ES, Español». El pie marca su enlace a la página en la que estás, «Servicios de SEO» en la página de SEO. El panel de Servicios también lo marca: Chrome oculta ese enlace con el panel cerrado y lo lee como «SEO» al abrirlo.
En una guía, el último paso de la ruta de navegación es el propio título de la página. Es texto, no un enlace, y aun así lleva aria-current="page", algo que el patrón del W3C deja como opcional.
Antes de publicar
- Cada menú y cada ruta de navegación marcan la página en la que estás.
- Cada grupo marca un elemento, nunca dos.
- El valor encaja con el elemento: page, step, location, date o time.
- El elemento actual también se ve distinto en pantalla.
- Las pestañas y las opciones usan aria-selected.
- El atributo se mueve cuando cambia el elemento actual.
Recuerdaaria-current dice en voz alta lo que el estilo muestra: estás aquí. Ponlo en un elemento por grupo y mantenlo al día con la pantalla.
Nuestro servicio de diseño web marca la página actual en la navegación que hace, como en esta web.
Respuestas rápidas sobre aria-current
¿Qué hace aria-current="page"?
Les dice a las tecnologías de apoyo que ese enlace o elemento es la página actual dentro de su grupo, como un menú o una ruta de navegación. Quien ve la pantalla lo nota por el estilo; quien usa un lector de pantalla, por el atributo.
¿La página actual de un menú tiene que seguir siendo un enlace?
Valen las dos opciones. El tutorial de menús del W3C muestra dos técnicas: cambiar el enlace por texto con una etiqueta invisible de página actual, o dejar el enlace y añadirle aria-current="page" cuando no se puede quitar.
¿En qué se diferencia aria-current de aria-selected?
Current es dónde está la persona; selected es lo que eligió. MDN dice que las pestañas usan aria-selected, y que nunca se ponga aria-current en su lugar en una celda de cuadrícula, una opción, una fila o una pestaña.
¿Puede haber más de un elemento con aria-current?
No en el mismo grupo. MDN pide marcar como actual un solo elemento de cada conjunto. Grupos distintos pueden tener el suyo, como un menú y una ruta de navegación que apuntan a la página en la que estás.
¿Qué pasa si uso un valor que no está en la lista?
Cuenta como true. MDN enumera page, step, location, date, time, true y false, y trata cualquier otro valor que no esté vacío como si fuera aria-current="true", no el false de por defecto.
Fuentes
Consultadas el 5 de noviembre de 2026. En inglés: Iniciativa de Accesibilidad Web del W3C, Breadcrumb Pattern y Menu Structure; MDN Web Docs, ARIA: aria-current attribute. Nuestro caso: nuestras propias páginas, leídas en un navegador el 5 de noviembre de 2026.