Pensez à la dernière fois que vous avez téléchargé une image sur votre site Web. Il y a de fortes chances que vous l’ayez téléchargé à partir d’un site de photographie de stock, que vous l’ayez téléchargé sur le backend de votre site, puis que vous l’ayez inséré dans la page.
C’est un brillant exemple d’optimisation d’image, n’est-ce pas ? Pas assez.
Vous avez ajouté un poids de boule de bowling géant à votre site qui ralentit la vitesse de la page. Et les moteurs de recherche ne peuvent pas lire vos images sans texte alternatif.
Changeons cela.
Selon les données 2018 de Jumpshot, plus de 20 % de toutes les recherches Web américaines sont effectuées sur Google Images.
Les amateurs et les professionnels du référencement savent que l’optimisation des images pour votre site Web vaut notoirement le temps passé.
Dan Morgan de WebSpection a obtenu qu’une de ses photos se classe n°1 dans Google Images pour la « meilleure personne de Cardiff » en moins de quatre jours en optimisant son image.
Et Robbie Richards a généré 150 732 visites en ajoutant des balises alt d’image, en compressant des images et quelques autres astuces SEO.
Sans une optimisation appropriée de l’image, vous gaspillez un précieux atout SEO.
C’est comme si les moteurs de recherche offraient gratuitement des Oreos et du lait. Mais, vous ne prenez que l’Oreo. Alors qu’en réalité, l’Oreo est bien meilleur trempé dans du lait.
L’optimisation des images crée de nombreux avantages tels qu’une meilleure expérience utilisateur, des temps de chargement de page plus rapides et des opportunités de classement supplémentaires. Et cela devient un rôle de plus en plus important.
Comme l’a souligné Matt Southern, la déclaration de Gary Illyes sur la recherche d’images dans un récent chat Reddit :
« Nous savons simplement que la recherche de médias est bien trop ignorée pour ce qu’elle est capable de faire pour les éditeurs, nous y envoyons donc plus d’ingénieurs ainsi qu’une plus grande portée. »
Mais quels facteurs sont les plus importants pour s’assurer que vos images sont trouvables et ne ralentissent pas votre site ?
Voici 12 conseils importants d’optimisation d’image que vous devez connaître.
1. Choisissez le bon format
Décoder tous les différents formats d’image peut ressembler à votre première commande chez Taco Bell. Mais, avant de commencer à ajouter des images à votre site, vous devez vous assurer que vous avez choisi le meilleur type de fichier.
Bien qu’il existe de nombreux formats d’image parmi lesquels choisir, les formats PNG et JPEG sont les plus courants pour le Web.
- PNG : produit des images de meilleure qualité, mais est livré avec une taille de fichier plus grande.
- JPEG : vous risquez de perdre en qualité d’image, mais vous pouvez ajuster le niveau de qualité pour trouver un bon équilibre.
- WebP : choisissez la compression sans perte ou avec perte en utilisant ce format d’image, le seul pris en charge par Chrome et Firefox.
Pour moi, PNG est le héros méconnu du formatage d’image. Mais, pour mon utilisation quotidienne, PNG est la voie à suivre, puis convertissez-les en WebP.
Soyez prudent si vous utilisez des images .jpg dans un format SVG intégré, car les systèmes de Google ne peuvent pas les indexer.
2. Compressez vos images
Oui, l’enfer n’a pas de fureur comme une page Web gonflée après avoir téléchargé une image qui n’est pas compressée.
Les moteurs de recherche regarderont votre page Web comme vous pourriez regarder une grande cuve de Crisco : vous ne pouvez pas sérieusement envisager de mettre cela sur votre site Web, n’est-ce pas ?
Selon HTTP Archive, les images représentent en moyenne 21 % du poids total d’une page Web.
C’est pourquoi je vous recommande fortement de compresser vos images avant de les télécharger sur votre site. Vous pouvez le faire dans Photoshop ou vous pouvez utiliser un outil comme TinyPNG.
TingPNG a également un plugin WordPress que vous pouvez également utiliser.
Cependant, je préfère WP Smush comme plugin WordPress. Il réduit la taille du fichier image sans supprimer la qualité.
Quel que soit le plugin que vous utilisez, assurez-vous d’en trouver un qui compresse les images en externe sur leurs serveurs. Cela réduit la charge sur votre propre site.
Ou allez plus loin et utilisez un CDN d’image qui détecte l’appareil et optimise l’image avant la livraison. Cloudinary et Imgix sont deux options à essayer.
De plus en plus.com a amélioré la vitesse de son site Web de 33 %/2 secondes en compressant les images.
Je veux dire, il y a juste quelque chose de sexy dans la vitesse de page plus rapide lorsque vous compressez vos images.
Si vous ne savez pas comment vos images affectent la vitesse de votre page, je vous recommande d’utiliser l’outil PageSpeed Insights de Google.
3. Créez des images uniques
Vous voulez que vos photos apparaissent sur votre site. Si vous remplissez votre site Web d’images d’archives, vous n’aurez pas l’air original – comme des milliers d’autres sites qui ne se démarquent pas.
Trop de sites Web sont encombrés avec les mêmes photos génériques.
Pensez à un site Web d’entreprise, une société de conseil, une entreprise qui se targue de service à la clientèle. Tous ces sites Web utilisent pratiquement la même image de stock d’un homme d’affaires souriant.
Je suis sûr que vous en avez vu un qui ressemble à ceci :
Bien que vos images de stock puissent être parfaitement optimisées, elles n’auront pas le même impact ni les avantages potentiels du référencement qu’une image originale de haute qualité.
Plus vous avez de photos originales, meilleure est l’expérience de l’utilisateur et meilleures sont vos chances de vous classer dans les recherches pertinentes.
Gardez à l’esprit que les grandes images sont plus susceptibles d’être présentées dans Google Discover.
Comme Google le recommande dans sa ressource SEO avancée,
« Les grandes images doivent être au moins 1200 pixels large et activé par le paramètre max-image-preview:large ou en utilisant AMP.
N’utilisez pas votre logo comme image.
4. Méfiez-vous des droits d’auteur
Quels que soient les fichiers image que vous choisissez d’utiliser, assurez-vous qu’il n’y a pas de conflit de droits d’auteur.
Le service postal paie 3,5 millions de dollars dans le cadre d’un procès pour droit d’auteur sur l’image. Et, Skechers a été poursuivi pour 2,5 millions de dollars.
Si Getty, Shutterstock, DepositFiles ou un autre fournisseur de photos possède une image que vous utilisez et que vous n’avez pas de licence pour l’utiliser, vous risquez une poursuite coûteuse.
En vertu du Digital Millennium Copyright Act (DMCA), vous pourriez recevoir un avis si vous avez violé des problèmes de droit d’auteur. Si le propriétaire d’un élément de contenu voit son contenu sur votre site Web, il peut émettre un retrait DMCA auquel vous devez vous conformer.
Google Images vous permet de filtrer les résultats en fonction de ceux disponibles pour la réutilisation, et Mindy Weinstein partage 41 sites Web différents pour trouver des images gratuites.
5. Personnalisez les noms de fichiers d’image
En matière de référencement, la création de noms de fichiers descriptifs et riches en mots clés est absolument cruciale.
Ne pas personnaliser le nom de votre fichier image, c’est comme obtenir un burrito sans rien dedans. C’est tout simplement nul.
Les noms de fichiers image alertent Google et les autres robots des moteurs de recherche sur le sujet de l’image.
En règle générale, les noms de fichiers ressembleront à « IMG_722019 » ou quelque chose de similaire. C’est comme commander à partir d’un menu dans une langue différente. Cela n’aide pas Google.
Modifiez le nom de fichier par défaut pour aider les moteurs de recherche à comprendre votre image et à améliorer votre valeur SEO.
Cela implique un peu de travail, selon l’étendue de votre bibliothèque multimédia, mais changer le nom de l’image par défaut est toujours une bonne idée.
Imaginons que vous ayez une image de chocolat par exemple.
Je pourrais l’appeler simplement « chocolat », mais si vous vendez du chocolat sur votre site Web, chaque image peut potentiellement être nommée « chocolat-1 », « chocolat-2 », etc.
J’ai nommé cette image « café au chocolat noir » pour permettre aux utilisateurs et aux moteurs de recherche de comprendre l’image.
6. Rédigez un texte alternatif optimisé pour le référencement
Les balises Alt sont une alternative textuelle aux images lorsqu’un navigateur ne peut pas les afficher correctement. Semblable au titre, l’attribut alt est utilisé pour décrire le contenu d’un fichier image.
Lorsque l’image ne se charge pas, vous obtenez une zone d’image avec la balise alt présente dans le coin supérieur gauche. Assurez-vous qu’ils correspondent à l’image et rendez l’image pertinente.
Prêter attention aux balises alt est également bénéfique pour la stratégie globale de référencement sur la page. Vous voulez vous assurer que toutes les autres zones d’optimisation sont en place, mais si l’image ne se charge pas pour une raison quelconque, les utilisateurs verront ce que l’image est censée être.
De plus, l’ajout de balises alt appropriées aux images de votre site Web peut aider votre site Web à obtenir un meilleur classement dans les moteurs de recherche en associant des mots-clés aux images. Même Google a remarqué la valeur du texte alternatif dans les images.
Il fournit à Google des informations utiles sur le sujet de l’image. Nous utilisons ces informations pour aider à déterminer la meilleure image à renvoyer pour la requête d’un utilisateur.
Le texte alternatif est requis en vertu de la loi américaine sur les personnes handicapées pour les personnes qui ne peuvent pas voir les images elles-mêmes. Un texte alternatif descriptif peut alerter les utilisateurs sur le contenu exact de la photo. Par exemple, disons que vous avez une photo de chocolat sur votre site Web.
Le texte alternatif pourrait lire :
Cependant, un meilleur texte alternatif décrivant l’image se lirait :
Le texte alternatif est visible dans la version texte en cache de la page, ce qui contribue à son avantage pour les utilisateurs et les moteurs de recherche. Pour une valeur SEO supplémentaire, le texte alternatif peut servir de texte d’ancrage d’un lien interne lorsque l’image renvoie à une autre page du site.
7. Pensez à la structure du fichier image
Google a mis à jour ses directives relatives aux images. L’une des principales mises à jour qu’ils ont révélées était qu’ils utilisaient le chemin et le nom du fichier pour classer les images.
Répéter: Le chemin d’accès au fichier et le nom du fichier sont un facteur de classement réel.
Par exemple, si vous êtes une marque de commerce électronique avec plusieurs produits, au lieu de placer toutes vos images de produits dans un dossier générique /media/, je vous recommanderais de structurer vos sous-dossiers en plusieurs sujets liés à des catégories comme /shorts/ ou /denim/.
8. Optimisez le titre et la description de votre page
Google a également révélé qu’il utilise le titre et la description de votre page dans le cadre de son algorithme de recherche d’images.
La page d’assistance de Google indique :
Tous vos facteurs SEO de base sur la page tels que les métadonnées, les balises d’en-tête, la copie sur la page, les données structurées, etc. affectent la façon dont Google classe vos images.
C’est comme mettre toutes vos garnitures sur votre burrito. C’est bien meilleur avec du guac. Alors, assurez-vous d’ajouter le guac pour améliorer le classement des images.
9. Définissez vos dimensions
Si vous utilisez AMP ou PWA, vous devez définir les dimensions de votre image dans le code source.
Cependant, si vous n’utilisez ni l’un ni l’autre, il est toujours recommandé de définir la largeur et la hauteur. Il offre une meilleure expérience utilisateur.
De plus, il permet aux navigateurs de dimensionner l’image avant le chargement du CSS. Cela empêche la page de sauter lors du chargement.
Les attributs de dimension d’image sont également importants pour éviter les problèmes de changement de mise en page cumulé (CLS) qui peuvent interférer avec l’optimisation de votre Core Web Vitals.
Il est essentiel de s’assurer que vous incluez des attributs de largeur et de hauteur pour chaque élément d’image et de vidéo.
Cela indique au navigateur la quantité d’espace à allouer à la ressource et empêche ce changement de contenu ennuyeux qui réduit votre score CLS. En savoir plus ici.
10. Rendez vos images adaptées aux mobiles
Oh, le référencement mobile. Au pire, cela peut vous donner un taux de rebond élevé et de faibles conversions. Mais, au mieux, cela peut vous donner plus de puissance de classement et un meilleur engagement des utilisateurs.
Le problème est de savoir comment optimiser vos images pour l’index mobile-first ?
Heureusement, Google propose des conseils sur les meilleures pratiques pour les images.
En bref, vous voulez créer des images réactives. Cela signifie que l’image s’adaptera à la taille du site, que l’utilisateur utilise un ordinateur de bureau ou un mobile. Il s’adapte à la taille de l’appareil.
Mozilla propose un guide complet sur l’utilisation des attributs srcset et tailles pour fournir au navigateur des images source supplémentaires, permettant l’affichage d’un contenu d’image identique redimensionné pour l’appareil.
Il est important de formater cela avec une partie différente de la valeur de l’attribut sur chaque ligne, comme illustré dans cet exemple à partir de leur ressource :
<img srcset="elva-fairy-480w.jpg 480w,
elva-fairy-800w.jpg 800w”
tailles = « (largeur maximale : 600px) 480px,
800px »
src= »elva-fée-800w.jpg »
alt=”Elva déguisée en fée”>
En savoir plus sur l’utilisation de srcset pour les images réactives ici.
11. Ajoutez des images à votre plan de site
Que vous ajoutiez vos images à votre sitemap ou que vous créiez un nouveau sitemap pour les images, vous voulez des images quelque part dans vos sitemaps.
Avoir vos images dans un sitemap augmente considérablement les chances que les moteurs de recherche explorent et indexent vos images. Ainsi, il en résulte plus de trafic sur le site.
Si vous utilisez WordPress, Yoast et RankMath proposent une solution de sitemap dans leur plugin.
12. Ajouter des données structurées
Les données structurées balisent vos types de contenu pour guider Google et les moteurs de recherche afin de fournir de meilleurs résultats visuels. Essentiellement, Google pourrait servir vos images comme un résultat riche si vous ajoutez des données structurées.
Par exemple, si vous utilisez le balisage de schéma sur une page de produit et que vous étiquetez l’image en tant que produit, Google pourrait associer cette image à une étiquette de prix. Les moteurs de recherche ignorent l’algorithme et utilisent les informations fournies dans les données structurées pour fournir la bonne image.
Points clés de l’optimisation d’image
Ainsi, avant de commencer à télécharger votre image sur votre site, assurez-vous de suivre les rituels d’optimisation d’image ci-dessus.
La chose la plus importante est de s’assurer que l’image et le texte alternatif sont pertinents pour la page. Autres plats à emporter:
- Choisissez le bon format de fichier. Les PNG sont mes préférés pour les captures d’écran.
- Réduisez la taille du fichier pour accélérer le chargement des pages.
- Assurez-vous que vos éléments de référencement sur la page (métadonnées, données structurées, etc.) s’associent à votre image.
- Pour faciliter l’exploration, créez un sitemap d’image ou assurez-vous que vos images figurent dans votre sitemap.
L’optimisation des images n’est pas une blague. Avec les progrès de la technologie de recherche vocale, les médias revêtent une importance croissante et l’ensemble de votre site bénéficiera des étapes ci-dessus.
Bonne optimisation !
Image en vedette : Paulo Bobita/Journal des moteurs de recherche
Toutes les captures d’écran sont prises par l’auteur
