LE TEXTE ET LES COULEURS

Balises de mise en forme <b> , <i>, <u>, <s>, <sub>, <sup> ...

Nous savons faire une page, maintenant nous allons y mettre un peu de contenu.

Dans notre page, entre les balises body, inscrivons le code suivant :

<b>texte en gras</b><br />
<i>texte italique</i><br />
<u>texte souligné</u><br />
<s>texte rayé</s>

A noter, que nous pouvons sans problème combiner les balises. Cependant, elles ne doivent jamais se chevaucher (<b><i> texte </b></i>) ne fonctionne pas !)

Ci dessous, voici l'équivalent des balises b et i, valides en XHTML :

<strong>texte en gras</strong><br />
<em>texte italique</em><br />

A noter, que nous pouvons sans problème combiner les balises. Cependant, elles ne doivent jamais se chevaucher (<b><i> texte </b></i>) ne fonctionne pas !)

<b><i><u> texte en gras italique et souligné</u></i></b>

Il est aussi possible de mettre le texte en exposant ou en indice :

<sub>indice</sub> normal <sup>exposant</sup>

Encore une balise de mise en forme, la balise de centrage. Il y a d'autre moyen de déterminer l'alignement d'un texte, nous verrons ça plus tard.

normal
<br />
<center>centre</center>

Balise police <font>

Nous allons maintenant agir à proprement parler sur la police de texte. Pour cela, nous utiliserons la balise <font>.

Cette balise peut (et doit) s'enrichir d'attributs spécifiques :

<font color="red" size="3" face="Arial">Cette balise peut (et doit)
s'enrichir d'attributs spécifiques</font>

Dans cet exemple, nous utilisons les trois attributs possibles de la balises font. Ces attributs sont optionnels, on peut utiliser les 3, ou 2 ou 1, voire aucun. Dans le cas de la balise font, ne pas utiliser d'attributs n'est pas très cohérent, puisque utilisée seule, la balise n'a aucune utilité. Cependant, sachez que les attributs d'une balise sont toujours optionnels !
De plus, les normes XHTML imposent l'utilisation des quotes pour la valeur des attributs. Il est donc fortement conseillé de les utiliser même si les attributs semblent s'en passer.

Attribut color :

Il existe deux façons de spécifier la couleur, la notation par dénomination (black, white, red, blue....), et la notation RGB hexadécimal (exemple : color="#000000"). cf ci-dessous.

Attribut face :

Détermine le style de police utilisé.
Attention, pour qu'une police soit correctement affichée chez l'internaute, il faut que la police en question soit installée sur le système de l'utilisateur. Si de nombreuses polices sont reconnues par les systèmes windows, les Mac en utilisent d'autres !
On se limitera donc aux polices suivantes, reconnues par la plupart des systèmes : Times new roman, Arial, Courier, Georgia, Verdana, Trebuchet.
Et même avec ces polices, il n'est pas certain que le rendu d'une page, soit identique selon le système, voire même selon le navigateur !!!
Il est cependant tout a fait possible de déterminer plusieurs polices dans la même balise (<font face="arial, times new roman">). Le navigateur affichera la première des polices qu'il reconnaît, et la police par défaut s'il n'en reconnaît aucune.

Attribut size :

Les tailles html, vont de 1 (la plus petite) à 7 (la plus grande). 3 est la taille par défaut :
Taille 7 Taille 6 Taille 5 Taille 4 Taille 3 Taille 2 Taille 1
Les tailles peuvent aussi être notée de façon relative, de -7 à +7. En l'état, size="+4" équivaut à size="7" (puisque par défaut la taille est 3, et 3+4=7 CQFD !). La notation relative des tailles aura son utilité plus tard, quand on utilisera des feuilles de style.

Les Couleurs

Pour indiquer une couleur, nous pouvons utiliser la terminologie suivante :

Il existe de nombreux autres termes de définitions de couleurs, mais leur affichage est parfois douteux. De toute manière, cette façon de définir les couleurs est de moins en moins utilisée.

En effet, pour parler couleur on préfère utiliser les couleurs RGB au format hexadécimal, c'est à dire, de cette façon : #RRGGBB.

RR représente la valeur de rouge au format hexadécimal à deux caractères (rappel : les unités du système hexadécimal sont 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F). Il existe donc (16x16=) 256 valeurs possibles pour le rouge.

GG représente la valeur de vert. A nouveau, on a 256 valeurs possibles pour le vert.

BB représente le bleu. Ici encore, on a 256 valeurs différentes.

Au total, le système #RRGGBB définit (256x256x256=) 16.777.216 couleurs.

Cependant, ces 16 millions de couleurs ne sont pas toutes "sécurisée web". En effet, la norme HTML, ne recommande que l'emploi de 216 couleurs. Ces couleurs sont dites "sécurisées web" ou "couleurs web".Ces couleurs doivent (théoriquement !) être identiques sur tous les navigateurs. Pour les autres couleurs, cette garantie ne s'applique pas.
Utiliser une couleur non sécurisée c'est prendre le risque de ne pas être affiché comme on le souhaite.

Les couleurs web sont :

Utiliser une couleur non web est toujours possible. Généralement cela ne pose pas de problème, les navigateurs étant, sur ce sujet, plutôt concordants. Mais il y a toujours un risque. A vous de voir si vous souhaitez le prendre...

Récapitulatif