Eae galera!
O post de hoje é uma dica para quem está trabalhando com tecnologias web. Muitas vezes enquanto estamos desenvolvendo alguma coisa que será testada no navegador, não é difícil nos deparamos com alguns caracteres estranhos, e este é o assunto do post de hoje.
Boa Leitura!
UTF-8 e Codificação de Caracteres
Imagine a seguinte situação: você escreve uma página php & html e publica a mesma em um servidor. Ao abrir a página você vê algo parecido com a imagem abaixo:
Porque isto acontece? Simples, existe um assunto que todo desenvolvedor deveria saber pelo menos o mínimo que é a codificação de caracteres.
A codificação garante que uma página escrita num conjunto de caracteres específico mantenha suas características.
Primeiro, para descobrir qual codificação seu navegador usa clique no menu Exibir>Codificação, como na imagem abaixo:
Veja que no exemplo o meu navegador está configurado para exibir codificação utf-8, mas meu arquivo (da imagem 1 deste post) não utilizava a mesma codificação, por isso a página aparecia com um caracter estranho e não conseguia apresentar o acento circunflexo do Alô.
Para resolver o problema, existem 2 soluções, a primeira é abrir seu arquivo pelo Bloco de Notas e mudar o padrão de codificação, como na imagem abaixo:
A segunda maneira é inserir uma metatag logo abaixo da seção head do arquivo html, como no exemplo abaixo:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">Veja que em ambas opções só mudamos do padrão ANSI para UTF-8, mas a opção do código é mais garantida. Se ela for usada deve ser a primeira coisa a vir na seção head, porque o navegador reinicia o carregamento da página ao encontrá-la.
NOTA: Se você ficar em dúvida em qual padrão usar, escolha o UTF-8 porque com ele você pode escrever os códigos usando acentos normalmente. Se você conhece bem as entidades html, não se preocupe!
Para quem quiser saber mais sobre codificação de caracteres, eu sugiro esta página, que foi minha fonte de consulta. Nela tem um artigo completo sobre o assunto.
Até a próxima!
Sanoj's devLab 