Caractere nada mais é que um símbolo gráfico que é representado na memória do computador por bytes. Antigamente, havia uma dificuldade de padronização das representações gráficas em textos, ao ponto de cada país utilizar uma codificação diferente. Os caracteres são case-sensitives, ou seja, se diferem do maiúsculo para o minúsculo. Um computador identifica o ‘a’ como diferente de ‘A’ , seguindo algum padrão de codificação de caracteres.
História da codificação de caracteres
Um comitê internacional decidiu quais os símbolos universais que iriam representar no novo tipo de codificação que estavam criando. Assim, surgiu o UNICODE, publicado no livro The Unicode Standard, uma tabela que tem aproximadamente 107 mil caracteres. Seu grande objetivo é universalizar a informação, inibindo as possíveis limitações de codificação de caracteres. O ASCII (American Standard Code for Information Interchance) é uma codificação americana baseada no UNICODE, que utiliza uma cadeia de 8 bits (1 byte) para representar um caractere. Desenvolvida em 1960, serviu como base para a criação de outras codificações mais atuais.
Derivado do ASCII, o padrão ISO-8859-1 é o conjunto de caracteres padrão na maioria dos navegadores. Um problema que havia acontecendo é o navegador confundir os sinais maior que (>) e menor que (<).
Outro padrão comumente usado nos navegadores atuais é o UTF-8 (8-bit Unicode Transformation Format), também baseado no UNICODE, supracitado, e compatível com o ASCII.
Mãos na Massa!
Em HTML4, para definirmos qual codificação, utilizamos as tags abaixo:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
Em HTML5, ao fato da tag anterior ser bastante grande e propícia a erros, os desenvolvedores da linguagem simplificaram-na:
<meta charset=utf-8>
Para as folhas de estilo CSS externas, também é necessário identificarmos a codificação sempre que utilizarmos caracteres de texto que não sejam ASCII no arquivo, como alguns tipos de valores de seletores.
Para isso, utilizamos a declaração @chartset, no início do documento.
@charset "<nome do padrão seguindo o documento IANA >";
Exemplo:
@charset "UTF-8";
Por que utilizar?
A tag de codificação deve ser sempre incluída em seus documentos HTML/CSS, mesmo se não houver a utilização de caracteres especiais. Se não houver uma codificação definida, os navegadores identificarão que a codificação de sua página é UTF-7, podendo injetar scripts que fazem com que seu site se torne inválido.
Infelizmente, há muitos conjuntos de caracteres e codificações de caracteres. É necessário escolhermos qual a melhor codificação de caracteres para o conteúdo de sua página. Atualmente, o padrão UTF-8 é, frequentemente, uma boa escolha. É bom lembrar que muitos servidores possuem sua própria codificação de caracteres, faça os devidos testes em navegadores diferentes.