Dans le langage HTML (comme dans plusieurs autres), les codes pour générer des couleurs sont exprimés en système de représentation hexadécimal, c'est-à-dire en base 16 (de 0 à 9, puis A, B, C, D, E et F). Pourquoi? 16 = 2 fois 2 fois 2 fois 2. Électronique égale binaire!
En ce qui nous concerne (le HTML), il y a trois spectres de couleurs : dans l'ordre, rouge, vert et bleu. Et il y a 256 intensités possibles pour chaque spectre. 256, c'est 16 fois 16, donc "F fois F"! 00 (zéro et zéro) est l'absence de couleur d'un spectre, et FF (F et F) est la plus grande intensité d'une couleur. L'intensité "médiane" est 80 (huit et zéro) : 8 fois 16 plus 0, 128. Une intensité moyenne des trois spectres, 80 rouge, 80 vert et 80 bleu, 808080, donne bien sûr le gris, couleur neutre par excellence. Donc, 000000 représente le noir, et FFFFFF représente le blanc... Simple, non?
Les couleurs en informatique sont exprimées en "codes hexadécimaux" ou "RGB", (Red, Green, Blue, en francais RVB Rouge, Vert, Bleu). Pour coder la couleur d'un pixel on utilise trois octets qui définissent chacun la luminosité des couleurs Rouge Verte Bleu ; on utilise un nombre hexadecimal à 6 chiffres : les 2 premiers correspondent à la luminosité du rouge, les 2 suivants à la luminosité du vert et les 2 derniers à la luminosité bleu (ex : avec une intensité maximale sur le rouge on a #FF0000)...
En RGB la couleur est aussi définit en fonction du "mélange" de trois couleur de base : Rouge, Green, Blue. Chacunes de ces trois couleurs de bases se "découpent en valeurs allant de "0" à "255". "0" étant le NOIRE" et "255" le blanc. Chaque couleur sera donc définit avec le mélange de trois valeurs de "0" à "255", expl :
"255 0 0" = ROUGE - "0 0 0" = NOIRE - "255 255 255" = BLANC - "153 153 153" = GRIS...
En hexadécimal là aussi les couleurs sont divisées en groupe de trois fois deux "valeurs hexadécimal" par couleurs : #FFFFFF = (#) FF FF FF = BLANC.
Selon le contexte et les protocoles utilisés dans un projet, (HTML, XHTML, libérie GD en PHP...), on préferera utiliser des valeurs de couleurs exprimées en "RGB" ou en "HEXADECIMAL".
Variante 2 : Le système RGB
Les langages CSS, VRML, kturtle, et plusieurs autres utilisent cette variante.
Les couleurs RGB sont définies par leur décomposition en 3 couleurs primaires qui sont rouge (Red), vert (Green) et bleu (Blue) : c'est le système RGB.
Toute couleur est alors définie par 3 nombres (entre 0 et 255) qui définissent chacun la quantité de la couleur primaire correspondante qui doit intervenir.
Ainsi, la couleur rouge est définie en utilisant les composantes 255,0,0.
C'est à dire 255 unités de rouge, 0 unité de vert et 0 unité de bleu.
La notation RGBa introduit la notion de transparence dans les valeurs associées à une couleur.
Cette composante de la couleur permet de jouer sur les effets d'opacité entre les différentes couches d'éléments HTML.
La valeur a est une valeur variant de 0 à 1.
Le langage CSS3, utilise cette notation:
Exemple :
div {
background-color: rgba(0, 0, 255, 0.7);
}
div {
background-color: rgba(0, 0, 255, 0.2);
}
Ajoutez une page à votre portfolio en affichant l'assistant HTML ainsi que la directive 73033
Cliquez le bouton PALETTE DES COULEURS de la barre de boutons
Inscrivez dans le champ titre : Bases 03 : Les couleurs en informatique
Sélectionnez la section : MODULE 2D-Autres
Sélectionnez la matière : informatique
Inscrivez dans le champ no de la directive : 73033
Inscrivez dans votre page le titre de niveau 1 : Bases 03 : Les couleurs en informatique
Ajoutez un TABLEAU html de 6 rangées x 3 colonnes
Inscrivez dans les 3 cellules de la première rangée, les mots suivants NOMS DE COULEURS, VALEUR HÉXADÉCIMALE et VALEUR RGB
Inscrivez dans la première cellule de chacune des rangées le nom de 5 couleurs html de votre choix
Ajoutez dans les cellules 2 de chacune des rangées, le code HEXADÉCIMAL de chacune des couleurs.
Ajoutez dans les cellules 3 de chacune des rangées, le code RGB de chacune des couleurs.
Utilisez ensuite la méthode intraligne du langage CSS pour chacune des lignes du tableau (balise TR), afin que la ligne s'affiche de la couleur indiquée.
exemple :
<tr style="color:#00008B;"> ...</tr>
Visualisez votre page et apportez des modifications au besoin.
