I colori in html

Ci siamo già imbattuti nell'argomento colori almeno due volte: quando abbiamo parlato dei colori di sfondo e dei link del BODY della pagina html, e poco fa quando abbiamo parlato del FONT.

Riferendoci a quest'ultimo esempio si è visto come i colori dei fonts possano essere inseriti a parole (ovviamente in inglese), riporto di seguito la stringa appena citata per comodità di consultazione:

<font face="Courier New" size=3 color="black">...il tuo testo...</font>

Tolti, comunque, quelli che vengono immediatamente in mente ai più (i classici black, white, green, yellow, red, blue, ...) ci si rende presto conto di quanto limitativo sia esprimere una tonalità di colore in questa maniera.

Esiste fortunatamente un altro modo, se vogliamo più professionale, per indicare al browser quale colore usare per visualizzare un carattere o uno sfondo: lo si deve inserire in codice "esadecimale".

Non allarmatevi, esistono programmi che sputano fuori il codice esadecimale con un semplice clic, ma se ci tenete a sapere cosa significa 'sto parolone, ecco la spiegazione: il monitor, o meglio la scheda video, percepisce le tonalità di colore in funzione di una specie di codice chiamato RGB.

Questa sigla sta per Red Green Blu ed identifica un codice alfanumerico che differisce da quello numerico che usiamo convenzionalmente perchè la numerazione non si ferma a dieci (codice decimale 1-2-3...-0), ma prosegue con le prime sei lettere alfabetiche (esadecimale ...-8-9-0-A-B-C-D-E-F) per cui a parità di caratteri disponibili si ottengono valori ben più variabili, proprio come le targhe automobilistiche.

Nell'esempio precedente per indicare come colore il nero, in esadecimale, avremmo dovuto scrivere:

<font face="Courier New" size=3 color="#000000">...il tuo testo...</font>

Come si vede ho messo sei zeri per indicare il nero. Questo perchè i colori vanno inseriti utilizzando il segno # seguito da tre coppie di valori esadecimali, strettamente nella sequenza Red Green Blu.

Ho capito, facciamo un esempio: se io avessi voluto un testo blu avrei scritto:

<font face="Courier New" size=3 color="#0000FF">...il tuo testo...</font>

e questo perchè ho dato zero sia al gradiente rosso che a quello verde, mentre ho messo FF (il massimo) per il blu, e se lo avessi voluto in rosso? Ovviamente sarebbe stato così:

<font face="Courier New" size=3 color="#FF0000">...il tuo testo...</font>

Si devono conoscere tutti i codici a memoria?? ...ovviamente no. Quasi tutti i programmi di grafica shareware reperibili sul web, in virtù dell'esponenziale diffusione di Internet, sono stati dotati di tale funzione: il Paint Shop Pro della Jasc ne è un ottimo esempio.

Il loro uso è semplicissimo: si clicca su un colore e il programma elabora il codice pronto per essere incollato nella sorgente. Ce ne sono, addirittura, alcuni utilizzabili anche on line basati su JavaScript, clicca qui per un esempio.