La presente lezione tratta la scelta del colore,
delle dimensioni e del tipo di carattere del testo attraverso
l’utilizzo del tag "font". Si tratta di un
argomento obsoleto, perché la formattazione del testo in tutti
i siti moderni viene attribuita attraverso i fogli di stile.
L’utilizzo del tag <font> inoltre è
disapprovato dal W3C, e dunque sta cadendo in disuso. In ogni caso si
tratta di un argomento che un buon webmaster non può ignorare:
come già detto per studiare i fogli di stile ci sarà
tempo, e comunque è un passo che viene dopo la conoscenza
dell’HTML.
Il tipo di carattere (cioè il "font")
che il browser visualizza di default è il "Times".
Purtroppo questo carattere (ottimo per la carta
stampata) non è adatto a essere visualizzato sul monitor di un
computer: è una questione di "grazie" (le grazie
sono quegli abbellimenti tipografici delle lettere, che dovrebbero
servire per rendere più leggibile il carattere).
Dal momento che i caratteri con grazie non ottengono
il risultato voluto sul monitor (quello cioè di rendere le
lettere maggiormente riconoscibili e di conseguenza il testo più
leggibile), ma anzi ottengono l’effetto contrario, si
preferisce di solito utilizzare dei caratteri senza grazie come il
"Verdana", l’"Arial" o l’"Helvetica" (si veda l'articolo I font e la tipografia del testo).
Per scegliere il tipo di carattere con cui un font
deve essere visualizzato è sufficiente usare la sintassi:
<font face="Arial">testo in
Arial</font>
|
testo in Arial
|
<font face="Verdana">testo
in Verdana</font>
|
testo in Verdana
|
<font face="Geneva">testo in
Geneva</font>
|
testo in Geneva
|
|
Tuttavia è bene sottolineare da subito che non
è possibile far sì che l’utente visualizzi un
testo in un carattere fantasioso scelto da noi. Allo stato attuale
dell’arte l’utente che naviga in internet può
visualizzare solo i caratteri che sono installati nel suo sistema: in
Windows si tratta dei caratteri presenti in: Pannello di controllo > Tipi di caratteri.
Se ad esempio scarichiamo da http://font.html.it
il carattere Hackers, lo scompattiamo e lo
inseriamo nella cartella dei caratteri, saremo poi in grado di
visualizzare sul nostro computer il testo in Hackers.
Ma quando metteremo il nostro sito nel web gli utenti
visualizzeranno un semplicissimo Times. Come nell’esempio sotto
indicato:
<font
face="hackers">testo
in hackers</font>
|
testo in hackers
|
|
Per questo motivo è bene tener conto di due
accorgimenti:
scegliere caratteri "sicuri" , che
siano cioè senz’altro presenti sul pc dell’utente
non indicare un solo carattere, ma una serie di
caratteri che gradualmente si allontanano dal risultato che vorremmo
ottenere, ma non di molto, fino ad indicare la famiglia a cui il
nostra carattere appartiene. In questo modo il browser dell’utente
cercherà di trovare nella propria cartella dei fonts il primo
carattere indicato, se non lo trova passerà al secondo, e
solo come ultima spiaggia sceglierà si utilizzare il
carattere predefinito (il famigerato "Times")
Vediamo alcuni esempi di famiglie "sicure"
di caratteri:
<font face="Verdana, Arial, Helvetica,
sans-serif">Verdana e caratteri simili</font><br>
<font face="Arial, Helvetica,
sans-serif">Arial e caratteri simili</font><br>
<font face="Times New Roman, Times,
serif">Times e caratteri simili</font> <br>
<font face="Courier New, Courier,
mono">Curier e caratteri simili</font><br>
<font face="Georgia, Times New Roman,
Times, serif">Georgia e caratteri simili </font>
<br>
<font face="Geneva, Arial, Helvetica,
sans-serif">Geneva e caratteri simili</font>
|
Verdana e caratteri simili
Arial e caratteri simili
Times e caratteri simili
Curier e caratteri simili
Georgia e caratteri simili
Geneva e caratteri simili
|
|
È vero: l’impossibilità di
scegliere i caratteri che preferiamo limita terribilmente le nostre
possibilità espressive, ma il bello di sviluppare per il web è
proprio accettare di creare con delle regole ben definite, e a volte
anche molto vincolanti.
Per i titoli delle pagine, i menu, e quant’altro
potremmo poi sempre utilizzare delle immagini con il nostro carattere
tipografico preferito (ad esempio delle "gif").