Un tauler pot oferir nou pesos i el tema sol·licitar un fitxer per a cadascun, encara que el web només mostri text regular i titulars en negreta. Les variants addicionals augmenten peticions, memòria cau i competència inicial sense canviar visiblement el disseny.
Abans de retirar-les, relaciona pesos CSS amb els fitxers que el navegador tria realment.
Inventariar pesos declarats i renderitzats
Busca font-weight en fulls i constructor. Registra valors numèrics, no noms com «medium», que canvien segons la família.
Inspecciona paràgrafs, títols, navegació, botons, preus, etiquetes i text fort en diverses plantilles i mòbil. Network mostra quins fitxers es transfereixen en fred.
Un pes 600 declarat es pot sintetitzar des de 700 si no hi ha fitxer; CSS sol no demostra quina font es dibuixa.
Entendre per què es carreguen variants semblants
El sistema de disseny pot assignar 500 a navegació, 600 a botons i 700 a títols encara que la diferència sigui mínima. El constructor també pot crear regles properes per a mòbil i escriptori.
Un altre error és declarar tots els fitxers com a 400. Cada cara estàtica necessita el descriptor correcte:
@font-face {
font-family: "Service Sans";
src: url("/fonts/service-sans-semibold.woff2") format("woff2");
font-weight: 600;
font-style: normal;
font-display: swap;
}
Consolidar primer el disseny
Defineix una escala intencional, per exemple 400 per al cos i 700 per a èmfasi, només si conserva jerarquia. Canvia els ajustos a la font del tema o constructor.
No eliminis 500 i 600 mentre CSS els continua demanant. El navegador podria sintetitzar, triar un fallback estrany o generar 404.
Compara botons i text petit: un pes redundant en un títol gran pot millorar la lectura a 14 píxels.
Triar fonts estàtiques o variables
Una variable pot cobrir un rang:
@font-face {
font-family: "Service Sans Variable";
src: url("/fonts/service-sans-variable.woff2") format("woff2");
font-weight: 300 800;
font-style: normal;
font-display: swap;
}
Un fitxer substitueix diversos, però compara pesos reals. Si només s’utilitzen 400 i 700, dos estàtics retallats poden ser menors.
Verifica compatibilitat i interpolació. No afegeixis la variable deixant encuades totes les fonts anteriors.
Conservar caràcters i idiomes
Retallar glifs pot estalviar més que eliminar un pes proper, però ha d’incloure caràcters necessaris. Una prova només en anglès omet accents de català i castellà.
Revisa noms, símbols monetaris, puntuació, titulars i errors de formularis. Defineix fallback per a caràcters externs evitant barreges visibles en contingut normal.
Conserva informació de llicència i confirma que permet autoallotjament i modificació.
No confondre pes amb estil
Una cursiva real necessita normalment el seu propi fitxer o eix variable. Eliminar-la perquè sembla un altre «pes» pot fer que el navegador inclini artificialment la regular i canviï amplades o llegibilitat.
Inspecciona font-style, etiquetes <em>, citacions, preus anteriors i missatges de validació. Decideix per separat quins pesos i estils són necessaris. Si permets negreta o cursiva sintètica, documenta el resultat visual; si les vols impedir, font-synthesis pot ajudar, però s’ha de provar als navegadors objectiu.
Carregar condicionalment només quan compensi
Si una campanya utilitza un pes especial, carrega’n el full només en aquella plantilla. La lògica ha de ser estable i provar blocs reutilitzats.
No construeixis un sistema complex per estalviar un fitxer petit ja en memòria cau. El manteniment ha de correspondre a l’impacte mesurat.
Verificar tipografia i xarxa
Neteja CSS generat i memòries cau pertinents. Confirma en una visita freda que només arriben els pesos previstos i no hi ha URL antigues amb 404.
Compara captures en amplades comunes. Busca salts de línia, alçada de botó, falsa negreta, cursives absents i moviment durant l’intercanvi. Prova impressió o PDF si el lloc els utilitza.
Demana una avaluació si no queda clar què genera cada pes o el constructor recrea declaracions antigues. Per començar n’hi ha prou amb URL pública i símptomes, mai contrasenyes pel formulari.