Como Desativar Sugestões de Tradução no Chrome: Código HTML
Resposta Rápida
Para desativar a tradução automática de uma página da web no Chrome, adicione a classe notranslate ao elemento <html>:
<html class="notranslate">
<!-- É simples: "notranslate" significa "não traduza" -->
</html>A classe notranslate informa ao navegador Chrome para exibir a página em sua forma original para todos os usuários que utilizam o recurso de tradução automática.
Você também pode usar uma meta tag para "proteger" a página de tradução automática pelo Google. Coloque o seguinte código na seção <head>:
<meta name="google" content="notranslate">O atributo "notranslate" na meta tag é uma indicação para o Google de que a tradução do conteúdo da página não é desejada.
Implementação Detalhada
Desativando Tradução para Elementos Específicos
Para excluir partes específicas de texto da tradução automática, use o atributo translate="no":
<div translate="no">Este texto é especial. Ele não será traduzido.</div>O atributo translate pode ser aplicado a todos os elementos HTML para proteger certas seções de conteúdo da tradução.
Verificando Compatibilidade
Verificar a compatibilidade deste método com os navegadores é tão crucial quanto checar um paraquedas antes de saltar de uma altura. A maioria dos navegadores modernos suporta esses mecanismos, mas é sempre recomendável revisar a documentação oficial para obter as informações mais recentes.
Protegendo Exemplos de Código
Para manter a aparência original dos exemplos de código em uma página da web, use a classe notranslate. Isso evitará distorções na exibição:
<pre class="notranslate">const foo = 'bar'; // Certo? Isso deve permanecer não traduzido.</pre>Dessa forma, o código será exibido em sua forma original e será fácil para qualquer usuário entender.
Estilizando Elementos Editáveis
Ao trabalhar com os atributos translate ou classes notranslate, é crucial considerar possíveis problemas de estilo. Você poderá precisar modificar os estilos usando layouts flexíveis, aqui está um exemplo:
<div style="display: flex; gap: 20px;">
<span translate="no">Isso não precisa ser traduzido.</span>
<span>Aqui o texto está disponível para tradução.</span>
</div>Certifique-se de que tanto o texto traduzido quanto o não traduzido mantenham uma aparência consistente e organizada.
Visualização
Imagine que sua página da web é a sua casa aconchegante e o Google Tradutor é um vizinho incômodo que adora reorganizar tudo:
Casa da Página Web 🏡: [🛋️, 🪑, 🖼️, 📚]
Google Tradutor 🧑🔧: [🔄🛋️, 🔀🪑, 🔄🖼️, 🔀📚]Para bloquear essa atividade indesejada, coloque uma placa de proibição nas portas do seu HTML:
<meta name="google" content="notranslate">Como resultado, o vizinho não poderá mudar nada sem a sua permissão:
Casa da Página Web 🏡: [🛋️, 🪑, 🖼️, 📚]
Google Tradutor 🧑🔧: [🚫 Não toque nisso, está tudo bem!]Dessa forma, sua "casa" na Internet permanecerá como você pretendeu, livre da interferência do Google Tradutor.
Destacando Conteúdo Multilíngue
Em páginas multilíngues, você pode destacar frases ou palavras específicas sem limitar sua tradução. Para fazer isso, use a tag <b>:
<b>Atenção, isso é importante!</b> Texto regular que pode ser traduzido.Esta combinação de ênfase visual e controle de tradução torna o conteúdo mais amigável em um ambiente multilíngue.
Experimentando em Busca da Perfeição
Não hesite em experimentar diversos elementos e atributos para encontrar a opção que melhor se adapte a você. Busque o equilíbrio entre acessibilidade, estética e funcionalidade que proporcionará a melhor interação com seus usuários.
E lembre-se, a abordagem do Google em relação a mudanças de tradução ocorre rapidamente, então verifique regularmente a documentação do Google para as atualizações mais recentes sobre como gerenciar traduções.
Recursos Úteis
- Blog Oficial do Google Webmaster — Descubra o impacto sociocultural das traduções na web no conteúdo.
- O Atributo 'translate' no HTML: Linguagem de Marcação de Hipertexto | MDN — Um guia detalhado para usar o atributo 'translate' no HTML.
- Usando o Atributo translate no HTML — Um resumo detalhado do atributo
translatea partir de materiais da W3C. - Alterando Linguagens no Chrome e Traduzindo Páginas da Web - Ajuda do Google Chrome — Instruções do Google para desativar a tradução automática de páginas da web.
- Migrando para o Manifest V3 | Extensões | Documentação dos Desenvolvedores do Chrome — Informações essenciais para desenvolvedores de extensões do Chrome, incluindo recursos de tradução.