Il vecchio detto dice che "un'immagine vale più di mille parole". Questo slogan brilla sul web, dove l'attenzione spazia sono notoriamente brevi: l'immagine giusta può creare o distruggere un sito attirando la giusta attenzione e coinvolgendo la pagina visitatori.
Tuttavia, quando un elemento grafico non viene caricato, fa sembrare il design rotto e, in alcuni casi, può degradare l'esperienza dell'utente su quel sito. Le "mille parole" che invia l'immagine spezzata non sono certo positive!
1. Percorsi file errati
Quando aggiungi immagini a quelle di un sito HTML o CSS file, è necessario creare un percorso alla posizione nella struttura della directory in cui risiedono tali file. Questo è il codice che dice al browser dove cercare e recuperare l'immagine. Nella maggior parte dei casi, questo sarebbe all'interno di una cartella denominata immagini. Se il percorso di questa cartella e dei file al suo interno non sono corretti, le immagini non verranno caricate correttamente perché il browser non sarà in grado di recuperare i file corretti. Seguirà il percorso che gli hai detto, ma raggiungerà un vicolo cieco e, invece di visualizzare l'immagine appropriata, risulterà vuoto.
2. Nomi dei file errati
Mentre esamini il percorsi dei file per i tuoi file, verifica di aver digitato correttamente il nome dell'immagine. Nomi errati o errori di ortografia sono la causa più comune dei problemi di caricamento delle immagini.
3. Estensioni file errate
In alcuni casi, potresti avere il nome del file digitato correttamente, ma l'estensione del file potrebbe non essere corretta. Se la tua immagine è un .jpg file, ma il tuo HTML sta cercando un .png, ci sarà un problema. Usa il tipo di file corretto per ogni immagine e quindi fai riferimento a quella stessa estensione nel codice del tuo sito web.
Inoltre, cerca la distinzione tra maiuscole e minuscole. Se il tuo file termina con .JPG, con le lettere tutte in maiuscolo, ma il tuo codice fa riferimento a .jpg, all minuscolo, alcuni server Web vedono questi due come diversi, anche se sono gli stessi insiemi di lettere. La sensibilità alle maiuscole conta.
È buona norma salvare sempre i file con lettere tutte minuscole. Ciò ci consente di utilizzare sempre le lettere minuscole nel nostro codice, eliminando un possibile problema che potremmo avere con i nostri file di immagine.
4. File mancanti
Se i percorsi dei file immagine sono corretti e il nome e estensione del file sono anche privi di errori, controlla che i file siano stati caricati sul server web. Trascurare di caricare file su quel server quando viene lanciato un sito è un errore comune che è facile trascurare.
Carica quelle immagini, aggiorna la tua pagina web e dovrebbe immediatamente visualizzare i file come previsto. Puoi anche provare a eliminare l'immagine sul server e ricaricarla. A volte i file vengono danneggiati durante i trasferimenti (ad esempio, tramite testo anziché trasferimento binario durante FTP), quindi questo metodo "elimina e sostituisci" a volte aiuta.
5. Il sito Web che ospita le immagini è inattivo
Normalmente ospiterai da solo le immagini che il tuo sito utilizza server, ma in alcuni casi potresti utilizzare immagini ospitate altrove. Se il sito che ospita l'immagine non funziona, nemmeno le tue immagini verranno caricate.
6. Problemi di trasferimento
Se un file immagine viene caricato da un dominio esterno o dal tuo, c'è sempre la possibilità che ci possa essere un problema di trasferimento per quel file quando viene richiesto per la prima volta dal browser. Questo problema non dovrebbe essere un evento comune (se lo è, potrebbe essere necessario cercare un nuovo provider di hosting), ma può capitare di tanto in tanto.
Un motivo comune per questo problema tecnico è che il server è sopraffatto e non può servire tutte le risorse della pagina abbastanza rapidamente prima che la richiesta scada. Vedrai questo problema più comunemente con server Web virtuali con provisioning a basso costo che faticano a gestire siti più complicati e con molti script. Se questo problema si verifica frequentemente, valutare l'opportunità di aggiornare le capacità del server o trovare un nuovo host.
7. Problemi di database Database
Le moderne applicazioni web dinamiche, come WordPress, si basano su un database per archiviare informazioni su tutto ciò che è presente in un sito, comprese le immagini. Se il tuo sito non riesce a caricare le immagini, è possibile che il database stia riscontrando qualche problema.
Ci sono molti modi in cui possono verificarsi problemi di database. La tua applicazione potrebbe anche non essere connessa al database, perché è inattiva o irraggiungibile su un server diverso. Qualcosa potrebbe essere stato danneggiato nel database stesso o le informazioni sull'utente del database sono cambiate, disconnettendoti. Anche semplici modifiche alle impostazioni potrebbero innescare conseguenze indesiderate che alterano il database o lo rendono irraggiungibile. Controlla i log del server per vedere se il database potrebbe essere il colpevole.
Alcune note finali
Considera il uso corretto dei tag ALT e la velocità del tuo sito web e le prestazioni complessive.
I tag ALT, o "testo alternativo", sono ciò che viene visualizzato da un browser se un'immagine non viene caricata. Sono anche una componente importante nella creazione di siti Web accessibili che possono essere utilizzati da persone con determinate disabilità. Ogni immagine in linea nel tuo sito dovrebbe avere un tag ALT appropriato. Le immagini applicate con CSS non offrono questo attributo.