Skip to main content

Sobre esta regra de acessibilidade

Os leitores de ecrã dependem da informação do idioma para selecionar o motor de pronúncia correto para o conteúdo. Cada idioma tem a sua própria biblioteca sonora com regras de pronúncia, entoação e padrões fonéticos únicos. Quando um leitor de ecrã encontra um atributo lang com um valor válido, muda seamlessly para a biblioteca apropriada. Mas quando o valor é inválido — por exemplo, lang="egnlish" em vez de lang="en" — o leitor de ecrã não consegue identificar o idioma e reverte para o padrão, lendo o texto em língua estrangeira com pronúncia completamente errada.

Isto afeta principalmente utilizadores cegos e utilizadores surdocegos que dependem de leitores de ecrã, bem como utilizadores com deficiências cognitivas que podem depender de ferramentas de text-to-speech. Imagine ouvir texto em espanhol pronunciado com regras fonéticas do inglês — seria quase incompreensível.

Note que esta regra verifica especificamente atributos lang em elementos dentro da página (não o elemento <html> em si, que é coberto por uma regra separada). Aplica-se sempre que você usa o atributo lang para indicar que uma secção do conteúdo está num idioma diferente do resto da página.

Critérios de sucesso WCAG relacionados

Esta regra mapeia para WCAG 2.0 / 2.1 / 2.2 Critério de Sucesso 3.1.2: Language of Parts (Nível AA). Este critério requer que o idioma humano de cada passagem ou frase no conteúdo possa ser determinado programaticamente, exceto para nomes próprios, termos técnicos e palavras de idioma indeterminado. Usar um código de idioma válido é essencial para cumprir este requisito — um código inválido falha em transmitir programaticamente o idioma.

Esta regra é também referenciada pela metodologia Trusted Tester, EN 301 549, e RGAA.

Como corrigir

  1. Use códigos de idioma válidos. Os valores de idioma devem estar conformes com o padrão BCP 47. Na prática, isto significa usar códigos de duas ou três letras do IANA Language Subtag Registry. Exemplos comuns incluem en (inglês), fr (francês), es (espanhol), de (alemão), zh (chinês), ar (árabe), e ja (japonês).

  2. Verifique erros ortográficos. Valores inválidos são frequentemente causados por erros ortográficos (ex. lang="enlish") ou usar nomes completos de idiomas em vez de códigos (ex. lang="French" em vez de lang="fr").

  3. Use subtags de dialeto quando apropriado. Você pode especificar variantes regionais como en-US (inglês americano), en-GB (inglês britânico), ou fr-CA (francês canadense). Apenas a subtag primária também é válida.

  4. Defina o atributo dir para idiomas RTL. Se está a marcar conteúdo num idioma da direita para a esquerda como árabe ou hebraico, combine o atributo lang com dir="rtl" para garantir a renderização correta do texto.

Exemplos

Incorreto: código de idioma inválido

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

O valor spn não é uma subtag de idioma válida. Os leitores de ecrã não conseguem identificar isto como espanhol.

Incorreto: nome completo do idioma em vez de código

<p>Here is a quote: <q lang="Japanese">素晴らしい</q></p>

O valor Japanese não é um código de idioma BCP 47 válido.

Correto: código de idioma de duas letras válido

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

O valor es é a subtag de idioma válida para espanhol.

Correto: código de idioma válido com subtag regional

<p>The Canadian term is <span lang="fr-CA">dépanneur</span>.</p>

O valor fr-CA identifica corretamente o francês canadense.

Correto: idioma RTL com atributo de direção

<p>The Arabic word for peace is <span lang="ar" dir="rtl">سلام</span>.</p>

O valor ar é a subtag válida para árabe, e dir="rtl" garante a direcionalidade correta do texto.

Correto: múltiplas mudanças de idioma numa página

<p>
  In English we say "goodbye," in German it's
  <span lang="de">Auf Wiedersehen</span>, and in Japanese it's
  <span lang="ja">さようなら</span>.
</p>

Cada elemento inline usa um código de idioma válido, permitindo ao leitor de ecrã mudar os motores de pronúncia conforme necessário.

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.