Sobre esta regra de acessibilidade
Os leitores de ecrã dependem de bibliotecas de som distintas para cada idioma, com regras de pronúncia, padrões de entoação e fonética adaptados a esse idioma específico. Quando um utilizador navega para uma página, o leitor de ecrã verifica o atributo lang no elemento <html> para determinar qual biblioteca de som carregar. Se não estiver presente nenhum atributo lang, o leitor de ecrã recorre ao idioma padrão que o utilizador configurou durante a instalação. Para alguém que fala vários idiomas e navega em sites web em diferentes idiomas, isto cria um problema sério — o leitor de ecrã tentará ler conteúdo em idioma estrangeiro usando as regras de pronúncia erradas, produzindo fala distorcida ou incompreensível.
Este problema afeta principalmente utilizadores cegos e surdocegos que dependem de leitores de ecrã, mas também impacta utilizadores com deficiências cognitivas que podem usar ferramentas de texto para fala. Quando o texto é lido em voz alta com as regras de idioma erradas, mesmo palavras simples tornam-se irreconhecíveis, tornando efetivamente o conteúdo inacessível.
Critérios de Sucesso WCAG Relacionados
Esta regra mapeia para o Critério de Sucesso 3.1.1 das WCAG 2.0, 2.1 e 2.2: Idioma da Página no Nível A — o nível mais fundamental de conformidade. Este critério exige que o idioma humano padrão de cada página web possa ser determinado programaticamente. É também referenciado pelas diretrizes Trusted Tester (11.A), EN 301 549 e RGAA.
Como Corrigir
Adicione um atributo lang com um código de idioma válido ao elemento <html> de abertura. O valor deve representar o idioma principal do conteúdo da página.
Pode usar um código de idioma simples de duas letras (como en para inglês, fr para francês, ou de para alemão), ou pode ser mais específico com um código de dialeto regional como en-US para inglês americano ou fr-CA para francês canadiano. Uma lista completa de subtags de idioma válidas está disponível no IANA Language Subtag Registry.
Se secções da sua página contêm conteúdo num idioma diferente do principal, use o atributo lang nesses elementos específicos para que os leitores de ecrã possam trocar de biblioteca de som a meio da página.
Para idiomas escritos da direita para a esquerda (como árabe ou hebraico), inclua também o atributo dir com um valor de rtl para indicar a direção do texto.
Exemplos
Incorreto: Atributo lang em falta
Isto irá despoletar a regra porque o elemento <html> não tem atributo lang:
<html>
<head>
<title>My Website</title>
</head>
<body>
<h1>Welcome</h1>
</body>
</html>
Correto: Atributo lang com um código de idioma válido
<html lang="en">
<head>
<title>My Website</title>
</head>
<body>
<h1>Welcome</h1>
</body>
</html>Correto: Usar um código de dialeto regional
<html lang="en-US">
<head>
<title>My Website</title>
</head>
<body>
<h1>Welcome</h1>
</body>
</html>Correto: Lidar com mudanças de idioma inline
Quando uma parte da página está num idioma diferente, use o atributo lang no elemento contentor:
<html lang="en">
<head>
<title>My Website</title>
</head>
<body>
<p>The French word for hello is <span lang="fr">bonjour</span>.</p>
</body>
</html>
Correto: Idioma da direita para a esquerda com atributo dir
<html lang="ar" dir="rtl">
<head>
<title>موقعي</title>
</head>
<body>
<h1>مرحبا</h1>
</body>
</html>Ajude-nos a melhorar os nossos guias
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.