Skip to main content
Acessibilidade Axe Core 4.11

Os elementos HTML com lang e xml:lang devem ter a mesma linguagem base

Sobre esta regra de acessibilidade

O atributo lang informa os navegadores e tecnologias assistivas sobre em que linguagem o conteúdo está escrito. O atributo xml:lang serve o mesmo propósito mas provém da especificação XML/XHTML. Quando ambos os atributos estão presentes no mesmo elemento—mais comummente o elemento <html>—devem concordar na linguagem base. A “linguagem base” é a subtag de linguagem primária (por exemplo, en em en-US ou fr em fr-CA). Se um atributo disser en e o outro disser fr, as tecnologias assistivas recebem informação conflituosa e não conseguem determinar de forma fiável como processar o conteúdo.

Quem é afetado

Esta questão afeta principalmente utilizadores de leitores de ecrã, incluindo pessoas cegas, surdocegas ou com deficiências cognitivas. Os leitores de ecrã mantêm bibliotecas de pronúncia separadas para cada linguagem. Quando encontram uma declaração de linguagem, mudam para a biblioteca apropriada para que as palavras sejam faladas com pronúncia e cadência corretas. Uma incompatibilidade entre lang e xml:lang pode fazer com que o leitor de ecrã selecione a biblioteca errada ou se comporte de forma imprevisível, tornando o conteúdo difícil ou impossível de compreender.

Os utilizadores que falam várias linguagens e navegam em sites em diferentes linguagens são especialmente vulneráveis, pois dependem de declarações de linguagem precisas para alternar entre contextos linguísticos.

Critérios de sucesso WCAG relacionados

Esta regra relaciona-se com o Critério de Sucesso WCAG 3.1.1: Linguagem da página (Nível A), que requer que a linguagem humana padrão de cada página web possa ser determinada programaticamente. Este critério aplica-se às WCAG 2.0, 2.1 e 2.2, bem como à EN 301 549 e RGAA. Quando lang e xml:lang entram em conflito, a linguagem determinada programaticamente torna-se ambígua, violando este requisito.

Como corrigir

  1. Verifique o elemento <html> (e quaisquer outros elementos) pela presença dos atributos lang e xml:lang.
  2. Certifique-se de que ambos os atributos usam a mesma linguagem base. Por exemplo, se lang="en", então xml:lang deve também começar com en (por exemplo, en, en-US, ou en-GB).
  3. Se não precisar de xml:lang, a correção mais simples é removê-lo inteiramente. O atributo lang sozinho é suficiente para documentos HTML5.
  4. Se estiver a servir XHTML, ambos os atributos podem ser necessários. Nesse caso, mantenha-os sincronizados.

Pode encontrar códigos de linguagem válidos na página de referência dos códigos de linguagem ISO 639. Os códigos comuns incluem en para inglês, fr para francês, es para espanhol, de para alemão e ar para árabe.

Exemplos

Incorreto: linguagens base incompatíveis

O atributo lang especifica inglês, mas xml:lang especifica francês. Isto cria um conflito que confunde as tecnologias assistivas.

<html lang="en" xml:lang="fr">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <p>Hello, world!</p>
  </body>
</html>

Correto: linguagens base correspondentes

Ambos os atributos especificam inglês. A subtag de dialeto pode diferir, mas a linguagem base (en) é a mesma.

<html lang="en-US" xml:lang="en-GB">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <p>Hello, world!</p>
  </body>
</html>

Correto: valores idênticos

A abordagem mais simples e fiável—use exatamente o mesmo valor para ambos os atributos.

<html lang="en" xml:lang="en">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <p>Hello, world!</p>
  </body>
</html>

Correto: apenas atributo lang (HTML5)

Em documentos HTML5, o atributo xml:lang não é necessário. Usar apenas lang evita qualquer possibilidade de incompatibilidade.

<html lang="en">
  <head>
    <title>My Page</title>
  </head>
  <body>
    <p>Hello, world!</p>
  </body>
</html>

Correto: especificar linguagem em elementos inline

Quando o conteúdo numa linguagem diferente aparece dentro da página, use o atributo lang no elemento apropriado. Se também usar xml:lang, certifique-se de que correspondem.

<p>Welcome to our site. <span lang="es" xml:lang="es">Bienvenidos a nuestro sitio.</span></p>

Para linguagens da direita para a esquerda, inclua também o atributo dir:

<p lang="ar" xml:lang="ar" dir="rtl">مرحبا بكم في موقعنا</p>

Ajude-nos a melhorar os nossos guias

Este guia foi útil?

Detecte problemas de acessibilidade automaticamente

O Rocket Validator examina milhares de páginas com Axe Core e o W3C Validator, encontrando problemas de acessibilidade em todo o seu site.

Pronto para validar os seus sites?
Comece o seu teste gratuito hoje.