Skip to main content
Validação HTML

Considere adicionar um atributo “lang” à etiqueta de início “html” para declarar o idioma deste documento.

Sobre este problema HTML

O atributo lang no elemento <html> define o idioma padrão para todo o conteúdo de texto dentro da página. Sem ele, as tecnologias assistivas como os leitores de ecrã têm de adivinhar em que idioma o conteúdo está, o que pode levar a texto distorcido ou pronunciado incorretamente. Por exemplo, um leitor de ecrã francês a tentar ler texto em inglês — ou vice-versa — produz uma experiência pobre para utilizadores que dependem dessas ferramentas.

Além da acessibilidade, o atributo lang é importante por várias outras razões:

  • Motores de busca usam-no para servir a versão do idioma correto da sua página nos resultados de pesquisa.
  • Navegadores dependem dele para escolher fontes apropriadas, regras de hifenização e estilos de aspas.
  • Ferramentas de tradução usam-no para detetar o idioma fonte da página.
  • Seletores CSS como :lang() dependem dele para aplicar estilização específica do idioma.

O valor do atributo lang deve ser uma etiqueta de idioma BCP 47 válida. Exemplos comuns incluem en (inglês), fr (francês), es (espanhol), de (alemão), zh (chinês), ja (japonês), e ar (árabe). Também pode ser mais específico com sub-etiquetas de região, como en-US para inglês americano ou pt-BR para português brasileiro.

Se a sua página contém secções num idioma diferente do principal, pode usar o atributo lang em elementos individuais para substituir o idioma ao nível do documento para essa secção.

Exemplos

Atributo lang em falta (desencadeia o aviso)

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>My Page</title>
  </head>
  <body>
    <p>Hello, world!</p>
  </body>
</html>

Corrigido com atributo lang

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>My Page</title>
  </head>
  <body>
    <p>Hello, world!</p>
  </body>
</html>

Usando uma sub-etiqueta de região para especificidade

<!DOCTYPE html>
<html lang="en-GB">
  <head>
    <meta charset="utf-8">
    <title>My Page</title>
  </head>
  <body>
    <p>Colour is spelt differently here.</p>
  </body>
</html>

Substituindo o idioma para uma secção específica

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Multilingual Page</title>
  </head>
  <body>
    <p>This paragraph is in English.</p>
    <p lang="fr">Ce paragraphe est en français.</p>
  </body>
</html>

Neste último exemplo, o idioma do documento é inglês, mas o segundo parágrafo está marcado como francês. Um leitor de ecrã mudará para as regras de pronúncia francesa para esse parágrafo, depois voltará ao inglês para o resto da página.

Encontre problemas como este automaticamente

O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.

Ajude-nos a melhorar os nossos guias

Este guia foi útil?

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