Sommario
Quando il testo di un documento deve essere mostrato visivamente, i caratteri (elementi di informazione astratti) devono essere correlati con glifi astratti [glyph, rappresentazione grafica di un carattere o "glifo"]. Uno o più caratteri possono essere rappresentati da uno o più glifi astratti, in un modo possibilmente dipendente dal contesto. Un glifo è l'effettiva rappresentazione artistica di un glifo astratto, in un qualche stile tipografico, nella forma di contorni o bitmap che possono essere tracciati sullo schermo o sulla carta. Un font è un insieme di glifi, tutti osservanti il medesimo motivo di base secondo il disegno, le dimensioni, l'aspetto, ed altri attributi associati con l'intero insieme, ed una correlazione fra caratteri e glifi astratti.
Un programma utente visuale deve soffermarsi sui seguenti problemi prima di rendere effettivamente un carattere:
Sia nei CSS1 che nei CSS2, gli autori specificano le caratteristiche dei font tramite una serie di proprietà dei font.
Il modo in cui il programma utente gestisce queste proprietà, quando non vi è corrispondenza di font sul pc dell'utente, è stato ampliato dai CSS1 ai CSS2. Nei CSS1, si presupponeva che tutti i font fossero presenti sul sistema dell'utente e venivano identificati solamente per nome. Font alternativi potevano essere specificati attraverso le proprietà ma, al di là di questo, i programmi utente non avevano alcun modo di proporre altri font all'utente (anche font stilisticamente simili che il programma utente aveva a disposizione) eccetto font generici predefiniti.
I CSS2 hanno cambiato tutto questo, permettendo molta più libertà per:
I CSS2 migliorano la corrispondenza di font lato client [client-side], abilitano la sintesi di font e la resa progressiva, e fanno in modo che i font possano essere scaricati dal Web. A queste capacità avanzate ci riferiamo come 'WebFonts'.
Nel modello font dei CSS2, come nei CSS1, ciascun programma utente ha un "database di font" a sua disposizione. I CSS1 facevano riferimento a questo database ma non davano dettagli sul suo contenuto. I CSS2 definiscono le informazioni presenti in quel database e permettono ai fogli di stile degli autori di contribuirvi. Quando riceve la richiesta di visualizzare un carattere con un particolare font, il programma utente come prima cosa identifica il font nel database che "meglio si adatta" al font specificato (secondo l'algoritmo di corrispondenza dei font). Una volta identificato un font, recupera i dati del font localmente o dal Web, e può visualizzare il carattere usando quei glifi.
Alla luce di questo modello, abbiamo organizzato questo capitolo delle specifiche in due sezioni. La prima riguarda il meccanismo per specificare i font, ossia come gli autori specificano quali font vorrebbero usare. La seconda riguarda il meccanismo per selezionare i font, ossia come il programma utente del client identifica e carica un font che meglio si adatta alle specifiche dell'autore.
Il modo con cui il programma utente costruisce il database dei font va oltre l'àmbito di queste specifiche, poichè l'implementazione del database dipende da fattori quali il sistema operativo, il sistema di organizzazione a finestre, e il client.
La prima fase del meccanismo dei font dei CSS riguarda il modo in cui i fogli di stile degli autori specificano quali font dovrebbero essere usati da un programma utente. Sembra da subito che un'ovvia modalità per specificare un font sia quella di specificarlo per nome, con una singola stringa - che appare separata in due parti distinte; per esempio "BT Swiss 721 Heavy Italic".
Sfortunatamente non esiste una tassonomia di classificazione dei font in base al nome che sia ben definita ed universalmente accettata, e i termini che si applicano ad un nome di famiglia di font possono non essere appropriati per altri. Per esempio, il termine 'italic' è comunemente usato per classificare il testo inclinato, ma il testo inclinato può anche essere classificato come Oblique, Slanted, Incline, Cursive, oppure Kursiv. Similmente, i nomi dei font contengono di solito termini che descrivono il "peso" di un font. Il ruolo principale di questi nomi è quello di distinguere tipi [face, termine tipografico] di diversa gradazione scura [darkness. letteralmente "tonalità scura"] all'interno di una singola famiglia di font. Non vi è un un significato universalmente accettato per queste denominazioni di peso e il loro impiego varia ampiamente. Per esempio un font che voi pensate sia grassetto [bold anche "neretto"] potrebbe essere descritto come Regular, Roman, Book, Medium, Semi- o Demi-Bold, Bold, o Black, a seconda di quanto sia scuro il tipo "normale" del font all'interno del disegno.
Questa mancanza di una nomenclatura sistematica rende impossibile, nei casi generali, creare un nome di tipo di un font che sia modificato e che si distingua in modo peculiare, ad esempio come più scuro.
Per questi motivi, i CSS usano un modello differente. I font vengono richiamati non attraverso un singolo nome di font, ma impostando una serie di proprietà dei font. Questi valori di proprietà costituiscono la base del meccanismo di selezione dei font usato dal programma utente. Le proprietà dei font possono essere modificate singolarmente, per esempio aumentando il peso del carattere, e il nuovo insieme di valori della proprietà del font verrà quindi usato per operare una nuova selezione dal database dei font. Il risultato è un aumento di regolarità per i fogli di stile degli autori e degli sviluppatori, e un aumento di robustezza.
I CSS2 specificano i font secondo queste caratteristiche:
Per tutte le proprietà eccetto 'font-size', i valori di lunghezza 'em' e 'ex' si riferiscono alla dimensione del font dell'elemento corrente. Per 'font-size', queste unità di lunghezza si riferiscono alla dimensione del font dell'elemento genitore. Si prega di consultare la sezione sulle unità di lunghezza per maggiori informazioni.
Le proprietà CSS dei font sono usate per descrivere l'aspetto desiderato del testo nel documento. I descrittori dei font, di contro, sono usati per descrivere le caratteristiche dei font, così da poter scegliere un font adatto per creare la presentazione desiderata. Per informazioni sulla classificazione dei font, si prega di consultare la sezione sui descrittori dei font.
| Valore: | [[ <family-name> | <generic-family> ],]* [<family-name> | <generic-family>] | inherit |
| Iniziale: | dipende dal programma utente |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | N/A |
| Media: | visuale |
Questa proprietà specifica un elenco prioritario di nomi di famiglia dei font e/o nomi di famiglia generica. Per affrontare il problema che un singolo font può non contenere i glifi per visualizzare tutti i caratteri in un documento, o che non tutti i font sono disponibili su tutti i sistemi, questa proprietà permette agli autori di specificare un elenco di font, tutti del medesimo stile e dimensione, che vengono provati in sequenza per vedere se contengono un glifo per un determinato carattere. Questo elenco è chiamato insieme di font.
Per esempio, un testo che contiene parole inglesi mischiate con simboli matematici può aver bisogno di un insieme di font di due font, uno contenente lettere latine e cifre, l'altro contenente simboli matematici. Ecco un esempio di insieme di font adatto per un testo che si suppone che contenga caratteri latini, caratteri giapponesi, e simboli matematici:
BODY { font-family: Baskerville, "Heisi Mincho W3", Symbol, serif }
I glifi disponibili nel font "Baskerville" (un font che copre solo i caratteri latini) saranno presi da questo font, i glifi giapponesi saranno presi da "Heisi Mincho W3" e i glifi dei simboli matematici verranno da "Symbol". Tutti gli altri verranno dalla famiglia generica di font 'serif'.
La famiglia generica di font verrà usata se uno o più degli altri font in un insieme di font non è disponibile. Sebbene molti font forniscano il glifo per il "carattere mancante", di solito un riquadro vuoto, la famiglia generica, come suggerisce il suo nome, non dovrebbe essere considerata come una corrispondenza tranne per l'ultimo font in un insieme di font.
Ci sono due tipi di nomi di famiglia dei font:
Si incoraggiano gli autori ad offrire una famiglia generica di font come ultima alternativa, per una migliorata robustezza.
Per esempio:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>Font test</TITLE>
<STYLE type="text/css">
BODY { font-family: "new century schoolbook", serif }
</STYLE>
</HEAD>
<BODY>
<H1 style="font-family: 'My own font', fantasy">Test</H1>
<P>What's up, Doc?
</BODY>
</HTML>
Il selettore del sintassi CSS2 più ricco può essere usato per creare una tipografia sensibile alla lingua. Per esempio, alcuni caratteri cinesi e giapponesi sono unificati per avere il medesimo punto di codifica Unicode, sebbene i glifi astratti non siano gli stessi nelle due lingue.
*:lang(ja-jp) { font: 900 14pt/16pt "Heisei Mincho W9", serif }
*:lang(zh-tw) { font: 800 14pt/16.5pt "Li Sung", serif }
Questo seleziona ogni elemento che abbia il linguaggio dato - giapponese o cinese tradizionale - e richiede il font appropriato.
| Valore: | normal | italic | oblique | inherit |
| Iniziale: | normal |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | N/A |
| Media: | visuale |
La proprietà 'font-style' specifica tipi normali (a volte indicati come "romani" [roman] o "dritti" [upright]), italici, e obliqui all'interno di una famiglia di font. I valori hanno i seguenti significati:
In questo esempio, il testo normali negli elementi H1, H2, o H3 sarà visualizzato con un font italico. Tuttavia, il testo enfatizzato (EM) all'interno di un elemento H1 apparirà con un tipo normale.
H1, H2, H3 { font-style: italic }
H1 EM { font-style: normal }
| Valore: | normal | small-caps | inherit |
| Iniziale: | normal |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | N/A |
| Media: | visuale |
In un font maiuscoletto [small-caps], i glifi delle lettere minuscole appaiono simili a quelli delle maiuscole, ma con dimensione ridotta e con proporzioni molto differenti. La proprietà 'font-variant' specifica un tale font per le scritture bicamerali (che hanno due casi [cases, ossia che hanno lettere maiuscole e minuscole], come nella scrittura latina). Questa proprietà non ha alcun effetto visibile sulle scritture che sono unicamerali (che hanno un solo caso, come per la maggior parte dei sistemi di scrittura del mondo). I valori hanno i seguenti significati:
Il seguente esempio consiste in un elemento H3 in maiuscoletto, con parole enfatizzate (EM) in maiuscoletto obliquo:
H3 { font-variant: small-caps }
EM { font-style: oblique }
Nella misura in cui questa proprietà fa in modo che il testo sia trasformato in maiuscolo, si applicano le medesime osservazioni per 'text-transform'.
| Value: | normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit |
| Iniziale: | normal |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | N/A |
| Media: | visuale |
La proprietà 'font-weight' specifica il peso del font. I valori hanno i seguenti significati:
P { font-weight: normal } /* 400 */
H1 { font-weight: 700 } /* bold */
BODY { font-weight: 400 }
STRONG { font-weight: bolder } /* 500 if available */
Gli elementi figli ereditano il valore calcolato del peso.
| Valore: | normal | wider | narrower | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded | inherit |
| Iniziale: | normal |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | N/A |
| Media: | visuale |
La proprietà 'font-stretch' seleziona un tipo normale, condensato o esteso da una famiglia di font. I valori assoluti delle parole chiave hanno il seguente ordine, dal più stretto al più largo:
La parola chiave relativa 'wider' imposta il valore sul valore esteso successivo al di sopra del valore ereditato (non aumentandolo oltre 'ultra-expanded'); la parola chiave relativa 'narrower' imposta il valore sul valore condensato successivo al di sotto del valore ereditato (non diminuendolo oltre 'ultra-condensed').
| Valore: | <absolute-size> | <relative-size> | <length> | <percentage> | inherit |
| Iniziale: | medium |
| Si applica a: | tutti gli elementi |
| Ereditata: | si, il valore calcolato è ereditato |
| Percentuali: | in riferimento alla dimensione del font dell'elemento genitore |
| Media: | visuale |
Questa proprietà descrive la dimensione del font quando è impostato senza interlineatura [solid, anche "compatto"]. I valori hanno i seguenti significati:
[ xx-small | x-small | small | medium | large | x-large | xx-large ]
Su uno schermo di computer si suggerisce un fattore di misurazione in scala di 1.2 fra indici adiacenti; se il font 'medium' è 12pt, quello 'large' potrebbe essere 14.4pt. Media differenti possono aver bisogno di differenti fattori di misurazione in scala. Ancora: il programma utente dovrebbe prendere in considerazione la qualità è la disponibilità dei font quando calcola la tabella. La tabella può essere differente da una famiglia di font all'altra.
Nota. Nei CSS1, il fattore suggerito di misurazione in scala fra indici adiacenti era 1.5, che l'esperienza degli utenti dimostrò essere troppo ampio.
[ larger | smaller ]
Per esempio, se l'elemento genitore ha la dimensione del font su 'medium', un valore di 'larger' renderà la dimensione del font dell'elemento corrente 'large'. Se la dimensione dell'elemento genitore non è vicina ad una voce della tabella, il programma utente è libero di interpolare [interpolate, termine matematico] le voci della tabella o di arrotondare alla voce più vicina. Il programma utente può dover estrapolare i valori della tabella se il valore numerico va oltre le parole chiave.
Il valore effettivo di questa proprietà può differire dal valore calcolato a causa di un valore numerico per 'font-size-adjust' e della mancata disponibilità di determinate dimensioni dei font.
Gli elementi figli ereditano il valore calcolato di 'font-size' (altrimenti l'effetto di 'font-size-adjust' aumenterebbe).
P { font-size: 12pt; }
BLOCKQUOTE { font-size: larger }
EM { font-size: 150% }
EM { font-size: 1.5em }
| Valore: | <number> | none | inherit |
| Iniziale: | none |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | N/A |
| Media: | visuale |
Nelle scritture bicamerali [bicameral, ossia con caratteri maiuscoli e minuscoli], l'apparente dimensione soggettiva e la leggibilità di un font sono meno dipendenti dal loro valore 'font-size' che dal valore della loro 'x-height', o, più proficuamente, dal rapporto di questi due valori, chiamato valore di aspetto (dimensione del font divisa per altezza-x [x-height]). Più è alto il valore di aspetto, più è probabile che un font a piccole dimensioni sarà leggibile. Di contro, faccie con un valore di aspetto più basso diventeranno illegibili più rapidamente sotto una data dimensione di soglia rispetto a faccie con un valore di aspetto più alto. La semplice sostituzione di font basata solo sulla dimensione può portare a caratteri illegibili.
Per esempio, il popolare font Verdana ha un valore di aspetto di 0.58; quando la dimensione del font Verdana è di 100 unità, la sua altezza-x è di 58 unità. Come paragone, il Times New Roman ha un valore di aspetto di 0.46. Perciò il Verdana tenderà a rimanere leggibile a piccole dimensioni di quanto non faccia il Times New Roman. Di contro, il Verdana apparirà spesso 'troppo grande' se sostituito al Times New Roman ad una dimensione scelta.
Questa proprietà permette agli autori di specificare un valore di aspetto per un elemento che manterrà l'altezza-x del font della prima scelta nel font sostituto. I valori hanno i seguenti significati:
y(a/a') = c
dove:
y = 'font-size' del font della prima scelta a' = valore di aspetto del font disponibile c = 'font-size' da applicare al font disponibile
Per esempio, se un Verdana da 14px (con un valore di aspetto di 0.58) non fosse disponibile e il font disponibile avesse un valore di aspetto di 0.46, la dimensione del sostituto sarebbe 14 * (0.58/0.46) = 17.65px.
L'aggiustamento della dimensione del font ha luogo quando si calcola il valore effettivo di 'font-size'. Poichè l'eredità si basa sul valore effettivo, gli elementi figli erediteranno valori non aggiustati.
La prima immagine di sotto mostra diversi caratteri tipografici rasterizzati su una comune dimensione del font (11pt a 72 ppi), insieme con i loro valori di aspetto. Si noti che i tipi con valori di aspetto più alti appaiono più grandi di quelli con valori di aspetto più bassi. I tipi con valori di aspetto molto bassi sono illegibili nella dimensione mostrata.
L'immagine successiva mostra i risultati di 'font-size-adjust' dove il Verdana è stato preso come "prima scelta", unitamente al fattore di misurazione in scala applicato. Una volta aggiustate, le dimensioni apparenti sono quasi lineari fra i vari tipi, sebbene le dimensioni effettive (em) varino di oltre il 100%. Si noti altresì che 'font-size-adjust' tende a stabilizzare le metriche orizzontali delle righe.
| Valore: | [ [ <'font-style'> || <'font-variant'> || <'font-weight'> ]? <'font-size'> [ / <'line-height'> ]? <'font-family'> ] | caption | icon | menu | message-box | small-caption | status-bar | inherit |
| Iniziale: | si vedano le proprietà individuali |
| Si applica a: | tutti gli elementi |
| Ereditata: | si |
| Percentuali: | consentite per 'font-size' e 'line-height' |
| Media: | visuale |
La proprietà 'font' è, tranne per quello descritto più avanti, una proprietà stenografica [shorthand, o "abbreviata"] per impostare 'font-style', 'font-variant', 'font-weight', 'font-size', 'line-height', e 'font-family', nella medesima posizione nel foglio di stile. La sintassi di questa proprietà è basata su una notazione stenografica della tipografia tradizionale per impostare proprietà multiple relative ai font.
Tutte le proprietà relative ai font sono dapprima riportate ai loro valori iniziali, inclusi quelli elencati nel precedente paragrafo, più 'font-stretch' e 'font-size-adjust'. Poi queste proprietà, a cui sono stati dati valori espliciti nell'annotazione stenografica 'font', sono impostate su questi valori. Per una definizione dei valori permessi ed iniziali, si vedano le proprietà precedentemente definite. Per ragioni di compatibilità a ritroso [backwards, o "all'indietro"], non è possibile impostare 'font-stretch' e 'font-size-adjust' su altri valori diversi da quelli iniziali usando la proprietà stenografica 'font'; si impostino invece le proprietà individuali.
P { font: 12pt/14pt sans-serif }
P { font: 80% sans-serif }
P { font: x-large/110% "new century schoolbook", serif }
P { font: bold italic large Palatino, serif }
P { font: normal small-caps 120%/120% fantasy }
P { font: oblique 12pt "Helvetica Nue", serif; font-stretch: condensed }
Nella seconda regola, il valore percentuale della dimensione del font ('80%') si riferisce alla dimensione del font dell'elemento genitore. Nella terza regola, l'altezza di riga in percentuale ('110%') si riferisce alla dimensione del font dell'elemento stesso.
Le prime tre regole non specificano le proprietà 'font-variant' e 'font-weight' esplicitamente, sicchè queste proprietà ricevono i loro valori iniziali ('normal'). Si noti che il nome della famiglia di font "new century schoolbook", che contiene spazi, è racchiuso tra virgolette. La quarta regola imposta la proprietà 'font-weight' su 'bold', la proprietà 'font-style' su 'italic', ed imposta implicitamente 'font-variant' su 'normal'.
La quinta regola imposta la proprietà 'font-variant' ('small-caps'), la proprietà 'font-size' (120% della dimensione del font del genitore), la 'line-height' (120% della dimensione del font) e la proprietà 'font-family' ('fantasy'). Ne consegue che la parola chiave 'normal' si applica alle due rimanenti proprietà: 'font-style' e 'font-weight'.
La sesta regola imposta la proprietà 'font-style', 'font-size', e 'font-family', con le altre proprietà dei font impostate sui loro valori iniziali. Infine viene impostata 'font-stretch' su 'condensed' poichè questa proprietà non può essere impostata su quel valore usando la proprietà stenografica 'font'.
I seguenti valori si riferiscono a font di sistema:
I font di sistema possono essere impostati come un tutto unico, ossia la famiglia di font, la dimensione, il peso, lo stile ecc. sono impostati tutti allo stesso tempo. Questi valori possono poi essere modificati singolarmente se lo si desidera. Se non esiste alcun font con le caratteristiche indicate su una data piattaforma, il programma utente dovrebbe o sostituire in modo intelligente (per esempio una versione più piccola del font 'caption' potrebbe essere usata per il font 'smallcaption'), oppure usare il suo font predefinito. Come per i font regolari, se, per un font di sistema, ciascuna delle singole proprietà non fa parte delle preferenze disponibili sul sistema operativo dell'utente, allora queste proprietà dovrebbero essere impostate sui loro valori iniziali.
Ecco perchè questa proprietà è "quasi" una proprietà stenografica: i font di sistema possono essere specificati solo con questa proprietà, non con la stessa 'font-family', così 'font' consente agli autori di poter fare di più che non con la somma delle sue sotto-proprietà. Tuttavia, le proprietà individuali come 'font-weight' sono ancora valori dati presi dai font di sistema, che possono essere variati indipendentemente.
BUTTON { font: 300 italic 1.3em/1.7em "FB Armada", sans-serif }
BUTTON P { font: menu }
BUTTON P EM { font-weight: bolder }
Se il font usato per i menu a discesa su un particolare sistema fosse, per esempio, Charcoal da 9pt, con un peso di 600, allora gli elementi P discendenti di BUTTON verrebbero visualizzati come se in effetti questa regola fosse:
BUTTON P { font: 600 9pt Charcoal }
Poichè la proprietà stenografica 'font' riporta al suo valore iniziale ogni proprietà cui non sia stato dato un valore esplicito, la regola di cui sopra ha lo stesso effetto di questa dichiarazione:
BUTTON P {
font-style: normal;
font-variant: normal;
font-weight: 600;
font-size: 9pt;
line-height: normal;
font-family: Charcoal
}
Le famiglie generiche di font sono un meccanismo di ripiego, nel senso che preservano l'intenzione del foglio di stile dell'autore nel caso peggiore in cui nessuno dei font specificati può essere selezionato. Per un controllo tipografico ottimale, font particolari denominati dovrebbero essere usati nei fogli di stile.
Si stabilisce che le cinque famiglie generiche di font esistono in tutte le implementazioni CSS (non c'è bisogno di correlarli necessariamente a cinque distinti font effettivi). I programmi utente dovrebbero fornire ragionevoli scelte predefinite per le famiglie generiche di font, che esprimano il più possibile le caratteristiche di ogni famiglia entro i limiti concessi dalla loro tecnologia.
I programmi utente sono incoraggiati a consentire agli utenti di effettuare scelte alternative per i font generici.
I glifi dei font serif [serif, con grazie], come il termine è usato nei CSS, hanno tratti terminali, estremità allargate o affusolate, oppure effettive terminazioni con grazie (incluse grazie a lastroni). I font serif sono di solito spaziati in modo proporzionato. Mostrano spesso una grande variazione fra tratti sottili e spessi rispetto ai font della famiglia generica 'sans-serif.' I CSS usano il termine 'serif' per applicarlo a font di ogni tipo di scrittura, sebbene altri nomi possono essere più familiari per particolari tipi di scrittura come Mincho (giapponese), Sung o Song (cinese), Totum o Kodig (coreano). Ogni font così descritto può essere usato per rappresentare la famiglia generica 'serif'.
Esempi di font che soddisfano questa descrizione includono:
| Font latini | Times New Roman, Bodoni, Garamond, Minion Web, ITC Stone Serif, MS Georgia, Bitstream Cyberbit |
| Font greci | Bitstream Cyberbit |
| Font cirillici | Adobe Minion Cyrillic, Excelcior Cyrillic Upright, Monotype Albion 70, Bitstream Cyberbit, ER Bukinst |
| Font ebraici | New Peninim, Raanana, Bitstream Cyberbit |
| Font giapponesi | Ryumin Light-KL, Kyokasho ICA, Futo Min A101 |
| Font arabi | Bitstream Cyberbit |
| Font cherokee | Lo Cicero Cherokee |
I glifi nei font sans-serif [sans-serif, senza grazie], come il termine è usato nei CSS, hanno tratti terminali diritti -- privi di qualsiasi tratto allargato o obliquo, o di altro ornamento. I font sans-serif sono di solito spaziati in modo proporzionato. Hanno spesso una variazione ridotta fra tratti spessi e sottili, paragonati ai font della famiglia 'serif'. I CSS usano il termine 'sans-serif' per applicarlo a font di ogni tipo di scrittura, sebbene altri nomi possano essere più familiari per particolari tipi di scrittura, come Gothic (giapponese), Kai (cinese), o Pathang (coreano). Ogni font così descritto può essere usato per rappresentare la famiglia generica 'sans-serif'.
Esempi di font che soddisfano questa descrizione includono:
| Font latini | MS Trebuchet, ITC Avant Garde Gothic, MS Arial, MS Verdana, Univers, Futura, ITC Stone Sans, Gill Sans, Akzidenz Grotesk, Helvetica |
| Font greci | Attika, Typiko New Era, MS Tahoma, Monotype Gill Sans 571, Helvetica Greek |
| Font cirillici | Helvetica Cyrillic, ER Univers, Lucida Sans Unicode, Bastion |
| Font ebraici | Arial Hebrew, MS Tahoma |
| Font giapponesi | Shin Go, Heisei Kaku Gothic W5 |
| Font arabi | MS Tahoma |
I glifi nei font cursive [cursive, corsivo], come il termine è usato nei CSS, generalmente hanno sia tratti di congiunzione che altre caratteristiche corsive oltre a quelle dei caratteri italici. I glifi sono in parte o completamente uniti, e il risultato appare più simile al tratto di penna o alla scrittura stesa a mano che non alla tipografia stampata. I font per alcuni tipi di scrittura, come l'arabo, sono quasi sempre corsivi. I CSS usano il termine 'cursive' per applicarlo a font di ogni tipo di scrittura, sebbene altri nomi come Chancery, Brush, Swing e Script siano anche usati nei nomi di font.
Esempi di font che soddisfano questa descrizione includono:
| Font latini | Caflisch Script, Adobe Poetica, Sanvito, Ex Ponto, Snell Roundhand, Zapf-Chancery |
| Font cirillici | ER Architekt |
| Font ebraici | Corsiva |
| Font arabi | DecoType Naskh, Monotype Urdu 507 |
I font fantasy [fantasy, fantasia], come vengono usati nei CSS, sono soprattutto decorativi sebbene contengano ancora rappresentazioni dei caratteri (in opposizione ai Pi o Picture [picture, dipinto] font, che non rappresentano caratteri). Gli esempi includono:
| Font latini | Alpha Geometrique, Critter, Cottonwood, FB Reactor, Studz |
Il solo criterio per un font monospace [monospace, monospazio] è che tutti i glifi hanno la stessa larghezza fissa. (Questo può rendere alcuni tipi di scrittura, come l'arabo, ancora più peculiari.) L'effetto è simile a quello che si ottiene con una macchina da scrivere manuale, ed è spesso usato per gli esempi di codice di computer.
Esempi di font che soddisfano questa descrizione includono:
| Font latini | Courier, MS Courier New, Prestige, Everson Mono |
| Font greci | MS Courier New, Everson Mono |
| Font cirillici | ER Kurier, Everson Mono |
| Font giapponesi | Osaka Monospaced |
| Font cherokee | Everson Mono |
La seconda fase del meccanismo dei font dei CSS2 riguarda la sezione da parte del programma utente di un font basato sulle proprietà dei font specificate dall'autore, sui font disponibili, ecc. I dettagli dell'algoritmo di corrispondenza dei font sono forniti più avanti.
Ci sono quattro azioni possibili per la selezione di un font: corrispondenza del nome, corrispondenza intelligente, sintesi e download [download, scaricamento].
La resa progressiva è una combinazione del download e di uno degli altri metodi; fornisce un font sostituto temporaneo (usando la corrispondenza del nome, la corrispondenza intelligente o la sintesi) per consentire di leggere il contenuto mentre il font richiesto viene scaricato. Una volta che il font vero e proprio è stato scaricato con successo, sostituisce il font temporaneo, si spera senza bisogno di risistemare il flusso del documento.
Nota. La resa progressiva richiede informazioni metriche sul font per evitare la re-impaginazione del contenuto quando il font vero e proprio è stato caricato e reso. Queste informazioni metriche sono sufficientemente prolisse, e dovrebbero essere specificate al massimo una volta per font nel documento.
La descrizione dei font fornisce il collegamento fra la specifica di un font dell'autore e i dati dei font, che sono i dati necessari a formattare il testo e a rendere i glifi astratti a cui i caratteri sono correlati - i contorni effettivi scalari o bitmap. I font vengono presi come riferimento dalle proprietà del foglio di stile.
La descrizione dei font è aggiunta al database dei font e quindi usata per selezionare i dati dei font rilevanti. La descrizione dei font contiene descrittori quali la localizzazione dei dati dei font sul Web, e le caratterizzazioni di questi dati dei font. I descrittori dei font sono anche richiesti per far corrispondere le proprietà dei font del foglio di stile a particolari dati dei font. Il livello di dettaglio di una descrizione dei font può variare dal nome del font fino all'elenco delle larghezze dei glifi.
I descrittori dei font possono essere classificati in tre tipi:
Tutte le descrizioni dei font sono specificate tramite una regola-a [at-rule] @font-face. La forma generale è:
@font-face { <font-description> }
dove <font-description> ha la forma:
descriptor: value; descriptor: value; [...] descriptor: value;
Ogni regola @font-face specifica un valore per ogni descrittore dei font, implicitamente o esplicitamente. Quei valori non assegnati in modo esplicito nella regola assumono il valore iniziale elencato con ogni descrittore in queste specifiche. Questi descrittori si applicano solo all'interno del contesto delle regola @font-face in cui sono definiti, e no si applicano agli elementi del linguaggio del documento. Così, non vi è nozione sugli elementi ai quali si applicano i descrittori, o se i valori vengono ereditati dagli elementi figli.
I descrittori dei font disponibili sono illustrati nelle sezioni successive di questo capitolo delle specifiche.
Per esempio, qui il font 'Robson Celtic' è definito e posto come riferimento in un foglio di stile contenuto in un documento HTML.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>Font test</TITLE>
<STYLE TYPE="text/css" MEDIA="screen, print">
@font-face {
font-family: "Robson Celtic";
src: url("http://site/fonts/rob-celt")
}
H1 { font-family: "Robson Celtic", serif }
</STYLE>
</HEAD>
<BODY>
<H1> This heading is displayed using Robson Celtic</H1>
</BODY>
</HTML>
Il foglio di stile (nell'elemento STYLE) contiene una regola CSS che imposta tutti gli elementi H1 sulla famiglia di font 'Robson Celtic'.
L'implementazione CSS1 cercherà sul sistema dell'utente un font il cui nome di famiglia e le altre proprietà corrispondono a 'Robson Celtic' e, se non riuscirà a trovarlo, userà il font serif specifico di ripiego del programma utente (che esiste per definizione).
Un programma utente che implementa i CSS2 esaminerà prima le regole @font-face in cerca di una descrizione dei font che definisca 'Robson Celtic'. Questo esempio contiene una regola che ha una corrispondenza. Sebbene questa regola non contenga molti dati dei font, ha un URI dove il font può essere preso per rendere questo documento. I font scaricati non dovrebbero essere resi disponibili per altre applicazioni. Se non viene trovata alcuna @font-face che corrisponda, il programma utente proverà a trovare la stessa corrispondenza di un programma utente che implementa i CSS1.
Si noti che se il font 'Robson Celtic' fosse stato installato sul sistema dell'utente, questo avrebbe fatto in modo che il programma utente aggiungesse una voce [entry] nel database dei font per la copia installata, come descritto nella sezione sull'algoritmo di corrispondenza dei font. La copia installata sarebbe stata selezionata prima del font scaricabile nell'esempio di cui sopra.
Le implementazioni CSS1, che non comprendono la regola @font-face, incontreranno la parentesi graffa aperta e ignoreranno il suo contenuto fino alla corrispondente parentesi graffa di chiusura. Questa regola-a [at-rule] è conforme al requisito dei CSS sull'analisi compatibile nel futuro. I parser possono ignorare queste regole senza errore.
Tenere separati i descrittori dei font dai dati dei font ha un beneficio che va al di là dell'essere in grado di selezionare o sostituire i font. La protezione sui dati e le restrizioni sulla replica per i descrittori dei font possono essere molto più deboli dei dati dei font nel loro insieme. Così, è possibile installare la definizione del font localmente, o almeno tenerla in una cache locale se essa ricorre in un foglio di stile a cui si fa comune riferimento; questo sistema necessiterebbe dell'accesso alla completa definizione dei font sul Web non più di una volta per ogni font denominato.
Se un descrittore dei font viene duplicato, il descrittore che ricorre per ultimo vince ed il resto deve essere ignorato.
Inoltre tutti i descrittori non riconosciuti o non utili per il programma utente devono essere ignorati. Le future versioni dei CSS possono consentire descrittori aggiuntivi allo scopo di una migliore sostituzione, corrispondenza o sintesi dei font.
I seguenti descrittori hanno gli stessi nomi delle corrispondenti proprietà CSS dei font, e assumono un singolo valore o un elenco di valori separati da virgola.
I valori all'interno dell'elenco sono, tranne dove indicato esplicitamente, gli stessi della corrispondente proprietà CSS. Se c'è un singolo valore, questo è il valore che deve essere selezionato. Se c'è un elenco, ogni voce dell'elenco costituisce una corrispondenza. Se il descrittore è omesso da @font-face, si usa il valore iniziale per il descrittore.
| Valore: | [ <family-name> | <generic-family> ] [, [<family-name> | <generic-family> ]]* |
| Iniziale: | dipende dal programma utente |
| Media: | visuale |
Questo è il descrittore per il nome di famiglia dei font di un font e assume gli stessi valori della proprietà 'font-family'.
| Valore: | all | [ normal | italic | oblique ] [, [normal | italic | oblique] ]* |
| Iniziale: | all |
| Media: | visuale |
Questo è il descrittore per lo stile di un font e assume gli stessi valori della proprietà 'font-style', tranne per il fatto che è permesso un elenco separato da virgola.
| Valore: | [normal | small-caps] [,[normal | small-caps]]* |
| Iniziale: | normal |
| Media: | visuale |
Questa è il descrittore che indica se il tipo di un font è in maiuscoletto [small-caps] o meno. Assume gli stessi valori della proprietà 'font-variant' tranne per il fatto che è permesso un elenco separato da virgola.
Nota. Tipi cirillici pryamoĭ possono essere definiti con 'font-variant' su maiuscoletto, che conferiranno loro una migliore consistenza con i tipi latini (e il tipo compagno kursiv è definito con 'font-style' su italico [italic] per la stessa ragione).
| Valore: | all | [normal | bold | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900] [, [normal | bold | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900]]* |
| Iniziale: | all |
| Media: | visuale |
Questo è il descrittore per il peso di un tipo relativamente ad altri della stessa famiglia di font. Assume gli stessi valori della proprietà 'font-weight' con tre eccezioni:
| Valore: | all | [ normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded ] [, [ normal | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded] ]* |
| Iniziale: | normal |
| Media: | visuale |
Questa è l'indicazione CSS della natura espansa o condensata del tipo, in relazione ad altri tipi nella medesima famiglia di font. Assume gli stessi valori della proprietà 'font-stretch' tranne per il fatto che:
| Valore: | all | <length> [, <length>]* |
| Iniziale: | all |
| Media: | visuale |
Questo è il descrittore per le dimensioni fornite da questo font. Sono permesse solo unità di lunghezza assolute, in contrasto con la proprietà 'font-size', che permette dimensioni e lunghezze relative e assolute. Un elenco separato da virgola di lunghezze assolute è permesso.
Il valore iniziale di 'all' è adatto soprattutto per i font scalabili, così questo descrittore è inteso principalmente per l'uso in una regola @font-face per font bitmap,o per font scalabili concepiti per essere rasterizzati in un ristretto campo di dimensioni.
Il seguente descrittore è facoltativo all'interno di una definizione di font, ma è usato per evitare di cercare o scaricare un font che non ha glifi sufficienti per rendere un particolare carattere.
| Valore: | <urange> [, <urange>]* |
| Iniziale: | U+0-7FFFFFFF |
| Media: | visuale |
Questo è il descrittore per il campo di caratteri ISO 10646 coperto dal font.
I valori di <urange> sono espressi usando numeri esadecimali con prefisso "U+", corrispondenti alle posizioni del codice del carattere in ISO 10646 ([ISO10646]).
Per esempio, U+05D1 è il carattere ISO 10646 'Hebrew letter bet'. Per valori al di fuori del Basic Multilingual Plane (BMP), vengono aggiunte cifre iniziali aggiuntive corrispondenti al numero di livello, anche in esadecimale, come questo: U+A1234 che è il carattere sul Plane 10 alla posizione esadecimale di codice 1234. Al momento della stesura di questo documento, nessun carattere è stato assegnato al di fuori del BMP. Gli zero iniziali (per esempio, 0000004D) sono validi, ma non richiesti.
Il valore iniziale di questo descrittore copre non solo l'intero Basic Multilingual Plane (BMP), che verrebbe espresso come U+0-FFFF, ma anche l'intero repertorio ISO 10646. Così, il valore iniziale dice che il font può avere i glifi per i caratteri ovunque all'interno di ISO 10646. Specificare un valore per 'unicode-range' fornisce informazioni per rendere la ricerca efficiente, dichiarando un campo ristretto in cui il font può avere i glifi per i caratteri. Per il font c'è bisogno di cercare caratteri al di fuori di questo campo.
I valori possono essere scritti con ogni numero di cifre. Per i singoli numeri, si presuppone che il carattere '?' significhi 'any value' [any value, ogni valore] il che crea un campo di posizioni di carattere. Così, usando un singolo numero:
Una coppia di numeri in questo formato può essere combinata con il carattere lineetta per indicare campi più grandi. Per esempio:
Si possono specificare campi multipli e discontinui, separati da una virgola. Come con gli altri elenchi separati da virgola nei CSS, ogni spazio bianco prima o dopo la virgola è ignorato. Per esempio:
Una rappresentazione più probabile per un font cinese sarebbe:
unicode-range: U+3000-33FF, U+4E00-9FFF
Il seguente descrittore specifica il numero di "unità" per em; queste unità possono essere usate da diversi altri descrittori per esprimere varie lunghezze, sicchè 'units-per-em' è richiesto se altri descrittori ne dipendono.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per il numero di unità coordinate sul riquadro em, le dimensioni della griglia di disegno su cui sono rappresentati i glifi.
Questo descrittore è richiesto per far riferimento ai dati effettivi dei font, se sono scaricabili o installati localmente.
| Valore: | [ <uri> [format(<string> [, <string>]*)] | <font-face-name> ] [, <uri> [format(<string> [, <string>]*)] | <font-face-name> ]* |
| Iniziale: | non definito |
| Media: | visuale |
Questo è un elenco prioritario, separato da virgola di rimandi esterni e/o di nomi di tipi di font installati. Il rimando esterno punta ai dati dei font sul Web. Ciò è richiesto se il WebFont deve essere scaricato. La risorsa del font può essere un sotto-insieme del font sorgente, per esempio può contenere solo i glifi necessari alla pagina corrente o ad un insieme di pagine.
Il rimando esterno consiste in un URI, seguito da un suggerimento facoltativo che riguarda il formato della risorsa del font rintracciabile a quell'URI, e questa informazione dovrebbe essere usata dagli utenti per evitare di seguire collegamenti in formati che non sono in grado di gestire. Come con ogni rimando ipertestuale, possono essere disponibili altri formati, ma in questo modo l'utente ha una migliore idea di ciò che è probabile che vi sia a quell'URI, in un modo certamente più robusto rispetto al semplice tentativo di analizzare le estensioni dei nomi di file presenti negli URI.
Il suggerimento sul formato contiene un elenco di stringhe di formato separate da virgola, che indicano formati di font ben conosciuti. Il programma utente riconoscerà il nome dei formati di font che può supportare, evitando così di scaricare font in formati che non riconosce.
Un elenco iniziale di stringhe di formato definito da queste specifiche e che rappresenta formati da usare probabilmente per le implementazioni su varie piattaforme è:
| Stringa | Formato dei font | Esempi di estensioni comuni |
|---|---|---|
| "truedoc-pfr" | TrueDoc™ Portable Font Resource | .pfr |
| "embedded-opentype" | Embedded OpenType | .eot |
| "type-1" | PostScript™ Type 1 | .pfb, .pfa |
| "truetype" | TrueType | .ttf |
| "opentype" | OpenType, incluso TrueType Open | .ttf |
| "truetype-gx" | TrueType con estensioni GX | |
| "speedo" | Speedo | |
| "intellifont" | Intellifont |
Come con gli altri URI nei CSS, l'URI può essere parziale, nel qual caso viene risolto in relazione alla posizione del foglio di stile contenente @font-face.
La <font-face-name> installata localmente è il nome completo dei font di un font installato localmente. Il nome completo dei font è il nome del font come riportato dal sistema operativo ed è il nome che più probabilmente dovrà essere usato nei fogli di stile del lettore, nei fogli di stile predefiniti del browser o possibilmente nei fogli di stile dell'autore su di una intranet. Ornamenti quali bold, italic, e underline sono spesso usati per differenziare i tipi all'interno di una famiglia di font. Per ulteriori informazioni sui nomi completi dei font si prega di consultare le note più avanti.
La notazione per un <font-face-name> è il nome completo dei font, che deve essere racchiuso tra virgolette poichè può contenere ogni carattere, inclusi spazi e punteggiatura, e deve anche essere racchiuso in "local(" e ")".
L'accesso a font installati localmente avviene tramite <font-face-name>. Il nome del tipo dei font non è realmente unico, e neppure è realmente indipendente dalla piattaforma o dal formato del font, ma al momento è il miglior modo di identificare i dati dei font installati localmente. L'uso dei nomi di tipo dei font può essere reso più accurato fornendo un'indicazione del glifo complementare richiesto. Ciò può essere fatto indicando il campo di posizioni di carattere ISO 10646 per il quale il font fornisce alcuni glifi (si veda 'unicode-range').
Questi descrittori sono facoltativi per una definizione CSS2, ma possono essere usati se l'autore desidera una corrispondenza intelligente o un aggiustamento della dimensione dei font.
| Valore: | [<integer>]{10} |
| Iniziale: | 0 0 0 0 0 0 0 0 0 0 |
| Media: | visuale |
Questo è il descrittore per il numero di Panose-1 e consiste di dieci interi decimali, separati da uno spazio bianco. Un elenco separato da virgola non è permesso per questo descrittore, poichè il sistema Panose-1 può indicare che un campo di valori sono selezionati. Il valore iniziale è zero, che significa "any" [any, "ogni"], per ogni cifra PANOSE; tutti i font corrisponderanno al numero di Panose se viene usato questo valore. L'uso del descrittore Panose-1 è fortemente raccomandato per i font latini. Per ulteriori dettagli si veda l'Appendice C.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per l'ampiezza del gambo verticale del font. Se il valore non è definito, il descrittore non è usato per la corrispondenza. Se il descrittore è usato, deve essere usato anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per l'ampiezza del gambo orizzontale del font. Se il valore non è definito, il descrittore non è usato per la corrispondenza. Se il descrittore è usato, deve essere usato anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | 0 |
| Media: | visuale |
Questo è il descrittore dell'angolo di inclinazione verticale del font.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per il numero dell'altezza dei glifi maiuscoli del font. Se il valore non è definito, il descrittore non è usato per la corrispondenza. Se si usa il descrittore, deve essere usato anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per l'altezza dei glifi minuscoli del font. Se il valore non è definito, il descrittore non è usato per la corrispondenza. Se si usa il descrittore, deve essere usato anche il descrittore 'units-per-em'. Questo descrittore può essere molto utile se si usa la proprietà 'font-size-adjust', perchè il calcolo del valore z dei font candidati richiede sia la dimensione del font che l'altezza-x; si raccomanda perciò di includere questo descrittore.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per l'altezza massima non accentata del font. Se il valore non è definito, il descrittore non è usato per la corrispondenza. Se si usa il descrittore, deve essere usato anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per la profondità massima non accentata del font. Se il valore non è definito, il descrittore non è usato per la corrispondenza. Se si usa il descrittore, deve essere usato anche il descrittore 'units-per-em'
Sintetizzare un font significa, come minimo, trovare la corrispondenza nell'ampiezza metrica del font specificato. Perciò, per la sintesi, questa informazione metrica deve essere disponibile. Similmente, la resa progressiva richiede l'ampiezza metrica per evitare la risistemazione del contenuto quando il font effettivo è stato caricato. Sebbene i seguenti descrittori siano facoltativi per una definizione CSS2, alcuni sono richiesti se l'autore desidera la sintesi (o la resa progressiva priva di risistemazione del contenuto). Il font effettivo dovrebbe divenire disponibile, e il sostituto dovrebbe essere rimpiazzato dal font effettivo. Ciascuno di questi descrittori presenti sarà usato per fornire un'approssimazione migliore o più rapida del font designato.
Di questi descrittori, i più importanti sono il descrittore 'widths' e 'bbox' che sono usati per evitare che il testo sia risistemato mentre il font effettivo dovrebbe divenire disponibile. In aggiunta, i descrittori nell'insieme dei descrittori usati per la corrispondenza possono essere usati per fornire una sintesi migliore dell'aspetto del font effettivo.
Questo è il descrittore per le ampiezze dei glifi. Questo valore è un elenco separato da virgola di valori <urange> ciascuno seguito da una o più ampiezze dei glifi. Se si usa il descrittore, deve essere usato anche il descrittore 'units-per-em'.
Se <urange> è omesso, si presuppone un campo di U+0-7FFFFFFF che copre tutti i caratteri e i loro glifi. Se non vengono fornite sufficienti ampiezze di glifi, l'ultima dell'elenco viene replicata per coprire tale campo. Se vengono fornite troppe ampiezze, quelle extra vengono ignorate.
Per esempio:
widths: U+4E00-4E1F 1736 1874 1692
widths: U+1A?? 1490, U+215? 1473 1838 1927 1684 1356 1792
1815 1848 1870 1492 1715 1745 1584 1992 1978 1770
Nel primo esempio viene dato un campo di 32 caratteri, da 4E00 a 4E1F. Il glifo corrispondente al primo carattere (4E00) ha un'ampiezza di 1736, il secondo di 1874 e il terzo di 1692. Poichè non vengono fornite sufficienti ampiezze, l'ultima ampiezza viene replicata per coprire il resto del campo specificato. Il secondo esempio imposta un'ampiezza singola, 1490, per un intero campo di 256 glifi e quindi ampiezze esplicite per un campo di 16 glifi.
Questo descrittore non può descrivere glifi multipli che corrispondono ad un singolo carattere, o legature di caratteri multipli. Così, questo descrittore può solo essere usato per scritture che non hanno forme contestuali o legature vincolanti. Si rivela nondimeno utile in queste situazioni. Le scritture che richiedono una correlazione uno-a-molti e molti-a-molti fra caratteri e glifi non possono, al momento, usare questo descrittore per abilitare la sintesi dei font, sebbene possano ancora usare il download dei font o la corrispondenza intelligente.
Questo è il descrittore per il riquadro di delimitazione massimo del font. Il valore è un elenco separato da virgola di quattro numeri esatti che specificano, nell'ordine, la coordinata x inferiore sinistra, la coordinata y inferiore sinistra, la coordinata x superiore destra e la coordinata y superiore destra del riquadro di delimitazione per il font completo.
| Valore: | <uri> |
| Iniziale: | non definito |
| Media: | visuale |
I descrittori dei font possono trovarsi all'interno della definizione dei font nel foglio di stile, oppure possono essere forniti all'interno di una separata risorsa di definizione dei font identificata da un URI. Quest'ultimo approccio può ridurre il traffico della rete quando fogli di stile multipli fanno riferimento agli stessi font.
Questi descrittori facoltativi sono usati per allineare le direzioni di differenti scritture le une con le altre.
| Valore: | <number> |
| Iniziale: | 0 |
| Media: | visuale |
Questo è il descrittore per la linea di riferimento inferiore di un font. Se a questo descrittore viene dato un valore non-predefinito (non-zero), si deve usare anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per la linea di riferimento centrale di un font. Se il valore non è definito, il programma utente può usare vari metodi euristici, come il punto medio dei valori di ascesa e di discesa, Se si usa questo descrittore, si deve usare anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per la linea di riferimento matematica di un font. Se non è definito, il programma utente può usare la linea di riferimento centrale. Se si usa questo descrittore, si deve usare anche il descrittore 'units-per-em'.
| Valore: | <number> |
| Iniziale: | non definito |
| Media: | visuale |
Questo è il descrittore per la linea di riferimento superiore di un font. Se non è definito, il programma utente può usare un valore approssimato come l'ascesa. Se si usa il descrittore, si deve usare anche il descrittore 'units-per-em'.
Dato il seguente elenco di font:
| Swiss 721 light | chiaro & chiaro italico |
| Swiss 721 | romano [roman], grassetto, italico, grassetto italico |
| Swiss 721 medium | medio & medio italico |
| Swiss 721 heavy | pesante & pesante italico |
| Swiss 721 black | nero, nero italico, & nero #2 |
| Swiss 721 Condensed | romano, grassetto, italico, grassetto italico |
| Swiss 721 Expanded | romano, grassetto, italico, grassetto italico |
Le seguenti descrizioni di font potrebbero essere usate per renderli disponibili per il download.
@font-face {
font-family: "Swiss 721";
src: url("swiss721lt.pfr"); /* Swiss 721 light */
font-style: normal, italic;
font-weight: 200;
}
@font-face {
font-family: "Swiss 721";
src: url("swiss721.pfr"); /* The regular Swiss 721 */
}
@font-face {
font-family: "Swiss 721";
src: url("swiss721md.pfr"); /* Swiss 721 medium */
font-style: normal, italic;
font-weight: 500;
}
@font-face {
font-family: "Swiss 721";
src: url("swiss721hvy.pfr"); /* Swiss 721 heavy */
font-style: normal, italic;
font-weight: 700;
}
@font-face {
font-family: "Swiss 721";
src: url("swiss721blk.pfr"); /* Swiss 721 black */
font-style: normal, italic;
font-weight: 800,900; /* note the interesting problem that
the 900 weight italic doesn't exist */
}
@font-face {
font-family: "Swiss 721";
src: url(swiss721.pfr); /* The condensed Swiss 721 */
font-stretch: condensed;
}
@font-face {
font-family: "Swiss 721";
src: url(swiss721.pfr); /* The expanded Swiss 721 */
font-stretch: expanded;
}
In questa sezione sono elencate le caratteristiche dei font che sono risultate utili per la corrispondenza lato client, la sintesi e il download per piattaforme eterogenee che hanno accesso al Web. I dati possono essere utili per ogni media che necessita di usare i font sul Web per motivi diversi dall'inserimento fisico dei dati dei font all'interno del media.
Queste caratteristiche sono usate per caratterizzare i font. Non sono specifiche ai CSS o ai fogli di stile. Nei CSS ogni caratteristica è descritta da un descrittore dei font. Queste caratteristiche potrebbero anche essere correlate con nodi VRML, o strutture applicative CGM, o un API Java, o linguaggi alternativi dei fogli di stile. I font presi da un media e conservati in una cache proxy potrebbero essere ri-usati da un altro media, risparmiando tempo per il download e ampiezza di banda di rete, se viene usato nella sua interezza un comune sistema di caratteristiche dei font.
Un non-esaustivo elenco di questi media comprende:
Questo è il nome completo di un particolare tipo in una famiglia di font. Di solito comprende una varietà di qualificatori testuali non-standard o di ornamenti aggiunti al nome di famiglia dei font. Può anche includere un nome di fonderia [foundry, termine tipografico] on un'abbreviazione, spesso preposti al nome di famiglia dei font. Si usa solo per far riferimento a font installati localmente, poichè il formato del nome ornato può variare da piattaforma a piattaforma. Deve essere racchiuso fra virgolette.
Per esempio, il nome di famiglia dei font del font TrueType e quello del font PostScript possono differire nell'uso dei caratteri di spazio, nella punteggiatura, e nell'abbreviazione di alcune parole (per esempio per venire incontro a vari sistemi o limitazioni dell'interprete della stampante sulla lunghezza dei nomi). Per esempio, gli spazi non sono permessi in un nome PostScript, ma sono comuni nei nomi completi dei font. La tabella dei nomi TrueType può anche contenere il nome PostScript, che non ha spazi.
Il nome della definizione dei font è importante perchè è il collegamento a tutti i font installati localmente. È importante che il nome sia robusto, secondo l'indipendenza dalla piattaforma e dall'applicazione. Per questo motivo, il nome non dovrebbe essere specifico di un'applicazione o di un linguaggio.
La soluzione ideale sarebbe quella di avere un nome che identifichi univocamente ogni collezione di dati dei font. Questo nome non esiste nella pratica corrente per i dati dei font. I font con lo stesso nome di tipo possono variare su un numero di descrittori. Alcuni di questi descrittori, come differenti complementi dei glifi nei font, possono essere insignificanti se i glifi richiesti sono nel font. Atri descrittori, come differenti ampiezze metriche, rendono i font con lo stesso nome incompatibili. Non sembra possibile definire una regola che identificherà sempre le incompatibilità, ma non impedirà l'uso di una copia locale perfettamente adattabile dei dati dei font con un dato nome. Per questo motivo, solo il campo dei caratteri ISO 10646 sarà usato per qualificare le corrispondenze per i nomi del tipo dei font.
Poichè un primo obiettivo del nome del tipo dei font nella definizione dei font è quello di consentire al programma utente di determinare se c'è una copia locale dei dati dei font specificati, il nome deve essere tale da trovarsi in tutte le copie legittime dei dati dei font. Altrimenti si può generare un traffico Web non necessario a causa di mancate corrispondenze della copia locale.
Alcuni valori, come le ampiezze metriche, sono espresse in unità relative ad un riquadro astratto la cui altezza è la distanza definita fra le linee di carattere nella stessa dimensione di carattere. Questo riquadro è chiamato riquadro em ed è la griglia di disegno su cui sono definiti i contorni dei glifi. Il valore di questo descrittore specifica in quante unità è diviso il riquadro EM. Valori comuni sono per esempio 250 (Intellifont), 1000 (Type 1) e 2048 (TrueType, TrueType GX e OpenType).
Se questo valore non è specificato, diventa impossibile conoscere qaulsiasi significato delle metriche dei font. Per esempio, un font ha glifi minuscoli di altezza 450; un altro ne ha di più piccoli di altezza 890! I numeri sono effettivamente frazioni; il primo font ha 450/1000 e il secondo 890/2048 che è effettivamente più piccolo.
Questa da la posizione nel riquadro em della linea di riferimento centrale. La linea di riferimento centrale è usata dalle scritture ideogrammatiche per l'allineamento, come la linea di riferimento inferiore è usata per le scritture latine. greche e cirilliche.
Esplicitamente o implicitamente, ogni font ha una tabella associata ad esso, la tabella di codifica dei font, che dice quale carattere rappresenta ogni glifo. Ci si riferisce a questa tabella anche come ad un vettore di codifica.
Infatti molti font contengono diversi glifi per lo stesso carattere. Quale di questi glifi debba essere usato dipende dalle regole della lingua oppure dalla preferenza del designer.
In arabo, per esempio, tutte le lettere hanno quattro (o due) differenti forme, a seconda se la lettera è usata all'inizio di una parola, in mezzo, alla fine o isolata. È lo stesso carattere in tutti i casi, e così c'è solamente un carattere nel documento sorgente, ma all'atto della stampa appare ogni volta differente.
Ci sono anche font che lasciano al designer grafico la scelta fra varie alternative di forme fornite. Purtroppo i CSS2 non fonriscono ancora i mezzi per selezionare queste alternative. Allo stato attuale da questi font viene scelta sempre la forma predefinita.
Specifica una parte del nome della famiglia di un nome del tipo di font. Per esempio, il nome della famiglia per Helvetica-Bold è Helvetica e quello di ITC Stone Serif Semibold Italic è ITC Stone Serif. Alcuni sistemi trattano gli ornamenti relativi ai tipi espansi o condensati come se fossero parte del nome della famiglia.
Questo è un elenco di larghezze, sulla griglia di disegno, per il glifo corrispondente a ciascun carattere. Questo elenco è ordinato secondo il punto di codice ISO10646. Le larghezze non possono essere proficuamente specificate se più di un glifo è correlato allo stesso carattere o se vi sono legature obbligatorie.
Questo valore si riferisce al gambo dominante del font. Possono esservi due o più ampiezze designate. Per esempio, i gambi verticali principali dei caratteri Roman differiranno dai gambi sottili sulle "M" e "N" con grazie, ed in più possono esservi differenti ampiezze per i caratteri maiuscoli e minuscoli nell stesso font. Ancora: sia per disegno che per errore, tutti i gambi possono avere ampiezze molto differenti.
Questa misura è la coordinata y della parte superiore delle lettere maiuscole piane nelle scritture latina, greca e cirillica, misurata dalla linea di riferimento. Questo descrittore non è necessariamente utile per i font che non contengono glifi di queste scritture.
Questa misura è la coordinata y della parte superiore delle lettere minuscole non-accentate e non-ascendenti nelle scritture latina, greca e cirillica, misurata dalla linea di riferimento. Vengono usate lettere con la parte superiore piana, ignorando ogni zona di correzione ottica. Si usa di solito come rapporto fra altezze minuscole e maiuscole e come mezzo per comparare famiglie di font.
Questo descrittore non è utile per i font che non contengono glifi di queste scritture. Poichè le altezze delle lettere maiuscole e minuscole sono spesso espresse come rapporto per comparare font differenti, può essere utile impostare le altezze maiuscole e minuscole sullo stesso valore per le scritture unicamerali come l'ebraico, dove per un testo misto latino-ebraico, i caratteri ebraici sono di solito impostati ad un'altezza a metà strada fra le altezze maiuscole e minuscole del font latino.
Questo da la posizione nel riquadro em della linea di rifeirmento inferiore. La linea di riferimento inferiore è usata dalle scritture latina, greca e cirillica per l'allineamento così come la linea di riferimento superiore è usata per le scritture derivate dal sanscrito.
Questo da la posizione nel riquadro em della linea di riferimento matematica. La linea di riferimento matematica è usata da simboli matematici per l'allineamento, così come la linea di riferimento inferiore è usata per le scritture latina, greca e cirillica.
Il riquadro di delimitazione massimo è il rettangolo più piccolo che racchiude la forma che risulta se tutti i glifi nel font sono posizionati con le loro origini coin