# 014: caratteri personalizzati con Typekit - Trucchi CSS

Anonim

Abbiamo impostato un nuovo kit in Typekit per v10. Per il marchio, per ora utilizzeremo Proxima Nova Soft e altri caratteri che si avvicinano il più possibile ai caratteri HF&J nel nostro mockup.

Siamo un po 'preoccupati per il peso del Kit (letteralmente la dimensione del file di tutti i caratteri) ma pensiamo di poter fare un po' meglio prima della produzione.

Usiamo il JavaScript asincrono fornito da Typekit, che dovrebbe essere utile per il tempo di caricamento della nostra pagina e salvaguardare da possibili interruzioni di Typekit. Ciò significa che dobbiamo avere un po 'di fantasia con il modo in cui vengono caricati i caratteri, cosa che arriveremo.

Nel nostro file bits.scss, dove stiamo mantenendo le variabili in questo momento, creiamo un @mixin personalizzato per i nostri stack di font. Ciò significa che sarà davvero facile cambiare i caratteri in uso se ne avremo bisogno (cambiare in un solo posto). Vogliamo che bits.scss non generi assolutamente alcun CSS quando viene compilato, in modo che possa essere @importato su qualsiasi pagina che ne abbia bisogno senza che aggiunga nulla a quella pagina importandolo.

Parliamo a Typekit dei nostri domini di sviluppo locale personalizzati locali, che imposteremo in seguito.