15. Color

 

Índex | Tema 14 | Tema 16

Especificació dels colors

Totes les representacions gràfiques - lletres i imatges - que apareixen en la pantalla d'un monitor són constituïts de punts molt petits, constituïts, al seu torn, de tres punts, un de vermell, un de verd i un de blau. Aquest procediment, anomenat mescla additiva, permet obtenir els diferents colors. Les intensitats de cada component es mesuren amb una escala relativa que va del 0 al 255.

Els valors d'aquestes intensitats s'expressen habitualment mitjançant un conjunt de dos dígits en el format hexadecimal. En aquest sistema de numeració es fan servir els números ordinaris, del 0 al 9, i les primeres lletres de l'abecedari, amb els valors següents: a=10, b=11, c=12, d=13, e=14 i f=15. La correspondència entre la numeració hexadecimal i la decimal o ordinària és donada per la fórmula següent:

decimal = primera xifra hexadecimal x 16 + segona xifra hexadecimal

La intensitat màxima és ff, que correspon a 15x16+15=255 en decimal, i la nul·la és 00, que equival a 0 en decimal.

En HTML qualsevol color queda definit per la juxtaposició del símbol # i tres grups de dos dígits cada un, corresponents als components vermell, verd i blau.

El vermell és doncs #ff0000, el verd #00ff00 i el blau #0000ff. El blanc, reunió de tots els colors, és ffffff, i el negre, absència de llum, és #000000. Combinant els 256 graus del vermell, els 256 del verd i els 256 del blau obtenim un conjunt de 16.777.216 colors diferents.

Els colors més propers a l'arc iris i similars (anomenats tècnicament de màxima saturació) s'obtenen amb composicions en què almenys un terme és ff i l'altre 00. Queden exemplificats en el gràfic següent:

En l'extrem oposat tenim l'escala de grisos, caracteritzada pel fet que els tres valors són iguals, del #ffffff al #000000:

Podem considerar que qualsevol altre color resulta de la mescla en proporcions diverses d'un color saturat i d'un gris. Aquesta operació té dos casos extrems: la pèrdua de saturació cap al blanc i la pèrdua de lluminositat cap al negre.

Pèrdua gradual de saturació, del #00a0ff cap al blanc, #ffffff:

I pèrdua de lluminositat, del #ffc000 cap al negre, #000000:

Amb l'eina que ve a continuació es pot ajustar l'expressió de qualsevol color:

Eina per a l'ajustament dels colors

 

Ús de termes anglesos

L'HTML accepta també l'ús de determinats termes anglesos, com ara red (en lloc de #ff0000), blue (en lloc de #0000ff), white (en lloc de #ffffff), black (en lloc de #000000), etc.

El repertori complet dels termes emprats es troba en l'exemple següent:

Exemple

 

Aplicació de color a la lletra

El color de la lletra es fixa amb l'atribut color, aplicat a BODY, a DIV o a qualsevol element que pugui contenir text:

Exemple

L'etiqueta desaconsellada <font> accepta l'atribut color, que es pot acumular, si cal, als de tipus de lletra i de gruix).

 

Color de les àncores

En absència d'especificació en contra, els navegadors assignen un color diferent a les àncores no visitades, a les visitades fa poc (a condició que quedi una còpia del document a la memòria cau) i a les actives (les que s'executen en aquest moment).

Per a l'especificació d'aquests colors es fan servir els anomenats pseudo-elements d'A:

Els termes a:link, a:visited i a:active corresponen, respectivament, als enllaços no visitats, als visitats i als actius. L'ús de la variant a:hover aconsegueix un canvi de color en posar el cursor damunt l'enllaç.

Exemple

Sense recórrer als fulls d'estil es podia fer l'especificació:

 

Color de fons

S'estableix amb l'especificació

Aquesta especificació es pot aplicar a BODY, a DIV, a H1, a P, a BLOCKQUOTE, etc.

També es pot donar color de fons a HR, a condició que tingui un gruix especificat.

Exemple

Sense recórrer als fulls d'estil, es pot fer servir

Però l'ús d'aquest atribut avui queda circumscrit a TD i TH en versió Transitional.

 

Imatge de fons

També és possible d'inserir una imatge com a fons d'un element; cal notar que aquesta imatge no forma part del document, que només en conté la referència:

Una especificació complementària permet determinar si la imatge s'hi aplica una sola vegada o si es repeteix:

(per defecte, repeat).

Una altra especificació permet determinar si la imatge de fons es desplaça conjuntament amb el contingut del document o si queda fix:

(per defecte, scroll).

Exemple

Sense fer servir fulles d'estil,

 

 

Teoria del color aplicada
a la informàtica

 
Podeu aprofundir en la interrelació entre els aspectes físics, fisiològics i psicològics del color, la seva obtenció mitjançant mescles additives i els aspectes quantitatius que s'hi relacionen a Teoria del color aplicada a la informàtica, manual d'aquesta mateixa col·lecció.