Criterios de éxito de las WCAG · Level A
WCAG 3.1.1: Idioma de la página
WCAG 3.1.1 requiere que el idioma humano predeterminado de cada página web pueda determinarse mediante programación, principalmente estableciendo un atributo lang válido en el elemento HTML. Esto permite que las tecnologías de asistencia, como los lectores de pantalla, pronuncien el contenido correctamente y ayuda a las personas con discapacidades cognitivas y relacionadas con el lenguaje a comprender la página.
Qué Significa Esta Regla
WCAG 3.1.1 — Idioma de la página es un criterio de éxito de Nivel A bajo el principio de Comprensible. Exige que el idioma humano principal de cada página web se exponga de una forma que las tecnologías de apoyo puedan detectar de manera programática. En la práctica, esto casi siempre significa colocar un atributo lang válido directamente en el elemento <html> de la página.
El valor del atributo lang debe ser una etiqueta de idioma BCP 47 válida. Las etiquetas BCP 47 constan de un subtag de idioma principal (como en para inglés, tr para turco, fr para francés) y, opcionalmente, un subtag de región separado por un guion (como en-US, tr-TR o pt-BR). La etiqueta de idioma debe reflejar con precisión el idioma dominante en el que está escrito el contenido de la página. Una página escrita principalmente en turco debe declarar lang='tr' o lang='tr-TR'; una página escrita en inglés debe declarar lang='en' o una variante regional.
Una página cumple este criterio cuando el elemento <html> lleva un atributo lang cuyo valor es una etiqueta de idioma BCP 47 sintácticamente válida y no vacía que identifica correctamente el idioma principal de la página. Una página no cumple cuando el atributo lang falta por completo, cuando el valor está vacío (lang='') o cuando el valor no es una etiqueta de idioma BCP 47 reconocida (por ejemplo, lang='turkish' o lang='en_US' con un guion bajo en lugar de un guion).
Para páginas XHTML servidas con un tipo MIME XML, tanto el atributo lang como el atributo de espacio de nombres XML xml:lang deben estar presentes, y sus valores deben coincidir. Una discrepancia entre ambos — como lang='en' junto con xml:lang='tr' — constituye un incumplimiento tanto de este criterio como de la regla relacionada de axe-core html-xml-lang-mismatch.
WCAG señala explícitamente una excepción: si la página es puramente decorativa, es un CAPTCHA que intencionalmente no tiene un idioma discernible o consiste enteramente en contenido no lingüístico (como una página que es solo una imagen sin texto), puede que no tenga un idioma determinable. Sin embargo, esta excepción es limitada, y la gran mayoría de las páginas reales contienen suficiente texto como para requerir una declaración de idioma.
Por Qué Importa
Las principales personas beneficiarias de un idioma de página correctamente declarado son las personas usuarias de lectores de pantalla, la mayoría de las cuales son ciegas o tienen una discapacidad visual grave. Lectores de pantalla como NVDA, JAWS y VoiceOver utilizan el atributo lang para seleccionar la voz y el motor de síntesis de texto a voz (TTS) apropiados. Cuando una persona usuaria turca visita una página que declara correctamente lang='tr', su lector de pantalla cambia a una voz TTS en turco, aplicando la fonología, los patrones de acentuación y los signos diacríticos correctos del turco. Sin esta declaración, un lector de pantalla puede usar por defecto el idioma del sistema de la persona usuaria o un idioma completamente incorrecto, produciendo una pronunciación similar a un galimatías que hace que el contenido sea incomprensible.
Considere un escenario concreto: una ciudadana turca con discapacidad visual visita el sitio web de una institución pública para descargar un formulario gubernamental. El sitio omite el atributo lang. La instalación de NVDA de la persona usuaria utiliza por defecto un perfil TTS en inglés. Las palabras turcas se leen usando la fonología inglesa: palabras como "şehir" (ciudad) o "başvuru" (solicitud) se vuelven irreconocibles. La persona usuaria no puede completar el formulario sin ayuda de alguien vidente, lo que frustra por completo el propósito del servicio digital.
Las personas con discapacidades cognitivas y de aprendizaje también se benefician. Los navegadores utilizan el atributo lang para ofrecer sugerencias de traducción precisas; algunas personas con dislexia dependen de herramientas de traducción basadas en el navegador para convertir el contenido a un idioma que les resulte más fácil de procesar. Un atributo lang incorrecto o ausente hace que estas herramientas identifiquen mal el idioma de origen, produciendo traducciones deficientes o sin ofrecer traducción alguna.
Las personas con discapacidades motoras que dependen de software de control por voz como Dragon NaturallySpeaking necesitan que el software interprete correctamente el idioma de una página para poder hacer coincidir los comandos hablados con el texto en pantalla. Un idioma de página mal identificado rompe esta correspondencia.
Más allá de la accesibilidad, hay beneficios SEO tangibles: los motores de búsqueda utilizan el atributo lang como una de varias señales para determinar el idioma y la región objetivo de una página, mejorando la precisión de los resultados de búsqueda localizados. El etiquetado correcto del idioma también mejora la fiabilidad de las funciones de corrección ortográfica y gramatical del navegador para todas las personas usuarias, no solo para quienes utilizan tecnología de apoyo. Según la Organización Mundial de la Salud, aproximadamente 2.2 mil millones de personas en todo el mundo tienen algún tipo de discapacidad visual, una parte significativa de las cuales depende de lectores de pantalla, lo que convierte la declaración correcta del idioma en una de las mejoras de accesibilidad de mayor impacto y menor esfuerzo disponibles.
Reglas de Axe-core Relacionadas
- html-has-lang — Esta regla comprueba si el elemento
<html>tiene un atributolang. Señala cualquier página en la que el atributolangesté completamente ausente de la etiqueta raíz<html>, independientemente de si el atributo aparece en otra parte del documento. Este es uno de los hallazgos automatizados más comunes y de mayor impacto, porque la solución es añadir un único atributo. - html-lang-valid — Esta regla comprueba si el valor del atributo
langen el elemento<html>es una etiqueta de idioma BCP 47 válida. Señala valores que no son códigos de idioma reconocidos, comolang='turkish'(que utiliza el nombre completo en inglés en lugar del código ISO 639-1tr),lang='en_US'(que utiliza un guion bajo como separador en lugar de un guion) olang='xx'(un marcador de posición sin idioma asignado). Un atributolangque existe pero contiene un valor no válido es tan problemático como un atributo ausente, porque las tecnologías de apoyo no pueden actuar de forma fiable sobre él. - html-xml-lang-mismatch — Esta regla se aplica específicamente a páginas XHTML que llevan tanto un atributo
langcomo un atributoxml:langen el elemento<html>. Señala los casos en los que ambos atributos especifican códigos de idioma diferentes, por ejemplo,lang='en'yxml:lang='tr'. Cuando estos valores entran en conflicto, las tecnologías de apoyo y los procesadores XML reciben señales contradictorias y pueden comportarse de forma impredecible. Ambos valores deben especificar el mismo subtag de idioma principal.
Aunque estas tres reglas cubren los fallos programáticos más comunes, las herramientas automatizadas no pueden verificar la exactitud semántica, es decir, no pueden determinar si el idioma declarado coincide realmente con el idioma en el que está escrita la página. Una página escrita íntegramente en turco pero que declara lang='en' superará las tres reglas de axe-core, pero seguirá incumpliendo WCAG 3.1.1, porque el idioma declarado no refleja el idioma principal real de la página. Por lo tanto, siempre se requiere una revisión manual junto con el escaneo automatizado para confirmar que el idioma declarado es correcto.
Cómo Probar
- Análisis automatizado con axe DevTools o Lighthouse: Abra la página en Chrome o Firefox. Abra las DevTools (F12), vaya al panel de axe DevTools o a la pestaña Lighthouse y ejecute una auditoría completa de accesibilidad. Busque específicamente infracciones bajo las reglas
html-has-lang,html-lang-validyhtml-xml-lang-mismatch. Axe resaltará el elemento<html>y describirá el fallo específico. Lighthouse mostrará problemas similares en su categoría de Accesibilidad. Anote todas las infracciones señaladas y sus soluciones recomendadas. - Inspección manual del código fuente: Vea el código fuente de la página (Ctrl+U en la mayoría de los navegadores) y localice la etiqueta de apertura
<html>. Verifique que contenga un atributolang, que el valor del atributo sea una etiqueta BCP 47 válida (compruébelo en el Registro de Subtags de Idioma de IANA) y que refleje con precisión el idioma en el que está escrito el contenido de la página. Para páginas XHTML, verifique también que cualquier atributoxml:langtenga el mismo subtag de idioma principal quelang. - Pruebas con lector de pantalla usando NVDA y Firefox: Instale NVDA (gratuito, Windows) y abra la página en Firefox. Pulse NVDA+T para leer el título de la página y escuche la voz TTS que se está utilizando. Si la página está en turco, la voz debe ser una voz TTS en turco y las palabras turcas deben pronunciarse correctamente. Si escucha una voz en inglés o en otro idioma incorrecto sobre contenido en turco, el atributo
langfalta o es incorrecto. Repita la prueba con JAWS en Chrome y VoiceOver en Safari en macOS (Cmd+F5 para activar VoiceOver, luego navegue a la página y escuche cómo se pronuncia el texto del cuerpo). - Comprobación de detección de idioma del navegador: Abra la página en Chrome. Busque la barra de traducción integrada del navegador: Chrome ofrecerá traducir las páginas que identifique como estando en un idioma extranjero con respecto a la configuración del navegador. Si Chrome identifica incorrectamente el idioma de la página o no ofrece traducción cuando debería, esto es una señal práctica de que el atributo
langes incorrecto o falta. No es una prueba de accesibilidad definitiva, pero es un indicador secundario útil. - Comprobación de exactitud semántica (solo manual): Lea el contenido de la página y confirme que el valor declarado de
langcoincide con el idioma principal real de la página. Las herramientas automatizadas no pueden realizar esta comprobación. Preste especial atención a los sitios multilingües que sirven diferentes versiones de idioma desde distintas URL: la página de cada URL debe declarar su propio idioma correcto, y no heredar un único valor global por defecto.
Cómo Corregir
Atributo lang ausente — Incorrecto
<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<title>Başvuru Formu</title>
</head>
<body>
<h1>Hoş Geldiniz</h1>
</body>
</html>Atributo lang ausente — Correcto
<!DOCTYPE html>
<html lang='tr'>
<!-- lang='tr' indica a los lectores de pantalla que usen una voz TTS en turco -->
<head>
<meta charset='UTF-8'>
<title>Başvuru Formu</title>
</head>
<body>
<h1>Hoş Geldiniz</h1>
</body>
</html>Valor no válido del atributo lang — Incorrecto
<!DOCTYPE html>
<html lang='turkish'>
<!-- 'turkish' no es una etiqueta BCP 47 válida; axe señalará html-lang-valid -->
<head>
<title>Kurumsal Site</title>
</head>
<body>
<p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
</body>
</html>Valor no válido del atributo lang — Correcto
<!DOCTYPE html>
<html lang='tr'>
<!-- Use el código de dos letras ISO 639-1 'tr', no la palabra inglesa 'turkish' -->
<head>
<title>Kurumsal Site</title>
</head>
<body>
<p>Şirketimiz hakkında bilgi edinmek için buraya tıklayın.</p>
</body>
</html>Incongruencia xml:lang en XHTML — Incorrecto
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='en' xml:lang='tr'>
<!-- lang y xml:lang no coinciden — infracción de html-xml-lang-mismatch -->
<head><title>XHTML Sayfası</title></head>
<body><p>İçerik burada.</p></body>
</html>Incongruencia xml:lang en XHTML — Correcto
<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN'
'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' lang='tr' xml:lang='tr'>
<!-- Tanto lang como xml:lang son 'tr' — coherente y válido -->
<head><title>XHTML Sayfası</title></head>
<body><p>İçerik burada.</p></body>
</html>Idioma declarado incorrecto en un sitio multilingüe — Incorrecto
<!-- Versión en inglés del sitio, pero lang está configurado globalmente como 'tr' -->
<html lang='tr'>
<head><title>About Us</title></head>
<body>
<p>Welcome to our company. We specialize in accessible web solutions.</p>
</body>
</html>Idioma declarado incorrecto en un sitio multilingüe — Correcto
<!-- Cada versión de idioma declara su propio atributo lang correcto -->
<html lang='en'>
<!-- Esta es la página en inglés; la página en turco en /tr/ declara lang='tr' -->
<head><title>About Us</title></head>
<body>
<p>Welcome to our company. We specialize in accessible web solutions.</p>
</body>
</html>Errores Comunes
- Usar el nombre completo del idioma en inglés en lugar de su código BCP 47 — escribir
lang='turkish',lang='english'olang='arabic'en lugar de los códigos correctostr,enyar. Estos valores no son reconocidos por las tecnologías de apoyo. - Usar un guion bajo como separador de región — escribir
lang='en_US'olang='tr_TR'en lugar de las formas separadas por guionlang='en-US'ylang='tr-TR'. BCP 47 exige guiones, no guiones bajos. - Configurar el atributo lang en <body> en lugar de <html> — el atributo
langdebe estar en el elemento raíz<html>para cumplir la reglahtml-has-langde axe-core y proporcionar a las tecnologías de apoyo el contexto de idioma a nivel de página que necesitan antes de analizar cualquier contenido. - Dejar lang como una cadena vacía — configurar
lang=''se trata igual que un atributo ausente para la mayoría de las tecnologías de apoyo y será señalado porhtml-has-langporque una cadena vacía no es una etiqueta de idioma válida. - Copiar una plantilla de un proyecto en otro idioma sin actualizar el atributo lang — un problema muy común en flujos de trabajo de desarrollo en Turquía donde se reutiliza una plantilla base en inglés y el
lang='en'de la etiqueta<html>nunca se cambia alang='tr'. - Declarar el atributo lang correcto pero no actualizarlo al lanzar una nueva versión de idioma del sitio — los sitios multilingües que utilizan renderizado del lado del servidor deben asegurarse de que el atributo lang se configure dinámicamente por configuración regional, y no se codifique de forma fija con un único valor en una plantilla de diseño compartida.
- Suponer que un CMS o framework configura automáticamente el atributo lang correctamente — muchas plataformas CMS (incluidas algunas configuraciones de WordPress, Joomla y frameworks personalizados) no establecen un atributo lang válido por defecto. Las personas desarrolladoras deben verificar esto a nivel de plantilla, y no asumir que está resuelto.
- Confundir el atributo lang (para HTML) con la cabecera HTTP Content-Language — la cabecera HTTP afecta al almacenamiento en caché y a la negociación de contenido, pero no es utilizada por los lectores de pantalla. El atributo
langdentro del documento en<html>es el mecanismo correcto para cumplir WCAG 3.1.1. - Usar un subtag regional válido pero incorrecto que implica un dialecto diferente — por ejemplo, declarar
lang='zh-TW'(chino tradicional, Taiwán) en una página escrita en chino simplificado (zh-CN) puede hacer que un lector de pantalla seleccione un perfil de voz y reglas de pronunciación incorrectos. - Olvidar configurar lang en contenido de página completa inyectado dinámicamente en aplicaciones de una sola página (SPA) — si una SPA carga contenido en varios idiomas dentro de la misma carcasa de documento sin actualizar el atributo
lang, las personas usuarias que navegan entre secciones de idioma no recibirán una pronunciación TTS correcta para las nuevas secciones de contenido.
Relación con la Normativa de Accesibilidad de Turquía
WCAG 3.1.1 Idioma de la página tiene peso legal directo en Turquía bajo la Circular Presidencial 2025/10, publicada en el Boletín Oficial nº 32933 el 21 de junio de 2025. Esta circular establece requisitos obligatorios de accesibilidad web alineados con WCAG 2.2 y designa la conformidad de Nivel A como el estándar mínimo obligatorio para todas las entidades cubiertas.
La circular abarca una amplia gama de organizaciones tanto del sector público como privado. Las instituciones públicas, incluidas los ministerios, los municipios, las universidades estatales, los hospitales públicos y todos los organismos de gobierno centrales y locales, deben lograr la conformidad completa de Nivel A en el plazo de un año desde la publicación de la circular. Las entidades del sector privado cubiertas por la normativa tienen un plazo de dos años para cumplirla e incluyen plataformas de comercio electrónico, bancos e instituciones financieras, hospitales privados y proveedores de atención sanitaria, operadores de telecomunicaciones con 200,000 o más abonados, agencias de viajes, empresas de transporte privado y escuelas privadas que operan bajo autorización del Ministerio de Educación Nacional (MoNE).
Dado que WCAG 3.1.1 es un criterio de Nivel A, forma parte de la base obligatoria para todas las entidades cubiertas por la circular. El sitio web de una institución pública turca que omite lang='tr' en su elemento <html>, o que declara una etiqueta de idioma incorrecta o no válida, está en incumplimiento directo de un estándar legalmente obligatorio. Para organizaciones del sector privado como bancos y plataformas de comercio electrónico, el mismo fallo dentro de su plazo de cumplimiento constituye una infracción normativa.
La implicación práctica para los equipos web turcos es significativa: cada plantilla de página, cada diseño de CMS, cada carcasa de SPA y cada página generada dinámicamente debe auditarse para confirmar la presencia de un lang='tr' válido (o variante apropiada) en el elemento HTML raíz. Esto no es simplemente una recomendación de buenas prácticas: bajo la Circular 2025/10, es una obligación legal. Dado que las reglas de axe-core html-has-lang y html-lang-valid pueden detectar la mayoría de estos fallos automáticamente, no existe ninguna barrera técnica para identificar y remediar este problema antes de que lleguen los plazos de cumplimiento.
Las organizaciones sujetas a la circular deben tratar el cumplimiento de WCAG 3.1.1 como un elemento de remediación de primera prioridad: es uno de los criterios más fáciles de corregir (un solo atributo en un solo elemento), pero tiene un impacto desproporcionado en la accesibilidad de cada página para las personas usuarias de lectores de pantalla, el grupo cuyos derechos la normativa está diseñada más directamente para proteger.