Dicas rápidas de internacionalização para a Internet

Codificação. Use o Unicode sempre que possível para conteúdo, bases de dados, etc. Sempre declare a codificação do conteúdo.

Escapes. Use caracteres em vez de escapes (exemplo á á ou á) sempre que possível.

Idioma. Declare o idioma dos documentos e indique alterações internas de idioma.

Apresentação vs. conteúdo. Use folhas de estilo para informações de apresentação. Limite a marcação para a semântica.

Imagens, animações & exemplos. Verifique a possibilidade de tradução e a distorção cultural inadequada.

Formulários. Use uma codificação adequada no formulário e no servidor. Ofereça suporte para formatos locais de nomes/endereços, horários/datas, etc.

Criação de texto. Use um texto simples e conciso. Fique atento ao criar sentenças de várias cadeias de caracteres.

Navegação. Em cada página, inclua uma opção de navegação bem visível para localizar páginas ou sites, usando o idioma de destino.

Texto da direita para a esquerda. Para XHTML, adicione dir="rtl" à tag html. Apenas use novamente para alterar a direção básica.

Verifique o seu trabalho. Valide! Use técnicas, tutoriais e artigos disponíveis no site http://www.w3.org/International/

As 'Dicas Rápidas' a seguir resumem os conceitos principais de web design internacional. Essas dicas não são orientações completas. Elas são apenas um conjunto de conceitos descritos no subsite Internationalization Activity da W3C.

Esta página lista as dicas em frases bastante resumidas, que também aparecem nos cartões de referência rápida, seguidas por textos que fornecem mais detalhes e explicações. Além disso, oferecemos um link para informações no subsite de internacionalização da W3C, quando disponíveis, onde você poderá conhecer mais sobre o assunto.

Esta página será atualizada ao longo do tempo.

Dicas rápidas

Codificação. Use o Unicode sempre que possível para conteúdo, bases de dados, etc. Sempre declare a codificação do conteúdo.

A codificação de caracteres que você escolhe determina a maneira como os bytes são mapeados para caracteres em seu texto.

Geralmente, as codificações de caracteres são limitadas a um script em especial ou a um conjunto de idiomas. O Unicode permite que você trabalhe de forma simples com quase todos os scripts e idiomas em uso em todo o mundo. Deste modo, o Unicode simplifica a manipulação de conteúdo em vários idiomas dentro de uma única página ou entre um ou mais sites. O Unicode é especialmente útil quando usado em formulários, scripts e bases de dados, onde você muitas vezes precisa oferecer suporte a vários idiomas. O Unicode também facilita muito a adição de novos idiomas ao seu conteúdo.

Se você não declarar de forma correta qual a codificação de caracteres que você está usando, é possível que os usuários não consigam ler o seu conteúdo. Isso acontece porque suposições incorretas sobre a maneira como os bytes são mapeados para caracteres podem ser feitas pelo aplicativo que interpreta o seu texto.

Mais informações
Codificações de caracteres para iniciantes explica alguns dos conceitos básicos sobre as codificações de caracteres e porque você deve saber mais sobre o assunto. Introdução a conjuntos de caracteres e codificações oferece uma breve introdução a diversos aspectos do assunto.
Então, como faço isso?
Autores de HTML & CSSDesenvolvedores de especificaçãoConfiguração de servidor
Escapes. Use caracteres em vez de escapes (exemplo á á ou á) sempre que possível.

Escapes como Referências de Caracteres Numéricos (Numeric Character References - NCRs), e entidades são maneiras de representar qualquer caractere Unicode na marcação usando apenas caracteres ASCII. Por exemplo, você pode representar o caractere á em X/HTML como á ou á ou á.

Esses escapes são úteis para representar claramente caracteres ambíguos ou invisíveis, e para evitar problemas com caracteres de sintaxe, como E comercial e sinais de maior e de menor. Eles também podem ser úteis algumas vezes para representar caracteres que não são suportados pela codificação de caracteres em uso ou que não estão disponíveis no teclado. Em outros casos, você sempre deve usar caracteres em vez de escapes.

Mais informações
Uso de entidades de caracteres e NCRs oferece informações adicionais sobre o uso de escapes em linguagens de marcação. Em especial, observe que as entidades (como á) devem ser usadas com atenção.
Então, como faço isso?
Autores de HTML & CSSDesenvolvedores de especificaçãoAutores de SVG
Idioma. Declare o idioma dos documentos e indique alterações internas de idioma.

Informações sobre o idioma (humano) do conteúdo são importantes para acessibilidade, estilização, busca, edição, e por outros motivos. Quanto mais conteúdo for classificado corretamente, mais os aplicativos que conseguem detectar as informações de idioma se tornarão úteis e abrangentes.

