Página titulada
Toda página debe tener un elemento `<title>` que describa su tema o propósito. El título es lo que los lectores de pantalla anuncian al cargar la página y lo que los usuarios ven en las pestañas, los marcadores, el historial y los resultados de búsqueda.
Qué exige este criterio
El elemento <title> del encabezado del documento debe describir de qué trata la página. Los usuarios de lectores de pantalla lo escuchan en el momento en que carga la página — es la primera pista de orientación que reciben. Los usuarios sin discapacidad visual lo ven en la pestaña del navegador, en su historial, al añadir un marcador y en los resultados de búsqueda (SERP). Un título que no cumple este criterio deja a todos estos usuarios sin saber en qué página han aterrizado.
El título no tiene que ser original. Tiene que ser específico. «Home» no cumple. «Precios — Acme CRM» sí cumple.
Cómo cumplirlo
- Redactar un título que nombre primero la página y después el sitio:
"Hoteles accesibles para sillas de ruedas en Berlín — Disability World". - Actualizar el título en el cliente al cambiar de ruta en una SPA. Next.js, React Router y Vue Router requieren actualizaciones explícitas de
document.titleo asistentes específicos del framework. - Reflejar los errores de formulario y los resultados de búsqueda en el título:
"3 errores — Configuración de la cuenta"o"Búsqueda: fatiga crónica — 47 resultados". - Situar la información más distintiva al principio. En una barra de pestañas de 30 caracteres, «Disability World — Cómo solicitar la prestación SSDI» oculta el tema.
- En formularios de varios pasos, incluir el paso:
"Paso 2 de 4: Dirección — Solicitud de prestaciones".
Fallos habituales
- Títulos genéricos para todo el sitio: todas las páginas muestran
"Acme Inc."porque la plantilla nunca sobreescribe el valor predeterminado. <title></title>vacío — sorprendentemente frecuente cuando las plantillas de CMS asumen que el editor siempre lo completa.- Rutas de SPA sin título: el HTML inicial tiene un título genérico y el enrutador nunca lo actualiza durante la navegación.
- El título es únicamente el nombre de la marca sin indicar el tema de la página (
"Acme"en las páginas de contacto, precios y producto por igual). - «Untitled Document» procedente de una exportación de un editor WYSIWYG.
Por qué es importante
Para un usuario de lector de pantalla, el título de la página equivale a mirar la parte superior de la ventana del navegador — le indica si ha llegado a donde quería. Sin él, todas las páginas suenan igual al cargar. También resulta fundamental para el SEO y las vistas previas de enlaces, por lo que la corrección de este criterio de conformidad suele ser fácil de justificar ante los equipos de producto, marketing y contenidos.