File di carattere mancanti

Silktide individua i file di carattere richiesti dalle tue pagine che non vengono caricati, solitamente perché il file è stato spostato o eliminato oppure perché il suo indirizzo web è stato digitato in modo errato. Quando un carattere non viene caricato, il testo utilizza un carattere sostitutivo e le tue pagine smettono di apparire come erano state progettate.

/* Se questo file di carattere manca, il testo viene visualizzato con un carattere sostitutivo */
@font-face {
  font-family: "Brand Sans";
  src: url("/fonts/brand-sans.woff2") format("woff2");
}

Perché è importante

La tipografia valorizza il tuo marchio. Quando un carattere personalizzato non viene caricato, il browser ne sostituisce silenziosamente un altro: il testo continua a essere visualizzato, ma la spaziatura cambia, i titoli hanno un aspetto errato e i caratteri delle icone possono trasformarsi in quadrati privi di significato o caratteri casuali, un problema molto più grave di una semplice imperfezione estetica.

Poiché esiste un carattere sostitutivo, i caratteri mancanti spesso non vengono notati dal team del sito per mesi. Nel frattempo, il browser di ogni visitatore perde tempo a richiedere il file e ad attendere il fallimento a ogni pagina che lo richiama.

Come risolvere il problema

Trova il riferimento al file mancante, in genere una regola @font-face nel tuo oppure un carattere caricato da un servizio di hosting dei caratteri.
Se il file è stato spostato, aggiorna il riferimento al nuovo indirizzo. Se il carattere è stato ritirato intenzionalmente, rimuovi la regola che lo richiama.
Se il file dovrebbe esistere, ripristinalo. I caratteri presentano un'ulteriore causa comune di problemi: le restrizioni cross-origin. Un carattere fornito da un altro dominio deve essere inviato con intestazioni permissive, altrimenti i browser rifiutano di utilizzarlo.
Dopo aver apportato le modifiche, testa la pagina e verifica che il testo venga visualizzato con il carattere previsto.

Come esegue i test Silktide

Carica ogni pagina in un browser reale e registra tutti i file richiesti dalla pagina.
Mantiene le richieste relative ai file di carattere.
Segnala ogni richiesta che non riesce a scaricare: una risposta di errore del server, come 404, o un errore di connessione. I timeout momentanei e le richieste abbandonate dal browser stesso non vengono segnalati, per evitare falsi allarmi.
Evidenzia il punto della pagina in cui viene fatto riferimento a ciascun file mancante.

Risoluzione dei problemi

Il file viene caricato quando provo ad aprirlo

Il file potrebbe essere protetto da un accesso, bloccato per i visitatori automatizzati oppure fornito in modo non coerente. Controlla anche la presenza di contenuti misti: un carattere richiesto tramite HTTP semplice da una pagina fornita tramite viene bloccato dal browser anche se il file esiste. Se il file funziona davvero correttamente, il risultato.

Il testo mi sembra corretto

I caratteri sostitutivi possono essere abbastanza simili da non far notare la sostituzione, soprattutto nel testo principale. Confronta un titolo con il design originale oppure controlla gli strumenti per sviluppatori del browser per individuare le richieste di caratteri non riuscite.