Quando declarar um idioma, você pode precisar expressar informações sobre uma série específica de conteúdo em um modo diferente do metadados sobre o documento por inteiro. É importante entender essa diferença.

Mais informações
Idiomas na Internet oferece uma breve introdução a diversos aspectos do assunto.
Então, como faço isso?
Autores de HTML & CSSAutores de SVGAutores de XMLDesenvolvedores de esquemaConfiguração de servidor
Apresentação vs. conteúdo. Use folhas de estilo para informações de apresentação. Limite a marcação para a semântica.

Um princípio importante de web design é manter o estilo ou a apresentação do conteúdo separados do texto verdadeiro. Isso facilita a aplicação de um estilo alternativo ao mesmo texto, por exemplo, para exibir o mesmo conteúdo em um browser convencional e em um dispositivo manual pequeno.

Este princípo é especialmente útil para localização, pois scripts diferentes têm necessidades tipográficas distintas. Por exemplo, devido à complexidade dos caracteres japoneses, pode ser preferível mostrar ênfase em páginas X/HTML em japonês de outras maneiras, em vez de usar o negrito e o itálico. Será muito mais simples aplicar essas alterações se a apresentação for descrita usando CSS, e a marcação será muito mais limpa e manejável se o texto for classificado de modo correto e claro como 'enfatizado' em vez de apenas 'negrito'.

Você pode economizar um tempo e um esforço considerável durante a localização se trabalhar com arquivos CSS em vez de ter de alterar a marcação, pois qualquer alteração necessária poderá ser feita em um único local para todas as páginas, e o tradutor poderá se focar no conteúdo e não na apresentação.

Mais informações
Veja os slides de palestras da conferência de 2007 de @media "Design para usuários internacionais: dicas práticas".
Imagens, animações & exemplos. Verifique a possibilidade de tradução e a distorção cultural inadequada.

Se você quiser que o seu conteúdo realmente se comunique com as pessoas, você precisa falar a língua delas, não apenas por meio do texto, mas também por meio de imagens, cores, objetos e questões locais. É fácil ignorar a natureza cultural do simbolismo, do comportamento, dos conceitos, da linguagem corporal, do humor, etc. Você deve buscar opiniões sobre a adequação e a relevância de suas imagens, vídeos, e exemplos para usuários de um determinado país.

Você também deve ter cuidado ao incorporar textos em gráficos quando o conteúdo é traduzido. Textos em planos de fundo complexos ou em espaços restritos podem causar um grande problema para o tradutor. Você deve enviar ao grupo de localização os gráficos que tenham textos em uma camada separada, e deve se lembrar de que textos em idiomas como inglês e chinês certamente ficarão mais extensos após a tradução.

Mais informações
Veja os slides de palestras da conferência de 2007 de @media "Design para usuários internacionais: dicas práticas".
Formulários. Use uma codificação adequada no formulário e no servidor. Ofereça suporte para formatos locais de nomes/endereços, horários/datas, etc.

A codificação usada para uma página HTML que contém um formulário deve suportar todos os caracteres necessários para inserir dados no formulário. Isso é especialmente importante se for possível que os usuários adicionem informações em vários idiomas.

As bases de dados e os scripts que recebem dados de formulários em páginas com vários idiomas também devem ser capazes de suportar os caracteres para todos esses idiomas simultaneamente.

A maneira mais simples de permitir que isso aconteça é utilizar o Unicode para ambas as páginas que contêm os formulários e todos os processos e armazenagem de retaguarda. Nesta situação, o usuário poderá inserir dados em qualquer idioma e script que precisar.

Você também deve evitar fazer suposições de que informações como o nome e o endereço do usuário seguirão as mesmas regras de formatação que o seu idioma segue. Pergunte-se quantos itens você realmente precisa dividir em campos separados para informações como endereços. Lembre-se de que não há nomes de ruas em algumas culturas, em outras, o número da residência é informado após o nome da rua, e que algumas pessoas precisam de mais de uma linha para a parte do endereço que precede o nome do estado ou da cidade, etc. Na verdade, em alguns locais, o endereço começa pelas informações gerais e segue até as específicas, o que exige uma estratégia de layout muito diferente. Tenha muito cuidado para não ter suposições incorretas sobre a extensão dos códigos de área ou dos números de telefone durante as rotinas de validação. Reconheça que a classificação cuidadosa é necessária para saber como inserir datas numéricas, pois há convenções diferentes para ordem do dia, do mês e do ano.

Se você estiver reunindo informações de pessoas em mais de um país, é importante desenvolver uma estratégia para lidar com os diferentes formatos que as pessoas irão pensar que podem utilizar. Além de ser importante para o design dos formulários que você cria, isso também terá um impacto na maneira em que você armazenará essas informações em bases de dados.

