WCAG 3.1.2: Idioma das Partes

O Que Esta Regra Significa

WCAG 3.1.2 — Language of Parts é um critério de Nível AA sob o princípio de Compreensível. Ele se baseia diretamente em 3.1.1 (Language of Page), que exige que o idioma principal de uma página inteira seja declarado. O critério 3.1.2 vai além: sempre que um trecho, frase ou seção de conteúdo estiver escrito em um idioma diferente do idioma padrão da página, essa parte deve ter um atributo lang identificando seu idioma específico.

Em termos práticos de HTML, isso significa aplicar o atributo lang a qualquer elemento que envolva uma mudança de idioma. O valor do atributo deve ser uma tag de idioma BCP 47 válida — por exemplo, lang='en' para inglês, lang='fr' para francês, lang='de' para alemão ou lang='tr' para turco. Subtags de região (como lang='en-US' ou lang='tr-TR') são permitidas e recomendadas quando a pronúncia específica de um dialeto é importante.

Um pass ocorre quando todo segmento de idioma distinto que uma pessoa leitora perceberia como pertencente a um idioma diferente está envolvido em um elemento com o atributo lang correto. Um fail ocorre quando um trecho em outro idioma está presente, mas não possui atributo lang, ou possui um atributo incorreto — por exemplo, rotular uma frase em francês como lang='de'.

As WCAG reconhecem três exceções explícitas a este critério. Primeiro, nomes próprios — nomes de pessoas, marcas, nomes geográficos — não precisam de marcação de idioma mesmo quando se originam de outro idioma. Segundo, termos técnicos que são reconhecidos como itens de vocabulário dentro do idioma principal (como a expressão em latim in vitro usada em uma página médica em inglês) são isentos. Terceiro, palavras de idioma indeterminado — palavras que foram absorvidas de forma tão completa pelo idioma principal que sua origem é ambígua — também são isentas. Essas exceções refletem a realidade prática de que muitos empréstimos linguísticos não exigem uma mudança de pronúncia para serem compreendidos corretamente.

O atributo lang pode ser colocado em qualquer elemento HTML, incluindo <span>, <p>, <div>, <blockquote>, <section> ou mesmo <td> em uma célula de tabela. O atributo é herdado por todos os elementos descendentes, portanto marcar um contêiner de alto nível é suficiente se todo um bloco estiver no idioma de destino. Você só precisa marcar elementos inline individuais quando pequenas frases estiverem intercaladas em parágrafos que, de outra forma, são monolíngues.

Por Que Isso Importa

Os principais beneficiários deste critério são usuários de leitores de tela, especialmente pessoas cegas ou com baixa visão. Leitores de tela dependem de mecanismos de conversão de texto em fala (TTS) que são específicos de cada idioma. Quando um leitor de tela em turco encontra uma frase em francês sem um atributo lang='fr', ele tenta pronunciar as palavras em francês usando regras fonéticas do turco, produzindo uma saída amplamente ininteligível. A pessoa que ouve pode nem perceber que ocorreu uma mudança de idioma — ela simplesmente ouve um áudio distorcido e perde completamente a compreensão do conteúdo.

Considere um cenário real comum em sites turcos de e-commerce e turismo: uma página de produto escrita em turco que inclui o nome da marca e um breve slogan de marketing em inglês, seguido de um aviso legal em francês para clientes europeus. Sem marcação de idioma nos segmentos em inglês e francês, uma pessoa cega que depende de uma voz TTS em turco ouvirá três segmentos todos pronunciados como se fossem turcos. O slogan em inglês pode ser deduzido por similaridade fonética, mas o texto legal em francês se torna totalmente incompreensível — potencialmente fazendo com que a pessoa perca informações contratuais ou de segurança críticas.

Pessoas com deficiências cognitivas que dependem de ferramentas de leitura em voz alta (não apenas leitores de tela dedicados) também são afetadas. Muitas extensões de navegador de assistência à leitura amplamente utilizadas usam o atributo lang para selecionar a voz correta. Sem ele, a ferramenta ignora a mudança de idioma ou padroniza uma única voz para toda a página, prejudicando a compreensão.

Além da acessibilidade, a marcação correta de idioma oferece benefícios de SEO mensuráveis. Mecanismos de busca usam atributos lang para indexar corretamente conteúdo multilíngue, aumentando a probabilidade de que páginas específicas de um idioma apareçam em resultados de busca segmentados geográfica e linguisticamente. Navegadores também usam o atributo para oferecer sugestões de tradução precisas, e ferramentas de correção ortográfica o utilizam para aplicar o dicionário correto. Em resumo, a marcação adequada de idioma beneficia todas as pessoas usuárias — não apenas aquelas com deficiência.

