Comment réparer les images cassées dans WordPress : conseils pratiques

Les images jouent un rôle essentiel dans l'amélioration de l'expérience utilisateur et de l'engagement. Afficher des images cassées sur votre site WordPress nuit à votre image de marque ; il est donc crucial d'apprendre à les réparer.

Outre l'engagement, les images jouent également un rôle important dans le référencement d'un site web. Par conséquent, des images cassées peuvent nuire à la réputation globale de votre site. Mais rassurez-vous, il existe de nombreuses façons de détecter et de corriger les images cassées.

Bien que vous puissiez toujours vérifier la présence de liens fonctionnels sur votre site WordPress grâce au support WordPress, il est important de comprendre les bases de la réparation des images cassées. Aujourd'hui, nous allons explorer le problème des images cassées et comment les réparer facilement dans WordPress.

En bref : Guide de dépannage rapide pour les images de sites web corrompues

• Utilisez un plugin pour analyser votre site et trouver rapidement les fichiers multimédias manquants ou indisponibles.
• Vérifiez attentivement les chemins d'accès, les noms et les extensions des fichiers pour vous assurer qu'ils correspondent exactement.
• Réimportez ou remplacez directement les fichiers corrompus ou supprimés depuis la bibliothèque multimédia.
• Évitez les liens vers des images externes et conservez les fichiers sur votre serveur pour une meilleure fiabilité et une plus grande rapidité.

Qu'est-ce qu'une image endommagée et pourquoi est-il important de la réparer ?

En clair, une image cassée renvoie vers un lien indisponible ou corrompu. Lorsqu'un utilisateur clique sur une image cassée, il obtient soit une erreur 404, soit une icône d'image cassée, indiquant que l'image est indisponible. C'est l'une des erreurs WordPress.

Comme indiqué précédemment, une image cassée est un problème majeur sur votre site web. Par exemple, si vous avez une boutique en ligne ou un site web d'hôtellerie-restauration qui repose en grande partie sur les images de produits, les utilisateurs s'attendent à des visuels de haute qualité.

Si un utilisateur trouve une image cassée, cela peut nuire à votre activité et dégrader l'expérience utilisateur. Non seulement les utilisateurs, mais aussi les robots de Google peuvent analyser votre site web à la recherche de liens brisés et le signaler comme non fiable ou spammé en raison d'images cassées. Cela affecte également la conception responsive de votre site WordPress.

Ainsi, la présence d'images ou de liens brisés sur votre site web peut nuire à sa crédibilité et à son image de marque. Il est donc important d'effectuer une maintenance régulière de votre site, de vérifier la présence d'images ou de liens briséset de les corriger immédiatement.

De nombreux propriétaires de sites rencontrent également des problèmes avec les images JPEG, notamment lorsque ces fichiers sont corrompus ou renommés accidentellement.

Comment détecter les images cassées dans WordPress ?

Maintenant que vous comprenez les liens brisés et leur impact sur la réputation de votre site WordPress, il est impératif de détecter les images cassées.

Bien qu'il existe de nombreuses façons de vérifier les liens brisés sur votre site web, la plus simple consiste à utiliser l' extension WordPress Broken Link Checker.

Ce plugin vous permet de vérifier facilement la présence d'images cassées ou de liens brisés sur votre site WordPress et de corriger les images endommagées. Il existe une version gratuite et une version premium. La version gratuite permet une analyse manuelle, tandis que la version premium offre des fonctionnalités plus avancées.

Pour commencer la détection des images et des liens brisés :

• Installez et activez le plugin de vérification des liens brisés dans WordPress

• Après avoir installé l'extension, rendez-vous sur la page de vérification des liens brisés, sélectionnez « Analyse des liens brisés » et cliquez sur « Lancer une nouvelle analyse »

• Le plugin va analyser votre site web à la recherche de liens brisés. Vous pouvez suivre le nombre de pages et d'articles analysés dans la barre de progression

• Une fois l'analyse terminée, vous obtiendrez une liste de tous les liens brisés, ce qui vous permettra de corriger les images cassées dans WordPress.