Então, como faço isso?
Autores de HTML & CSSAutores de HTML & CSSDesenvolvedores de especificação
Criação de texto. Use um texto simples e conciso. Fique atento ao criar sentenças com várias cadeias de caracteres.

Um texto simples e conciso é mais fácil de ser traduzido. Se ele não estiver na língua materna das pessoas, também será mais fácil para que elas entendam o texto.

Você deve ter bastante cuidado ao criar mensagens de várias subcadeias ou ao inserir textos variáveis nas cadeias. Por exemplo, imagine que o seu site usa script JSP, e você decide criar determinadas mensagens com rapidez. Você pode criar mensagens concatenando subcadeias separadas, como 'Apenas' ou 'Não', 'fornecer resultados em', e 'qualquer formato' ou 'HTML'. Como a ordem do texto nas sentenças em outros idiomas pode ser muito diferente, a tradução desse texto pode ser mais difícil.

Da mesma forma, é importante evitar a fixação das posições dos variáveis em textos como "Página 1 de 10". A sintaxe de outros idiomas pode exigir que os números sejam apresentados em ordem reversa para fazer sentido. Se você usa a linguagem PHP, isso significa usar uma cadeia de formatação como "Página %1\$d de %2\$d.", em vez da mais simples "Página %d de %d.". A última não poderá ser traduzida para alguns idiomas.

Então, como faço isso?
Autores de HTML & CSS
Navegação. Em cada página, inclua uma opção de navegação bem visível para localizar páginas ou sites, usando o idioma de destino.

Quando você tiver versões de uma página ou site em um idioma diferente, ou para um país ou região diferentes, você deve fornecer uma maneira para que o usuário visualize a versão que ele prefere. Essa opção deve ficar disponível em qualquer página de seu site onde houver essa alternativa.

Quando fornecer links para páginas em outras línguas, use o nome do idioma de destino no script e na língua nativa. Não suponha que o usuário saiba português. Por exemplo, em um link para uma página francesa, 'francês' deve ser 'français'. Isso também se aplica se você estiver guiando o usuário até uma página ou site específico para um país ou região, por exemplo, 'Alemanha' seria 'Deutschland'.

Então, como faço isso?
Autores de HTML & CSS
Texto da direita para a esquerda. Para XHTML, adicione dir="rtl" à tag html. Apenas use novamente para alterar a direção básica.

Textos em idiomas como árabe, hebraico, persa e urdu são lidos da direita para a esquerda. Essa direção de leitura geralmente resulta em textos alinhados à direita e em imagens espelhadas de layout de página e de tabelas, por exemplo. Você pode configurar o alinhamento padrão e a disposição do conteúdo da página da direita para a esquerda simplesmente incluindo dir="rtl" na tag html.

A direção configurada na tag html estabelece uma direção básica para o documento que é atribuída a todos os elementos na página. Não é necessário repetir o atributo em elementos menores a menos que você queira especificamente alterar o fluxo direcional.

Os textos incorporados em um script latim, por exemplo, ainda são da esquerda para a direita dentro do fluxo geral da direita para a esquerda. O mesmo acontece com os números. Se estiver trabalhando com idiomas lidos da direita para a esquerda, você deve se familiarizar com os conceitos básicos do algoritmo bidirecional do Unicode. Este algoritmo cuida da maior parte do texto bidirecional sem a necessidade de intervenção do autor. No entanto, há algumas circunstâncias em que a marcação ou os caracteres de controle do Unicode são necessários para garantir o efeito correto.

Mais informações
Criação de páginas (X)HTML em árabe & hebraico oferece uma breve introdução aos conceitos básicos da manipulação de textos da direita para a esquerda em HTML. Os princípios são parecidos para outras linguagens de marcação.
O que você precisa saber sobre o algoritmo bidi e sobre a marcação alinhada oferece uma breve introdução aos conceitos básicos da manipulação de textos bidirecionais alinhados.
Então, como faço isso?
Autores de HTML & CSSAutores de SVGAutores de XMLDesenvolvedores de esquema
Verifique o seu trabalho. Valide! Use técnicas, tutoriais e artigos disponíveis no site http://www.w3.org/International/
Try the W3C Internationalization Checker.

Outros materiais introdutórios

Recentemente, publicamos uma página de Instruções Iniciais para ajudá-lo a encontrar informações no site. A página de Instruções Iniciais indica uma série de artigos que estão sendo escritos e que oferecem aos iniciantes uma breve introdução aos principais tópicos da internacionalização e indicam informações básicas no site para que você siga em frente.