Estima-se que mais de 2,2 bilhões de pessoas no mundo tenham algum tipo de deficiência visual, e dezenas de milhões dependem de leitores de tela diariamente. Conteúdo web multilíngue é cada vez mais a norma em mercados internacionais, tornando a conformidade com Language of Parts crítica para qualquer site que atenda a um público global ou multilíngue.

Regras Relacionadas do Axe-core

WCAG 3.1.2 exige testes manuais porque ferramentas automatizadas não conseguem identificar de forma confiável quais partes do texto de uma página estão escritas em um idioma diferente do padrão da página sem aplicar algoritmos de detecção de linguagem natural (NLP) — e mesmo esses podem ser incertos com frases curtas, nomes próprios e terminologia técnica.

• Inspeção manual — detecção de idioma: Varredores automatizados como axe-core podem verificar se o atributo lang no elemento <html> está presente e válido (coberto pelas regras html-has-lang e html-lang-valid), mas não conseguem ler todo o corpo de texto e determinar se um determinado trecho é linguisticamente francês, alemão ou japonês. Uma ferramenta não tem entendimento semântico de se a string "Bonjour tout le monde" é francês ou uma frase inventada, portanto não pode sinalizar a ausência de lang='fr' no elemento que a envolve.
• Inspeção manual — valores lang incorretos: Se uma pessoa desenvolvedora colocou um atributo lang em um elemento, mas atribuiu o código de idioma errado (por exemplo, marcando texto em espanhol como lang='pt'), ferramentas automatizadas verão uma tag BCP 47 válida e não relatarão erro. Apenas uma pessoa revisora que leia ambos os idiomas pode identificar a incompatibilidade.
• Inspeção manual — escopo das mudanças de idioma: Mesmo quando atributos lang existem, uma pessoa precisa confirmar se o atributo cobre toda a extensão do trecho em idioma estrangeiro — não apenas a primeira frase, e sem se estender para conteúdo adjacente que pertence ao idioma principal. Ferramentas automatizadas não têm compreensão de leitura para fazer esse julgamento.

Como Testar

1. Varredura automatizada básica: Execute axe DevTools (extensão de navegador ou integração em CI) ou Google Lighthouse na página. Procure quaisquer violações de html-has-lang ou html-lang-valid — isso indica que até mesmo a declaração de idioma em nível de página está ausente ou incorreta, o que é um problema pré-requisito a ser corrigido antes de tratar do 3.1.2. Observe que nenhuma das ferramentas sinalizará atributos lang inline ausentes, portanto esta etapa apenas estabelece uma linha de base.
2. Auditoria visual de conteúdo: Leia todo o conteúdo da página e identifique cada trecho, frase ou bloco que esteja visivelmente escrito em um idioma diferente do idioma declarado da página. Mantenha uma lista desses elementos, anotando sua localização no DOM. Verifique cada elemento (ou seu ancestral mais próximo) em busca de um atributo lang no inspetor de DOM do navegador (DevTools do navegador → painel Elements). Verifique se o valor é uma tag BCP 47 válida que corresponda ao idioma real do conteúdo.
3. Teste com leitor de tela — NVDA + Firefox (Windows): Abra a página com o NVDA ativo usando o Firefox. Navegue pelo conteúdo com as teclas de seta, focando nos trechos em idioma estrangeiro que você identificou. Ouça com atenção: o NVDA deve mudar a pronúncia automaticamente quando encontrar um atributo lang corretamente marcado. Se o texto em idioma estrangeiro for lido com as regras de pronúncia do idioma padrão sem qualquer mudança perceptível de voz, o atributo lang provavelmente está ausente ou incorreto.
4. Teste com leitor de tela — JAWS + Chrome (Windows): Com o JAWS em execução no Chrome, use o cursor virtual para ler a página. O comportamento do JAWS espelha o do NVDA — ele alternará mecanismos TTS com base nos valores de lang. Ative o modo de fala detalhada para ouvir os anúncios de idioma. Observe quaisquer trechos em que a pronúncia pareça incorreta para o idioma visível.
5. Teste com leitor de tela — VoiceOver + Safari (macOS/iOS): Ative o VoiceOver e navegue pela página com VO+seta para a direita. Para testes em dispositivos móveis no iOS, deslize pelo conteúdo. O VoiceOver no Safari também respeita atributos lang e alterna as vozes de acordo. Se o seu dispositivo tiver pacotes de voz instalados para os idiomas estrangeiros esperados, você ouvirá uma mudança de voz distinta em elementos corretamente marcados.
6. Validação de tags BCP 47: Para quaisquer valores de lang que você encontrar, valide-os no IANA Language Subtag Registry ou use um validador BCP 47 online. Erros comuns incluem usar lang='en-us' (código de região em minúsculas é tecnicamente válido, mas pouco convencional) ou códigos inválidos como lang='english'.

