Le vieil adage dit qu '"une image vaut mille mots". C’est particulièrement vrai sur le Web, où la capacité d’attention est notoirement courte et où la bonne image peut réellement faire ou défaire un site en attirant l’attention appropriée et en engageant les visiteurs de la page suffisamment longtemps pour qu’ils sachent ce dont ils ont besoin pour apprendre ou effectuer un travail spécifique. action qui signale une "victoire" pour le site. Oui, en ce qui concerne un site Web, les images valent peut-être plus que mille mots!
Donc, avec l'importance des images en ligne, examinons maintenant ce que dit votre site Web si une image censée être sur le site ne se charge pas. Cela peut arriver si vous avez des images en ligne faisant partie du HTML ou des images d'arrière-plan appliquées avec CSS (et que votre site possède probablement les deux). En fin de compte, lorsqu'un graphique ne parvient pas à se charger sur une page, la conception est brisée et, dans certains cas, elle peut complètement détruire l'expérience utilisateur sur ce site. Les "mille mots" que la photo envoie ne sont certainement pas des positifs!
Examinons quelques-unes des raisons courantes pour lesquelles les images ne pourraient pas être chargées sur un site, ainsi que les éléments à prendre en compte lors du dépannage de ce problème lors du test du site Web.
Chemins de fichiers incorrects
Lorsque vous ajoutez des images à un fichier HTML ou CSS d'un site, vous devez créer un chemin d'accès à l'emplacement de ces fichiers dans votre structure de répertoires. C'est un code qui indique au navigateur où chercher et récupérer l'image. Dans la plupart des cas, il s’agit d’un dossier nommé "images". Si le chemin de ce dossier et les fichiers qu’il contient sont incorrects, les images ne se chargeront pas correctement car le navigateur ne pourra pas récupérer les fichiers appropriés. Il suivra le chemin que vous lui avez indiqué, mais il se retrouvera dans une impasse et, au lieu d'afficher l'image appropriée, sera vide.
L'étape 1 du débogage des problèmes de chargement d'images consiste à vérifier que le chemin du fichier que vous avez codé est correct. Peut-être avez-vous spécifié le mauvais répertoire ou n'avez-vous pas répertorié correctement le chemin d'accès à ce répertoire? Si ce n'est pas le cas, vous pouvez avoir un autre problème avec ce chemin. Continuer à lire!
Noms de fichiers mal orthographiés
Lorsque vous examinez les chemins de fichiers de vos fichiers, veillez également à épeler correctement le nom de l'image. D'après notre expérience, des noms incorrects ou des erreurs d'orthographe sont la cause la plus fréquente de problèmes de chargement d'images. N'oubliez pas que les navigateurs Web ne pardonnent pas les noms de fichiers. Si vous oubliez une lettre par erreur ou utilisez la mauvaise lettre, le navigateur ne cherchera pas un fichier similaire et dira: "oh, vous vouliez probablement dire celui-ci, n'est-ce pas?" Non - si le fichier est mal orthographié, même s'il est proche, il ne se chargera pas sur la page.
Mauvaise extension de fichier
Dans certains cas, le nom du fichier peut être orthographié correctement, mais son extension peut être incorrecte. Si votre image est un fichier .jpg, mais que votre code HTML recherche un fichier .png, il y aura un problème. Assurez-vous que vous utilisez le type de fichier correct pour chaque image, puis assurez-vous que vous avez appelé cette même extension dans le code de votre site Web.
Recherchez également la sensibilité à la casse. Si votre fichier se termine par .JPG, avec les lettres en majuscules, mais que votre code fait référence à .jpg, en minuscule, certains serveurs Web verront que ces deux noms sont différents, même s’ils sont identiques. La sensibilité à la casse compte! C'est pourquoi nous sauvegardons toujours nos fichiers avec toutes les lettres minuscules. Cela nous permet de toujours utiliser des minuscules dans notre code, éliminant ainsi un problème possible avec nos fichiers image.
Les fichiers sont manquants
Si les chemins d'accès à vos fichiers image sont corrects et si le nom et l'extension de fichier sont également exempts d'erreur, vous devez ensuite vérifier que les fichiers ont bien été téléchargés sur le serveur Web. Négliger de télécharger des fichiers sur ce serveur lors du lancement d'un site est une erreur commune et facile à négliger.
Comment réparez-vous ce problème? Téléchargez ces images, actualisez votre page Web et les fichiers doivent s'afficher immédiatement comme prévu. Vous pouvez également essayer de supprimer l'image sur le serveur et de la télécharger à nouveau. Cela peut sembler étrange, mais nous avons vu ce travail plus d’une fois. Parfois, les fichiers sont corrompus, alors cette méthode "supprimer et remplacer" peut aider.
Le site hébergeant les images est en panne
Vous voudrez généralement héberger toutes les images utilisées par votre site sur votre propre serveur, mais dans certains cas, vous utiliserez peut-être des images hébergées ailleurs. Si le site hébergeant l'image tombe en panne, vos images ne vont pas être chargées non plus.
Problème de transfert
Qu'un fichier image soit chargé depuis un domaine externe ou depuis le vôtre, il existe toujours un risque de problème de transfert pour ce fichier lors de sa première demande par le navigateur. Cela ne devrait pas être une occurrence courante (si c'est le cas, vous devrez peut-être chercher un nouveau fournisseur d'hébergement), mais cela peut arriver de temps en temps.
Le côté malheureux de cette question est qu’il n’ya vraiment rien que vous puissiez y faire car c’est un problème indépendant de votre volonté. La bonne nouvelle est qu’il s’agit d’un problème temporaire qui est souvent résolu assez rapidement. Par exemple, lorsque quelqu'un voit une page d'aspect cassé et le rafraichit, cela seul résoudra souvent le problème et chargera correctement les images. votre demande initiale.
Quelques notes finales
Lorsque vous réfléchissez aux images et aux problèmes de chargement, vous devez également tenir compte de l'utilisation appropriée des balises ALT ainsi que de la vitesse et des performances globales de votre site Web.
ALT, ou «texte alternatif», sont les balises affichées par un navigateur si le chargement d’une image échoue. Ils constituent également un élément important dans la création de sites Web accessibles pouvant être utilisés par des personnes présentant certains handicaps. Chaque image en ligne de votre site doit avoir une balise ALT appropriée. Notez que les images appliquées avec CSS ne possèdent pas cet attribut.
En ce qui concerne les performances du site Web, le chargement d'images trop nombreuses, voire de quelques images géantes mal optimisées pour la diffusion Web, aura un impact négatif sur la vitesse de chargement. Pour cette raison, veillez à tester l’impact des images que vous utilisez dans la conception de votre site et à prendre toutes les mesures nécessaires pour améliorer les performances de ce site tout en continuant de créer l’apparence générale appropriée pour votre projet de site Web.
