Validación HTML: Este documento parece estar escrito en X. Considera añadir "lang="y"" (o variante) a la etiqueta de apertura "html".

Acerca de este problema HTML

El atributo lang en el elemento <html> declara el idioma principal del contenido del documento. Cuando este atributo falta o está configurado incorrectamente, el validador analiza el contenido del texto e intenta detectar el idioma automáticamente. Si identifica un idioma probable, produce esta advertencia sugiriendo que añadas el valor de lang apropiado.

Esto importa por varias razones importantes:

Accesibilidad: Los lectores de pantalla dependen del atributo lang para seleccionar las reglas de pronunciación y el perfil de voz correctos. Sin él, un lector de pantalla podría intentar leer texto en español usando fonética inglesa, produciendo un habla ininteligible para el usuario.
Comportamiento del navegador: Los navegadores usan la declaración del idioma para la división silábica, el estilo de las comillas, la corrección ortográfica y la selección de fuentes. Por ejemplo, la propiedad CSS hyphens: auto depende del atributo lang para aplicar reglas de división silábica apropiadas al idioma.
Motores de búsqueda: Los motores de búsqueda usan el atributo lang como señal para entender el idioma de tu contenido, lo que ayuda a servirlo a la audiencia correcta en los resultados de búsqueda.
Herramientas de traducción: Los servicios de traducción automática usan el idioma declarado para determinar si (y desde qué idioma) ofrecer traducción.

El valor del atributo lang debe ser una etiqueta de idioma BCP 47 válida. Los ejemplos comunes incluyen en (inglés), es (español), fr (francés), de (alemán), zh (chino), ja (japonés) y ar (árabe). También puedes especificar variantes regionales como en-US, en-GB, pt-BR o es-MX.

Ejemplos

Atributo `lang` faltante

Esto desencadena la advertencia porque el validador detecta el idioma del contenido pero no encuentra declaración de lang:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Mi Sitio Web</title>
</head>
<body>
  <h1>Bienvenido a mi sitio web</h1>
  <p>Este es un párrafo en español.</p>
</body>
</html>

Corregido con el atributo `lang` correcto

Añadir lang="es" dice a los navegadores, lectores de pantalla y motores de búsqueda que este documento está en español:

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>Mi Sitio Web</title>
</head>
<body>
  <h1>Bienvenido a mi sitio web</h1>
  <p>Este es un párrafo en español.</p>
</body>
</html>

Atributo `lang` que no coincide

Esto también puede desencadenar la advertencia cuando el valor de lang no coincide con el contenido real. Aquí, el contenido está en francés pero el idioma está declarado como inglés:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Mon Site Web</title>
</head>
<body>
  <h1>Bienvenue sur mon site web</h1>
  <p>Ceci est un paragraphe en français.</p>
</body>
</html>

La solución es corregir el valor de lang para que coincida con el contenido:

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <title>Mon Site Web</title>
</head>
<body>
  <h1>Bienvenue sur mon site web</h1>
  <p>Ceci est un paragraphe en français.</p>
</body>
</html>

Usando una variante regional

Si necesitas especificar una variación regional, añade la subetiqueta de región. Por ejemplo, es-MX para español mexicano o pt-BR para portugués brasileño:

<!DOCTYPE html>
<html lang="es-MX">
<head>
  <meta charset="UTF-8">
  <title>Mi Sitio Web</title>
</head>
<body>
  <h1>Bienvenido a mi sitio web</h1>
  <p>Este es un párrafo en español de México.</p>
</body>
</html>

Secciones en un idioma diferente

Cuando tu documento está principalmente en un idioma pero contiene secciones en otro, establece el idioma principal en <html> y usa lang en elementos individuales para las excepciones:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>My Website</title>
</head>
<body>
  <h1>Welcome to my website</h1>
  <p>This site is available in multiple languages.</p>
  <blockquote lang="es">
    <p>Bienvenido a mi sitio web.</p>
  </blockquote>
</body>
</html>

Este enfoque asegura que las tecnologías de asistencia cambien las reglas de pronunciación apropiadamente cuando encuentren la sección en idioma extranjero, mientras que los navegadores y motores de búsqueda siguen entendiendo el idioma principal del documento.