- Guida utente di Adobe Fonts
- Introduzione
- Licenze per font
- Licenze per font
- Gestire l'account
- Licenza per i clienti Creative Cloud for enterprise
- Aggiunta di licenze per font al tuo account
- Rimozione di font dalla libreria dell’abbonamento
- Adobe Fonts non disponibile per gli Adobe ID registrati in Cina
- Perché questi font non sono inclusi nel mo abbonamento a Creative Cloud?
- Rimozione dei font Morisawa settembre 2021
- Ottenere e usare i font
- Utilizzo di Adobe Fonts nelle app Creative Cloud
- Gestione dei font
- Risoluzione dei problemi relativi ai font mancanti nelle applicazioni desktop
- Utilizzo dei font in InDesign
- Font e composizione tipografica
- Utilizzo dei font per web nei documenti per l’area di lavoro HTML5
- Utilizzo dei font in InCopy
- Utilizzo dei font per web in Muse
- Creazione dei file di font
- Guida alla risoluzione dei problemi: aggiunta di font
- I font aggiunti non vengono visualizzati nel menu dei font
- "Impossibile aggiungere uno o più font" o "Un font con lo stesso nome è già installato"
- Cosa succede quando il font che sto usando è aggiornato dalla foundry?
- Progetti Web e sviluppo
- Aggiunta di font al tuo sito Web
- Guida alla risoluzione dei problemi: aggiunta di font al tuo sito Web
- Risoluzione dei problemi relativi ai font
- Utilizzo dei font per web in newsletter o e-mail HTML
- Utilizzo dei font per web con Accelerated Mobile Pages (AMP)
- Selettori CSS
- Personalizza le prestazioni dei font per web con le impostazioni di visualizzazione dei font
- Codici di incorporamento
- Suddivisione dinamica in sottoinsiemi e utilizzo dei font per web
- Eventi font
- Perché i miei font per web provengono da use.typekit.net?
- Il sito non può connettersi a use.typekit.net
- Utilizzo dei font per web con CodePen
- Supporto di browser e sistemi operativi
- Domini
- Utilizzo dei font per web per lo sviluppo locale
- Policy di protezione dei contenuti
- Stampa dei font per web
- Supporto per le lingue e funzioni OpenType
- Tecnologia dei font
Le funzioni OpenType sono come scomparti segreti nei font. Sbloccali e troverai modi incredibili per rendere diverso l'aspetto e il comportamento dei font. Non tutte le funzioni di OpenType sono appropriate per essere utilizzate sempre, ma alcune di esse sono fondamentali per una composizione tipografica ottimale.
Per utilizzare le funzioni OpenType di un font nel progetto, è necessario includerle nel progetto Web e quindi applicare uno stile al testo con il CSS richiesto. Consulta la nostra guida alla sintassi per esempi di ciascuna funzione con codice che è possibile copiare e incollare nel tuo CSS.
Includere le funzioni OpenType nel progetto
Per includere le funzioni OpenType di un font in un progetto Web, visita la pagina dei progetti Web e fai clic sul collegamento "modifica" del progetto. Nella sezione Set di caratteri, seleziona la casella Funzioni OpenType.
Quando la casella è selezionata, varrà visualizzato un elenco di funzioni disponibili per quella particolare famiglia di font per web, come legature, caratteri alternativi o maiuscoletto.
L'elenco mostra le funzioni OpenType che sono disponibili in tutti gli spessori e gli stili della famiglia. Se una funzione è inclusa solo in spessori o stili specifici, non è inclusa nell'elenco.
Controlla il supporto del browser per le funzioni che stai utilizzando
Lo scarso supporto del browser per font-variant e font-feature-settings significa che le funzioni OpenType potrebbero non funzionare correttamente in tutti i contesti che ti interessano.
Il supporto è diminuito in modo incomprensibile. Le versioni più recenti dei browser che richiedono il supporto vengono fornite con avvertenze e i browser meno recenti che non supportano le funzioni OpenType non hanno praticamente supporto. Per impostazione predefinita, Chrome non attiva le funzioni che dovrebbero essere attivate per impostazione predefinita (come le legature comuni e le alternative contestuali). Safari su macOS e iOS ignora qualsiasi valore specificato per font-feature-settings, scegliendo invece di attivare alcune funzioni per impostazione predefinita e le scelte predefinite non possono essere modificate. Alcune versioni di Firefox (versione 15 e precedenti) hanno problemi quando sono attivati più set stilistici. L'applicazione delle funzioni OpenType in Chrome 32 e versioni precedenti interrompe il funzionamento dei font per web.
-moz-font-feature-settings: "smcp"; -webkit-font-feature-settings: "smcp"; font-feature-settings: "smcp";
L'attuale supporto del browser si basa in gran parte sui prefissi dei fornitori. Nel documento per l'aiuto per la Sintassi per le funzioni OpenType in CSS, troverai il codice pieno di proprietà con prefisso del fornitore che assomigliano all'esempio precedente.
Dai stile al tuo testo con le funzioni OpenType utilizzando CSS
La Sintassi CSS per attivare le funzioni OpenType è ancora in evoluzione. Quello che devi sapere è che ci sono proprietà sia di alto livello che di basso livello e l'ereditarietà è particolarmente complicata.
La proprietà CSS font-feature-settings di basso livello è in qualche modo supportata nei browser tramite i prefissi dei fornitori, ma è complicata da usare per due motivi. Innanzitutto, si basa su tag di funzioni OpenType di quattro caratteri difficili da ricordare. In secondo luogo, tutti i tag delle funzioni sono specificati in una singola proprietà, e ciò può essere complicato. Consulta la sintassi per l'utilizzo di funzioni OpenType specifiche e la sintassi per l'utilizzo di più funzioni OpenType.
La proprietà CSS font-variant di alto livello e le sue proprietà secondarie sono ottime perché utilizzano valori del linguaggio naturale come "small-caps" e "diagonal-fractions". Il W3C desidera che vengano utilizzati quando possibile, ma il supporto del browser è inesistente. Tuttavia, è una buona idea abituarsi alla sintassi.
.class {
font-variant-caps: small-caps;
font-feature-settings: "smcp";
}
Quindi, useremo sia font-variant che font-feature-settings, tenendo presente come sono progettate per funzionare. Specificheremo prima font-variant di facile lettura nel nostro CSS, come il codice precedente.
Eredità
Poiché font-feature-setting è una proprietà di basso livello prevista "per casi speciali in cui il suo utilizzo è l'unico modo per accedere a una particolare funzione dei font utilizzata di rado", sovrascriverà font-variant indipendentemente dall'ordine di origine. Ma fai attenzione: sostituisce anche se stessa:
body {
font-variant-numeric: oldstyle-nums;
font-feature-settings: "onum";
}
.class {
font-variant-caps: small-caps;
font-feature-settings: "smcp"; /* disables onum from body declaration */
}
Tutti i valori font-feature-settings ereditati vengono sovrascritti quando la proprietà viene riapplicata. Nell'esempio precedente, per gli elementi con una classe di classe devono avere sia il maiuscoletto (smcp) che le cifre in stile antico (onum) attivati, il valore "onum" dovrebbe essere incluso di nuovo, quindi potremmo riscrivere la dichiarazione in questo modo:
.class {
font-variant-caps: small-caps;
font-feature-settings: "onum", "smcp";
}
Valori font-feature-settings indicizzati
Alcuni valori font-feature-settings sono un po' più complessi. Negli esempi illustrati finora, ogni valore era una stringa (o un set di stringhe delimitato da virgole). La presenza o l'assenza di tag di funzioni quali come "onum" e "smcp" è come una scelta binaria: le funzioni sono attivate o disattivate.
Ciò ha senso. Ma cosa succede se, ad esempio, un font contiene due diverse versioni di ornato del carattere "A" maiuscola? In questo caso, non vogliamo semplicemente attivare gli ornati: vogliamo gli ornati e scegliere un particolare ornato. Quindi possiamo aggiungere un indice numerico al valore dopo la stringa:
font-feature-settings: "swsh" 2;
Potresti chiederti, quale numero dovrei usare qui? Quanti ornati diversi ci sono in un font? Dipende dal font. Usare "0" significa disattivare la funzione di ornato. Lo stesso vale per altre funzioni che utilizzano indici numerici, come le alternative stilistiche e i set stilistici.
Utilizzo di funzioni OpenType multiple
La proprietà font-variant è una forma abbreviata di CSS per tutte le proprietà secondarie di font-variant. Possiamo un'operazione simile a questa per attivare le legature comuni e le figure in stile antico:
.class {
font-variant: common-ligatures, oldstyle-nums;
}
Allo stesso modo, più funzioni possono essere attivate utilizzando font-feature-settings con un elenco di valori delimitato da virgole:
.class {
font-feature-settings: "liga", "onum";
}
In entrambi i casi, i valori ereditati vengono completamente sovrascritti e il supporto del browser può variare. Tieni presente che i valori font-variant a volte sono stati progettati per attivare più funzioni contemporaneamente (consulta maiuscolo a maiuscoletto).
Risorse
Se sei pronto per iniziare a creare stili con CSS, crea un segnalibro per il glossario della sintassi delle funzioni OpenType utilizzate di frequente
