Le web de Dominique Guebey – Bazar informatique

Page : http://www.dg77.net/tekno/html/html10.htm


   D o m i n i q u e   G u e b e y    J u n g l e      Bazar informatique

Tutorial HTML

Couleurs et caractères spéciaux

Utilité de la représentation codée des caractères

Devinette : comment afficher "<body>" alors qu'il s'agit d'une balise HTML destinée à l'interprétation par le "navigateur", et non pas à être affichée telle-quelle ? L'insertion de ces caractères risquerait de mettre en difficulté le navigateur. Réponse : en utilisant une représentation symbolique des caractères "<" (plus petit que) et ">" (plus grand que). Dans le fichier source on a, en réalité, ce qui suit.


&lt;body&gt;

On appelle"entités" ces symboles précédés par "&" et terminés par ";". Une entité intéressante est le caractère blanc (espace) : &amp;nbsp;, utile par exemple dans les tableaux, si une case est vide. "lt" est l'abréviation de "lower than" (inférieur à) ; et "gt" de "greater than" (supérieur à).

Mais alors, comment peut-on faire apparaître "&lt;" ci-dessus, alors que cette valeur devrait amener l'affichage de "<" ? Explication : parce qu'à la place du "&", on a utilisé le code qui définit ce caractère pour l'ordinateur : 38 en décimal ou 26 en code hexadécimal. Le code décimal est inclu comme ceci dans le fichier source html :

&#038;lt;body&#038;gt;

Caractères accentués et entités

Une page conçue pour Internet doit pouvoir être lisible sur tout ordinateur du monde entier. Or, ils ne sont pas tous configurés, loin s'en faut, pour afficher nos caractères accentués comme "é", "è", "à". L'anglais ignore les accents, l'allemand a son "umlaut", l'espagnol son tilde ("ñ"). Il est donc préférable d'utiliser les entités ad-hoc, que les navigateur savent reconnaître. Ceci n'est pas si contraignant qu'il y paraît : certains éditeurs, comme Jext, assistent la saisie en complètant automatiquement les entités (ainsi que les balises html) dès qu'on commence à en saisir une. Si on ne dispose pas d'une telle fonctionalité, ce n'est pas un problème : il suffit de saisir dans un premier temps avec les caractères accentués normaux ; quand la saisie du texte est terminée, on utilise simplement la fonction rechercher/remplacer qu'offrent les plus simples éditeurs de texte, comme Notepad.

Quelques caractères spéciaux et leurs "entités"

HE XADeci malAffichageEntité
22&#34;"&quot;
26&#38;&&amp;
3C&#60;<&lt;
3E&#62;>&gt;
A0&#160; &nbsp;
A3&#163;£&pound;
A7&#167;§&sect;
E0&#224;à&agrave;
E2&#226;â&acirc;
E4&#228;ä&auml;
E6&#230;æ&aelig;
E7&#231;ç&ccedil;
E8&#232;è&egrave;
E9&#233;é&eacute;
EA&#234;ê&ecirc;
EB&#235;ë&euml;
ED&#237;í&iacute;
EE&#238;î&icirc;
EF&#239;ï&iuml;
F1&#241;ñ&ntilde;
F2&#242;ò&ograve;
F3&#243;ó&oacute;
F4&#244;ô&ocirc;
F6&#246;ö&ouml;
F9&#249;ù&ugrave;
FA&#250;ú&uacute;
FB&#251;û&ucirc;
FC&#252;ü&uuml;

Codes couleurs R-V-B

Les couleurs s'expriment par une combinaison de ROUGE-VERT-BLEU (red-green-blue : rgb). Chacune est quantifiée sur 256 niveaux de 0 à 255, ou 00 à FF en hexadécimal. FF0000 est le rouge, 00FF00 le vert et 0000FF le bleu. 000000 signifie aucune couleur (noir) et FFFFFF toutes les couleurs, c'est-à-dire blanc. Avec FFFF00, par exemple, on aura l'inverse du bleu, c'est-à-dire jaune. Voir le nuancier ci-dessous. Exemple : pour afficher une page avec un fond bleu clair, on intègrera la couleur de la façon suivante dans le tag "BODY":

bgcolor est l'abréviation de "background color" (couleur d'arrière-plan). Il est possible d'utiliser des noms de couleurs ("blue"…) ; mais alors on risque de tomber sur des incompatibilités, chaque navigateur ayant sa propre table d'équivalence code/nom.
Nuances de gris 000000  
3F3F3F  
7F7F7F  
BFBFBF  
FFFFFF  
Nuances de rouge 3F0000              3F2F1F              3F1F2F             
7F0000   7F3F2F   7F2F3F  
FF0000   FF7F5F   FF5F7F  
FF7F7F   FF9F6F   FF6F9F  
FFBFBF   FFBF9F   FF9FBF  
Nuances de vert 003F00   2F3F1F   1F3F2F  
007F00   3F7F2F   2F7F3F  
00FF00   7FFF5F   5FFF7F  
7FFF7F   9FFF6F   6FFF9F  
BFFFBF   BFFF9F   9FFFBF  
Nuances de bleu 00003F   2F1F3F   1F2F3F  
00007F   3F2F7F   2F3F7F  
0000FF   7F5FFF   5F7FFF  
7F7FFF   9F6FFF   6F9FFF  
BFBFFF   BF9FFF   9FBFFF  
Opposé à rouge (cyan) 003F3F   001F2F   002F1F  
007F7F   002F3F   003F2F  
00FFFF   005F7F   007F5F  
7FFFFF   7FBFDF   7FDFBF  
BFFFFF   BFDFFF   BFFFDF  
Opposé à vert (magenta) 3F003F   1F002F   2F001F  
7F007F   2F003F   3F002F  
FF00FF   5F007F   7F005F  
FF7FFFF   BF00BF   DF7FBF  
FFBFFF   DFBFFF   FFBFDF  
Opposé à bleu (jaune) 3F3F00   1F2F00   2F1F00  
7F7F00   2F3F00   3F2F00  
FFFF00   5F7F00   7F5F00  
FFFF7F   BFDF7F   DFBF7F  
FFFFBF   DFFFBF   FFDFBF