Como Corrigir

Expressão estrangeira inline em um parágrafo em turco — Incorreto

<p>
  Bu ürün uluslararası standartlara uygundur ve
  <em>state of the art</em> teknoloji kullanmaktadır.
</p>

Expressão estrangeira inline em um parágrafo em turco — Correto

<p>
  Bu ürün uluslararası standartlara uygundur ve
  <!-- lang='en' tells screen readers to switch to an English TTS engine -->
  <em lang='en'>state of the art</em> teknoloji kullanmaktadır.
</p>

Bloco de citação com várias frases em idioma estrangeiro — Incorreto

<blockquote>
  <p>La liberté commence où l'ignorance finit.</p>
  <p>— Victor Hugo</p>
</blockquote>

Bloco de citação com várias frases em idioma estrangeiro — Correto

<!-- lang='fr' applied to the blockquote covers all descendant content -->
<blockquote lang='fr'>
  <p>La liberté commence où l'ignorance finit.</p>
  <p>— Victor Hugo</p>
</blockquote>

Menu de navegação bilíngue — Incorreto

<nav>
  <ul>
    <li><a href='/tr/anasayfa'>Anasayfa</a></li>
    <li><a href='/en/home'>Home</a></li>
    <li><a href='/de/startseite'>Startseite</a></li>
  </ul>
</nav>

Menu de navegação bilíngue — Correto

<nav>
  <ul>
    <!-- Primary language (Turkish) needs no extra attribute if html lang='tr' -->
    <li><a href='/tr/anasayfa'>Anasayfa</a></li>
    <!-- English and German links receive their own lang attributes -->
    <li><a href='/en/home' lang='en'>Home</a></li>
    <li><a href='/de/startseite' lang='de'>Startseite</a></li>
  </ul>
</nav>

Tabela com células de dados multilíngues — Incorreto

<table>
  <tr>
    <th>Ülke</th>
    <th>Slogan</th>
  </tr>
  <tr>
    <td>Fransa</td>
    <td>Liberté, Égalité, Fraternité</td>
  </tr>
  <tr>
    <td>Almanya</td>
    <td>Einigkeit und Recht und Freiheit</td>
  </tr>
</table>

Tabela com células de dados multilíngues — Correto

<table>
  <tr>
    <th>Ülke</th>
    <th>Slogan</th>
  </tr>
  <!-- lang applied to individual td elements containing foreign text -->
  <tr>
    <td>Fransa</td>
    <td lang='fr'>Liberté, Égalité, Fraternité</td>
  </tr>
  <tr>
    <td>Almanya</td>
    <td lang='de'>Einigkeit und Recht und Freiheit</td>
  </tr>
</table>

Erros Comuns

