Why is this an issue?

This rule raises an issue when:

The lang attribute is used by assistive technologies, translation tools, and search engines to correctly interpret and process text content. A document with no page-level language cannot be spoken correctly by screen readers, and an invalid language code may cause text to be mispronounced, translated incorrectly, or misclassified.

Noncompliant code examples

<html> <!-- Noncompliant: no lang on <html> and none on <body> either -->
  <head>
    <title>Example</title>
  </head>
  <body>
    <p>Welcome to our website</p>
  </body>
</html>

<html lang="engl">
  <head>
    <title>Example</title>
    <meta charset="utf-8" />
  </head>
  <body>
    <p>Welcome to our website</p> <!-- Noncompliant: "engl" does not start with a valid 2-letter code -->
  </body>
</html>

<html lang="en">
  <div lang="xx">
    Bienvenido a nuestro sitio web <!-- Noncompliant: "xx" is not a valid ISO 639-1 code -->
  </div>
</html>

Compliant solutions

<html lang="en">
  <head>
    <title>Example</title>
    <meta charset="utf-8" />
  </head>
  <body>
    <p>Welcome to our website</p> <!-- Valid: "en" is a valid ISO 639-1 code -->
  </body>
</html>

<html>
  <head>
    <title>Example</title>
  </head>
  <body lang="en"> <!-- Valid: page language declared on <body> -->
    <p>Welcome to our website</p>
  </body>
</html>

<html lang="en">
  <div lang="es">
    Bienvenido a nuestro sitio web <!-- Valid: "es" is a valid ISO 639-1 code -->
  </div>
</html>

Resources