Conception & Réalisation de sites Web

L'encodage des fichiers et les caractères spéciaux

L'encodage des caractères

Un bon exemple pour comprendre l'encodage des caractères est l'exemple du code morse. En morse, chaque caractère alphabétique est traduit par une de sons courts et/ou longs. Ainsi, 3 bips cours donnent un "S", 3 bip longs un "O", etc...

En informatique, les caractères alphabétiques sont associés à des codes binaires, c'est à dire composés d'une suite de 1 et de 0. Il existe plusieurs façon de traduire les caractères en codes binaires :

  • En ASCII, les caractères sont codés sur 7 bits, soit un code composé de sept chiffres qui sont tous égaux à 0 ou à 1. Il permet donc de représenter 27 soit 128 caractères différents. 128 caractères sont suffisant pour mémoriser notre alphabet, les chiffres, des élements de ponctuation (...), mais pas suffisant pour stocker nos caractères spéciaux (accents, cédilles...)
  • En ISO 8859-1 (souvent appelée Latin-1), les caractères sont codés sur 8 bits. Il permet donc de représenter 28 soit 256 caractères différents. 256 caractères sont suffisant pour mémoriser notre alphabet latin avec les caractères spéciaux (accents, cédilles...)
  • L'ISO 8859-15 (souvent appelée Latin-9) est une variante réactualisée du Latin-1. Toujours codée sur 8 bits, il ajoute notamment le caractère euro (€) et les caractères œ et Œ à la place de certains caractères peu utilisés.
  • Le Windows-1252 (parfois appelé AINSI) est un encodage propre aux ordinateurs Windows. S'il est lui aussi codé sur 8 bits, certains caractères diffèrent des codages ISO vu ci-dessus.
  • Le MacRoman est un encodage propre aux ordinateurs Apple Macintosh. S'il est lui aussi codé sur 8 bits, certains caractères diffèrent des codages ISO et Windows-1252 vu ci-dessus.
  • L'UTF-8 est un encodage dit "Unicode". L'Unicode vise à donner à tout caractère quelque soit son alphabet (latin, cyrillique, asiatique...) un code unique et compatible sur toutes les plateformes (Windows, Mac, Unix). L'UTF-8 est codé sur 8 à 32 bits ce qui permet d'encoder un nombre de caractères quasi illimité. Voir en fin de page pour en savoir plus.

A l'origine, les fichiers HTML sont faits pour être encodé en ASCII, c'est à dire sans caractères spéciaux. Pour pallier à ce problème, le langage HTML permet de traduire chaque caractère spécial par un code alpha numérique comme décrit dans la table ci-après.

Ajourd'hui encore, utiliser cette table de conversion permet de se prémunir contre les incompatibilités. Imaginons par exemple que je crée une page Web sur Mac et l'enregistre en MacRoman : si un visiteur vient voir ma page depuis un PC, il risque de voir mes accents remplacé par un code incompréhensible (ex : «J'aime l'√©at√©a» au lieu de «J'aime l'été»).

Les caractères spéciaux en HTML

En HTML, tous les caractères spéciaux peuvent être remplacés par un code commençant par & (esperluète ou « et commercial ») et terminant par ; (point virgule). En voici une liste non exhaustive :

Code Résultat dans le navigateur
   [Espace insécable]
" "
&lt; <
&gt; >
&laquo; «
&raquo; »
&amp; &
&euro;
&yen; ¥
&copy; ©
&reg; ®

Les caractères accentués ou encore les lettres avec cédilles sont également des caractères spéciaux. Chacun a donc sa représentation en HTML. En voici quelques exemples :

Code Résultat dans le navigateur
&agrave; à
&acirc; â
&eacute; é
&egrave; è
&ecirc; ê
&icirc; î
&iuml; ï
&oelig; œ
&ugrave; ù
&ucirc; û
&ccedil; ç

Ces caractères peuvent également être utilisés en majuscule :

Code Résultat dans le navigateur
&Agrave; À
&Acirc; Â
&Eacute; É
&Egrave; È
&Ecirc; Ê
&Icirc; Î
&Iuml; Ï
&OElig; Œ
&Ugrave; Ù
&Ucirc; Û
&Ccedil; Ç

L'avantage de l'UTF-8

L'UTF-8 est aujourd'hui compris par tous les navigateurs courrants. Il permet d'encoder un nombre quasi illimité de caractères (plus de 4 milliards !).

En utilisant l'UTF-8 dans nos pages, on s'affranchit de la conversion des caractères spéciaux en code HTML. Un "e" avec accent aigu pourra donc être écrit directement "é" et non "&eacute;" dans notre code source.

Pour écrire nos pages en UTF-8, il faut d'abord préciser lors de leur enregistrement l'encodage souhaité. Généralement, en choisissant "enregistrer sous" dans votre éditeur de texte, vous pouvez sélectionner l'encodage. Choisissez alors "UTF-8" !
Sur Adobe Dreamweaver, appuyez simultanément sur les touches «Ctrl» et «J» («Pomme» et «J» sur Mac) pour afficher les propriétés de la page. Choisissez ensuite "Titre et encodage", puis choisissez "Unicode 4.0 UTF-8" en face de "Encodage".

Il vous faudra ensuite, si ce n'est pas déjà le cas, préciser dans l'entête de votre page l'encodage choisi grâce à une balise Meta :

Ajouter le code suivant entre les balises <head> et </head> :

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

Copyright © 2014 Erwan DUPEUX MAIRE - Tous droits réservés.
Valid XHTML 1.0 Transitional Valid CSS!