La proprietà CSS font-size-adjust viene inserita in Chrome oggi stesso,
ed entra a far parte di Baseline Newly Available. Questa proprietà può aiutare a prevenire
variazione del layout quando vengono caricati i caratteri di riserva e assicurati
leggibilità dei caratteri di riserva con dimensioni ridotte. font-size-adjust
fa parte di
Interop 2024,
quindi questa è un'altra vittoria per lo sforzo di migliorare l'interoperabilità
completamente gestita.
Il problema
Quando confronti due caratteri impostati con le stesse dimensioni, a seconda della forma e delle dimensioni dei glifi, il testo visualizzato può occupare una quantità di spazio molto diversa. Ad esempio, la seguente demo mostra testo in Verdana e Arial, entrambi impostati su 16 pixel.
La differenza di dimensioni è spiegata dal fatto che il valore aspetto, l'altezza delle lettere minuscole rispetto alle lettere maiuscole di un carattere, varia da un carattere all'altro.
Questo può causare due problemi quando viene utilizzato un carattere con un valore di aspetto diverso. come alternativa. Per prima cosa cambia la quantità di spazio occupato dal carattere. In secondo luogo, la scelta del carattere di riserva potrebbe essere meno leggibile rispetto a quella scelta. prima specificato, in particolare con caratteri di piccole dimensioni. Questo perché l'altezza relativa tra lettere minuscole e maiuscole è un fattore chiave leggibilità.
Utilità di font-size-adjust
La proprietà font-size-adjust ti consente di modificare meglio il carattere di riserva
corrispondono al primo carattere. L'esempio seguente mostra i due caratteri mostrati
in precedenza, questa volta il secondo carattere è stato regolato in modo che corrisponda al primo.
font-size-adjust.Questo esempio utilizza un singolo valore, un numero, che regola i caratteri utilizzando
metrica dei caratteri predefinita di ex-height. Questo è il rapporto tra l'altezza della x e l'altezza della x,
l'altezza di una x minuscola nel carattere. Puoi anche specificare il carattere
utilizzata. Nel prossimo esempio abbiamo normalizzato i caratteri utilizzando
ch-width parola chiave, oltre al numero.
font-size-adjust con la metrica del carattere ch-width.Per vedere tutti i valori possibili, vedi
Documentazione MDN per font-size-adjust.
Vale la pena esaminare il tuo sito utilizzando il carattere di riserva e vedere se un po'
l'ottimizzazione con font-size-adjust può aiutare i lettori che usano il carattere di riserva
offrono un'esperienza migliore, soprattutto ora è disponibile ovunque.