Como corrigir erros de codificação (acentuação)

by Coyote on qui, 11/11/2010 - 23:20

Um problema relatado com certa frequência em fóruns que participo é o de erros na acentuação de textos.

Motivado por um post no Drupal-br, resolvi colocar essa dica para outras pessoas que passem pelo mesmo problema.

Para que a acentuação e caracteres especiais apareçam corretamente é necessário configurar os 3 ítens abaixo da mesma maneira:

1. a página;
2. o banco de dados;
3. o editor.

Considerando o uso de utf-8 (o mais indicado), como isso deve ser feito ?

1. Na página:

1.1 Definir o idioma (opcional mas recomendado)
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br">

1.2 definir o charset
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

2. No banco de dados (MySql)

2.1 Conjunto de caracteres MySQL: UTF-8 Unicode (utf8)
2.2 Collation de conexão do MySQL: utf8_unicode_ci

3. No editor. IMPORTANTE, aqui é onde aparece muito problema.
Normalmente as pessoas não se ligam na codificação que seu editor usa. Editam o arquivo, salvam e pronto. Ao enviar para o servidor, mesmo estando correto o charset da página e do bd, o erro persiste.
No nosso exemplo, usando utf-8, nosso editor precisa salvar usando utf-8 também.
No Windows normalmente os editores salvam usando iso-8859-1, para não ter problema é necessário identificar onde mudar esse parâmetro e então salvar o arquivo em utf-8.

Um exemplo de como esse pequeno detalhe muda tudo, criei 2 arquivos html idênticos em conteúdo e o charset está setado como utf-8, que pode ser constatado no código fonte da página, porém ao salvar, um foi salvo com iso-8859-1 e outro com utf-8

Veja os exemplos aqui:
charset utf-8, gravado com codificação iso-8859-1
charset utf-8, gravado com codificação utf-8

Vê como muda tudo ? ;)

Segue alguns editores em Windows/Linux e onde mudar essa opção:

Windows (com a colaboração do gutomec- Luiz Gustavo) :D

Dreamweaver:
1 - Para trocar o file encoding vá em Modify>Page Properties... (ou Ctrl+j);
2 - Em Category selecione Title/Encoding;
3 - Selecione em Encoding o que desejar e dê um OK;
4 - Salve o documento.

EditPlus:
1 - Vá em Documents>File Encoding>Change File Encoding;
2 - Vai abrir uma janela pedindo para selecionar o file encoding, selecione o desejade e dê um OK.
3 - Salve o documento.

Linux

Geany
1 - vá em "documento"
2 - selecione "definir codificação"
3 - escolha a codificação desejada

Gedit
1 - vá em "arquivo"
2 - selecione "salvar como"
3 - selecionar na caixa select o código desejado

Eclipse
1 - vá em "preferences
2 - em "editors" procure a opção para definir codificação

Espero ter ajudado e aos que quiserem contribuir, podem comentar a vontade.

Abs