# Atributo Lang

![](/files/uhF2GEUM4b5TAvmpIvaO)

### Importância

Vivemos em uma época globalizada, no qual pessoas de vários países podem acessar nossos sites. Muitas dessas pessoas também possuem algum problema de acessibilidade e fazem uso de leitores de tela para poderem navegar corretamente nos sites.

Quando não especificamos o atributo `lang` em nosso site, um leitor de tela presumirá que a página está no idioma padrão que o usuário escolheu. Caso ela não esteja, o leitor poderá anunciar os textos da página de maneira incorreta.

### Recomendações

Sempre use o atributo de idioma `lang` na tag `html` . Este será herdado por todos os demais elementos, desse modo definindo o idioma padrão do texto no elemento `head` do documento.

O atributo lang segue as definições da normal [IETF BCP47](https://tools.ietf.org/search/bcp47), sendo completa o suficiente para abranger dialetos bem específicos. Na grande maioria seu uso é bem simples:

* **Idioma** <mark style="color:red;">\[requerido]</mark>: um código de 2 ou 3 caracteres que define o idioma base, tipicamente escrita em letras minúsculas.&#x20;
  * en é o equivalente para Inglês&#x20;
  * pt é o equivalente para Português;<br>
* **Região**: define um dialeto do idioma base em uma localização particular e tem um código de 2 letras maiúsculas referentes ao país, ou um código de três números referentes à uma área fora do país.&#x20;
  * es-ES é para espanhol falado na Espanha
  * es-013 é o espanhol falado na America Central.

Na Tray existe a variável `tray.lang` disponível para colocar o idioma configurado pelo lojista na loja no HTML. Existem 3 idiomas atualmente suportados pela plataforma:

* Português - pt
* Espanhol - es
* Inglês - en

O código abaixo demostra o uso dessa variável quando configurado com o idioma Português:

{% code title="Código exemplo" %}

```html
<!DOCTYPE html>
<html lang="{{ tray.lang }}">    
    ...
</html>
```

{% endcode %}

{% code title="Código renderizado" %}

```html
<!DOCTYPE html>
<html lang="pt">    
    ...
</html>
```

{% endcode %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://partners.tray.com.br/themes/construindo-seu-template/core-web-vitals/acessibilidade/atributo-lang.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