• Omitir atributos lang em pequenas expressões inline: Pessoas desenvolvedoras frequentemente marcam grandes seções em idioma estrangeiro, mas deixam passar pequenas expressões, como um slogan de marketing em inglês de duas palavras embutido em uma frase em turco. Mesmo termos estrangeiros de uma única palavra que não sejam nomes próprios isentos ou vocabulário técnico exigem marcação.
• Usar uma tag BCP 47 incorreta: Escrever lang='english', lang='turkish' ou lang='français' em vez dos códigos ISO corretos (lang='en', lang='tr', lang='fr') torna o atributo inválido e leitores de tela podem ignorá-lo completamente.
• Confiar em CSS ou estilo visual para sugerir uma mudança de idioma: Alterar fonte, cor ou colocar o texto estrangeiro em itálico sinaliza a diferença de idioma para pessoas que enxergam, mas não fornece nenhuma informação programática para tecnologias assistivas. O atributo lang é o único mecanismo que funciona para leitores de tela.
• Presumir que usuários de leitores de tela vão “perceber” pelo contexto: Esperar que uma pessoa cega deduza que um trecho com som distorcido é na verdade francês porque o texto em turco ao redor mencionou a França é uma expectativa irreal que transfere o ônus da compreensão para a pessoa usuária.
• Marcar apenas o primeiro elemento de um bloco em idioma estrangeiro com vários elementos: Se três elementos <p> consecutivos contêm um trecho em francês, colocar lang='fr' apenas no primeiro parágrafo deixa os dois parágrafos restantes sem marcação. A abordagem correta é envolver todos os três em um elemento pai com lang='fr' ou adicionar o atributo a cada parágrafo individualmente.
• Confundir nomes próprios com frases completas em idioma estrangeiro: A exceção das WCAG para nomes próprios cobre nomes como “Paris” ou “Volkswagen” — não frases inteiras ou textos de marketing escritos em francês ou alemão. Pessoas desenvolvedoras às vezes aplicam essa exceção de forma equivocada para justificar a omissão da marcação lang em conteúdo substancial em idioma estrangeiro.
• Conteúdo injetado dinamicamente sem atributos de idioma: Quando conteúdo em idioma estrangeiro é carregado via JavaScript (por exemplo, um bloco de FAQ gerenciado por CMS ou uma descrição de produto traduzida obtida de uma API), pessoas desenvolvedoras frequentemente se esquecem de incluir o atributo lang no markup injetado. Pipelines de renderização no servidor ou no cliente devem repassar metadados de idioma junto com o conteúdo de texto.
• Usar xml:lang em documentos HTML5 sem lang: Em contextos XHTML, xml:lang era o atributo apropriado. Em HTML5, lang é o atributo correto. Usar apenas xml:lang em um documento HTML5 pode funcionar em alguns navegadores, mas não é universalmente suportado por todas as tecnologias assistivas.
• Colocar lang em um contêiner amplo demais que também inclui conteúdo no idioma principal: Envolver uma seção que contém texto em turco e francês inteiramente em lang='fr' fará com que as partes em turco sejam pronunciadas de forma incorreta. O escopo do atributo deve corresponder com precisão ao limite de idioma.
• Não testar com leitores de tela reais após aplicar correções: Pessoas desenvolvedoras frequentemente adicionam atributos lang e consideram a correção concluída sem verificar a saída real de TTS. Testar com NVDA, JAWS ou VoiceOver é a única maneira de confirmar que a melhoria na pronúncia é perceptível para as pessoas usuárias finais.

Relação com os Regulamentos de Acessibilidade da Turquia

O Circular Presidencial 2025/10 da Turquia, publicado no Diário Oficial nº 32933 em 21 de junho de 2025, estabelece um marco vinculativo para acessibilidade digital em uma ampla gama de entidades dos setores público e privado. O circular incorpora formalmente as WCAG 2.2 como padrão técnico, com a conformidade de Nível AA servindo como requisito básico para conformidade legal.

WCAG 3.1.2 — Language of Parts é um critério de Nível AA, situando-o diretamente dentro da meta de conformidade obrigatória definida pelo circular. Entidades que operam sites multilíngues — algo comum na Turquia, dado o papel do país como encruzilhada do comércio europeu, do Oriente Médio e da Ásia Central — têm uma obrigação reforçada de implementar corretamente este critério. Um banco turco que publica termos de moeda estrangeira em inglês, uma operadora de telecomunicações que inclui cláusulas de acordos de roaming em alemão ou o site de um hospital que reproduz formulários de consentimento de pacientes em árabe devem todos garantir que cada trecho em idioma estrangeiro esteja programaticamente marcado.

Os tipos de entidades cobertos pelo circular incluem instituições e agências públicas, plataformas de e-commerce, bancos e instituições financeiras, hospitais e prestadores de serviços de saúde, empresas de telecomunicações com 200,000 ou mais assinantes, agências de viagens, empresas privadas de transporte e escolas privadas autorizadas pelo Ministério da Educação Nacional (MoNE). Para todas essas entidades, deixar de atender à conformidade de Nível AA — incluindo 3.1.2 — pode resultar em sanções administrativas e inelegibilidade para o Accessibility Logo (Erişilebilirlik Logosu) emitido pelo Ministério da Família e Serviços Sociais.

O Erişilebilirlik Logosu é cada vez mais reconhecido como um sinal de confiança no mercado turco, especialmente em e-commerce e serviços financeiros. Alcançar e manter o logo exige conformidade comprovada com todos os critérios de Nível AA, e Language of Parts é particularmente relevante para entidades turcas que atendem clientes internacionais ou publicam documentos juridicamente vinculativos em vários idiomas. Dado que a legislação turca exige que certas divulgações (como avisos de direitos do consumidor e termos de produtos financeiros) sejam compreensíveis para pessoas com deficiência, a marcação de idioma não é apenas uma boa prática técnica — ela faz parte da obrigação de comunicação acessível incorporada ao mandato mais amplo do circular.

Organizações que buscam o logo são aconselhadas a conduzir auditorias estruturadas de conteúdo para identificar todos os trechos em idioma estrangeiro em suas propriedades digitais, implementar um processo de desenvolvimento que imponha a aplicação do atributo lang na camada de gestão de conteúdo e incluir Language of Parts em seus protocolos regulares de testes de acessibilidade, juntamente com ciclos de revisão automatizados e manuais.