Ces analyses vous aident à identifier rapidement les fichiers image manquants qui ont pu être déplacés, supprimés ou mal liés lors de mises à jour ou de migrations.

Vous pouvez également utiliser l'outil de vérification des liens brisés de Seahawk Media, qui fait partie de nos outils de test gratuits, ou faire appel à nos développeurs WordPress pour obtenir des résultats rapides.

À lire aussi: Comment optimiser les images et améliorer la vitesse de votre site web

Comment réparer les images cassées dans WordPress ?

Avant de voir comment réparer les images cassées dans WordPress, examinons quelques-unes des raisons de ce problème.

Examinons les problèmes pouvant entraîner l'affichage d'images cassées dans WordPress :

• Chemin d'accès au fichier image incorrect.
• Fichier image corrompu.
• Incompatibilité de format d'image (par exemple, le fichier image est au format .jpg, mais le code l'identifie comme étant au format .png).
• Modifications apportées au nom du fichier image.
• Des fichiers sont supprimés ou manquants sur le serveur (cela se produit souvent lors de la migration d'un site).

Voici quelques raisons possibles pour lesquelles des images sont cassées sur votre site web. Voyons comment résoudre ces problèmes, corriger les images cassées dans WordPress et réduire le taux de rebond.

Lire : Pourquoi votre WordPress est-il lent ?

Chemin de fichier incorrect

WordPress génère un chemin d'accès pour spécifier l'emplacement d'une image lorsque vous l'ajoutez à votre site web. Les navigateurs utilisent ce chemin dans l'attribut `src` de l'image pour la localiser et l'afficher. Si le chemin est incorrect, l'image ne s'affichera pas et le temps de chargement sera plus long.

Une simple faute de frappe dans le chemin d'accès d'un fichier JPEG peut instantanément corrompre l'image. Vérifiez donc attentivement l'arborescence des répertoires avant de la modifier. Pour résoudre ce problème, trouvez la publication ou la page contenant l'icône d'image cassée et remplacez-la par une autre image.

Voici comment :

• Connectez-vous à votre tableau de bord WordPress.
• Accédez à la publication ou à la page contenant l'image cassée.
• Survolez la publication et sélectionnez « Modifier »
• Dans l'éditeur de publication, faites défiler jusqu'à la section contenant l'image cassée.
• Cliquez sur l'image cassée, puis sélectionnez « Remplacer »
• Choisissez une image dans votre bibliothèque multimédia ou téléchargez une nouvelle image.
• Cliquez sur « Mettre à jour » pour enregistrer vos modifications.

Remplacement des images HTML personnalisées

Si vous ajoutez une image à l'aide de code HTML ou CSS personnalisé, vous devez vous assurer que le chemin d'accès est correct. Voici comment le vérifier et le corriger, notamment s'il se trouve dans le bloc CSS additionnel :

• Connectez-vous à votre tableau de bord WordPress. Allez dans Apparence ⟶ Personnaliser.

• Sélectionnez le bloc CSS additionnel ou le menu CSS personnalisé.

• Dans l'éditeur de code, repérez la ligne de code où la photo a été ajoutée et mettez en surbrillance le chemin d'accès à l'image.

• Faites un clic droit et sélectionnez « Accéder au fichier ». Si l’image est indisponible, une erreur 404 (Introuvable) s’affichera.

• Téléversez à nouveau l'image sur votre site web : accédez à Média ⟶ Ajouter. Cliquez sur « Sélectionner des fichiers » et sélectionnez le fichier image. Une fois le téléversement terminé, cliquez sur « Copier l'URL dans le presse-papiers »

• Retournez à la page de personnalisation et remplacez le lien de l'image cassée par la nouvelle URL que vous avez copiée. Cliquez sur « Publier » pour enregistrer vos modifications.

Les fichiers image corrompus ajoutés via du code HTML ou CSS personnalisé sont particulièrement fréquents ; assurez-vous donc toujours que le fichier se trouve dans le bon dossier de téléchargement.

À ne pas manquer: Tâches de maintenance WordPress

Vérifiez les noms de fichiers

Une cause fréquente d'images cassées et de problèmes de chargement est une incohérence dans les noms de fichiers. Vous devez vérifier l'orthographe du fichier image dans votre code pour vous assurer qu'il correspond exactement à celui de la bibliothèque de médias et ainsi corriger les images cassées dans WordPress.

Voyons comment nous pouvons résoudre ce problème :

• Connectez-vous à votre tableau de bord WordPress.
• Accédez à Média ⟶ Bibliothèque.
• Utilisez le champ de recherche pour trouver l'image que vous souhaitez comparer.
• Passez votre souris sur l'image et sélectionnez « Afficher »
• Vérifiez la barre d'adresse pour trouver le chemin d'accès à l'image. La partie en surbrillance correspond au nom du fichier image.

Maintenant, passez à la publication contenant l'image cassée :

• Ouvrez la page dans votre navigateur.
• Faites un clic droit sur l'image cassée et sélectionnez « Ouvrir l'image dans un nouvel onglet »
• Comparez le nom du fichier dans la barre d'adresse avec celui de la bibliothèque multimédia.

S'il subsiste des divergences dans les noms de fichiers, l'image risque de ne pas s'afficher, ce qui entraînera une 404 Not Found erreur.

C’est souvent le cas avec un fichier JPEG qui a été renommé manuellement sans que la référence du fichier dans WordPress ait été mise à jour.

• Modifiez la publication contenant l'image cassée.
• Remplacez le nom de fichier incorrect par le nom correct provenant de la bibliothèque multimédia
• Mettez à jour la publication pour enregistrer vos modifications.

Si l'image ne s'affiche toujours pas, téléchargez-la à nouveau et ajoutez-la à votre publication. N'oubliez pas de mettre à jour la publication pour enregistrer les modifications. Le problème devrait alors être résolu et l'image devrait s'afficher correctement.

Apprenez: Comment réparer un backend WordPress

Extensions de fichiers incorrectes

Il est important de bien vérifier l'extension de vos fichiers image. Même si le nom du fichier est correct, une extension incorrecte peut causer des problèmes.

Vérifiez toujours si votre fichier JPEG utilise l'extension « .jpeg » ou « .jpg », car des extensions différentes peuvent empêcher le navigateur de charger l'image.

Par exemple, vous pourriez télécharger un fichier image .jpg, mais le code le référence comme un fichier .png. Cette incohérence empêchera le chargement de l'image.

Un autre problème courant concerne les extensions « jpg » et « jpeg ». Bien que ces formats d’image soient identiques, utiliser l’un au lieu de l’autre peut entraîner une erreur d’affichage de l’image.

Assurez-vous que l'extension de fichier dans votre code corresponde exactement à celle de votre bibliothèque multimédia afin d'éviter tout problème.

Utilisez un chemin de fichier relatif

L'utilisation d'un chemin de fichier relatif permet de créer un lien vers un fichier en fonction de son emplacement par rapport à l'URL de la page d'accueil. Dans WordPress, un chemin relatif omet le nom de domaine et ne conserve que la partie du chemin qui suit le domaine.

Par exemple, dans l'attribut « src », au lieu d'utiliser

« https://example.com/wp-content/uploads/image.png, vous pouvez utiliser « /wp-content/uploads/image.png »

Ce lien plus court fonctionnera parfaitement pour vos images.

L'un des avantages de l'utilisation d'un chemin relatif est que vos images resteront accessibles même si vous changez de nom de domaine, à condition que les fichiers restent hébergés sur le même serveur. Cette approche offre une grande flexibilité et garantit l'accessibilité de vos images malgré les changements de domaine.

Lecture suggérée: Comment transférer un site WordPress vers un nouveau domaine

Vérifier si l'image existe

Il peut arriver que vous créiez un lien vers une image hébergée sur un autre site web. Si ce site est hors service ou migre vers un autre serveur, vos images ne seront plus disponibles.

De plus, un lien direct vers un autre site augmente la charge serveur du site hébergeant l'image. Si ce site désactive le hotlinking, votre image ne s'affichera pas.

• Pour éviter ces problèmes, il est préférable de télécharger chaque image sur votre site web avant de l'ajouter à une page.

• Évitez également d'utiliser des images provenant de sites web tiers sans leur autorisation. Cela garantit la disponibilité permanente de vos images et réduit le risque de liens brisés.

Bien que rares, des problèmes de transfert peuvent survenir. Il arrive que votre serveur soit surchargé et ne puisse pas charger tous les éléments de la page assez rapidement avant l'expiration du délai de la requête. Ce problème est plus fréquent avec les serveurs web à bas prix.

Pour résoudre ce problème, envisagez d'augmenter la capacité de votre serveur ou de migrer vers un hébergeur web plus fiable. Activer le chargement différé des images peut également s'avérer utile.

Lorsque le chargement différé est activé, votre serveur ne charge les images que lorsque l'utilisateur fait défiler la page jusqu'à la section correspondante. Cela réduit la charge du serveur et accélère votre site web.

Causes fréquentes d'images cassées dans WordPress

Examinons quelques-unes des raisons les plus courantes pour lesquelles les URL d'images ne se chargent pas et comment résoudre ces problèmes.

• URL d'images incorrectes: L'une des causes les plus fréquentes d'images manquantes est la présence d'URL d'images incorrectes ou obsolètes. Ce problème survient souvent après une migration de site ou un changement de domaine. Si la structure des URL de votre site a été modifiée sans que les liens vers les images aient été correctement configurés, certaines images risquent de ne plus s'afficher.

• Problèmes d'autorisations de fichiers: Si vos fichiers image ne disposent pas des autorisations appropriées, les navigateurs ne pourront pas y accéder. Cela peut entraîner des vignettes cassées ou l'impossibilité de charger les images des produits. Assurez-vous que vos images sont lisibles par le serveur ; généralement, les autorisations 644 sont correctement configurées pour les fichiers image.

Il arrive que votre serveur bloque l'accès aux fichiers image lorsque les autorisations sont trop strictes, ce qui entraîne l'affichage de vignettes cassées sur l'ensemble de votre site.

• Paramètres médias mal configurés: Il arrive que le problème provienne des paramètres médias de WordPress. Si le chemin d’accès à votre dossier d’upload est incorrect ou ne correspond pas à la structure de votre site, les images ne s’afficheront pas à l’emplacement prévu.

• Problèmes liés au fichier .htaccess: Le fichier .htaccess contrôle de nombreux aspects du fonctionnement de votre site. Une erreur dans ce fichier, comme une redirection mal configurée ou des règles d'accès bloquées, peut empêcher le chargement des images. Effectuez toujours une sauvegarde avant de modifier ce fichier et vérifiez soigneusement toute modification.

• Paramètres CDN incorrects: Vous utilisez un réseau de diffusion de contenu (CDN)? C’est excellent pour la vitesse, mais seulement si vos paramètres CDN sont correctement configurés. S’ils pointent vers des chemins d’accès anciens ou incorrects, ou si les versions en cache sont obsolètes, les images risquent de ne pas s’afficher.

Les versions mises en cache d'un fichier JPEG stockées sur votre CDN peuvent également provoquer des problèmes d'affichage jusqu'à ce que le cache soit entièrement purgé.

Lire: Les meilleurs services d'optimisation de vitesse WordPress

Conclure

Il est important de veiller à ce que votre site web ne contienne aucune image cassée afin de préserver votre réputation, de fidéliser vos utilisateurs et d'améliorer votre référencement. Comme expliqué précédemment, il existe différentes manières de détecter et de corriger les images cassées dans WordPress.

Si vous préférez réparer vous-même les images cassées dans WordPress, commencez par identifier la cause. Il peut s'agir d'un chemin d'accès au fichier endommagé ou incorrect. Une fois la cause identifiée, vous pouvez la corriger en restaurant, remplaçant ou supprimant l'image.

Un site web sans images cassées améliore non seulement l'expérience utilisateur, mais aussi votre référencement. Un seul fichier JPEG corrompu peut perturber la mise en page, ralentir le chargement ou créer des espaces réservés défectueux, ce qui nuit à la confiance des utilisateurs.

FAQ sur la réparation des images cassées dans WordPress