1. Utiliser une image \u00e0 forte valeur ajout\u00e9e<\/h2>\n
La premi\u00e8re \u00e9tape pour r\u00e9f\u00e9rencer une image<\/strong> est de trouver un visuel de qualit\u00e9 qui :<\/p>\n Vous pensez peut-\u00eatre aux banques d\u2019images pour vous fournir des visuels \u00e0 int\u00e9grer dans vos contenus. Cependant, ces sites pr\u00e9sentent 2 probl\u00e8mes majeurs :<\/p>\n En revanche, les illustrations \u00e9labor\u00e9es \u00e0 partir de donn\u00e9es internes ou les photos de haute qualit\u00e9 de vos produits \/ services en action sont parfaites. En plus de se distinguer lorsqu\u2019elles apparaissent dans la recherche des internautes, elles permettent d\u2019identifier imm\u00e9diatement votre marque.<\/p>\n C\u2019est un bon point pour le r\u00e9f\u00e9rencement et votre image ! Ces visuels personnalis\u00e9s auront aussi plus de chances d\u2019\u00eatre affich\u00e9s pendant des recherches invers\u00e9es, \u00e0 partir de vos propres images.<\/p>\n Si vous avez besoin d\u2019aide pour la cr\u00e9ation de visuels li\u00e9s \u00e0 votre charte graphique, pensez \u00e0 faire appel \u00e0 un graphiste freelance <\/a>!<\/p>\n Pour mieux r\u00e9f\u00e9rencer une image sur Google<\/strong>, veillez \u00e0 choisir un format pl\u00e9biscit\u00e9 par le moteur de recherche.<\/p>\n Si les PNG et JPEG restent les plus utilis\u00e9s, c\u2019est le format Webp qui tend \u00e0 prendre de l\u2019importance sur les navigateurs Chrome, Edge, Firefox et Opera. On le rappelle : ce format a \u00e9t\u00e9 cr\u00e9\u00e9 par Google. Vous comprendrez donc que l\u2019entreprise de Mountain View \u00ab r\u00e9compense \u00bb les sites qui l\u2019utilisent\u2026<\/p>\n Plus l\u00e9ger et qualitatif, ce format permet d’acc\u00e9l\u00e9rer les temps de chargement et de r\u00e9duire l’utilisation des donn\u00e9es sur les smartphones.<\/p>\n Alors, si vous \u00eates en train de refondre votre site internet ou si vous cherchez une solution pour booster la vitesse de vos pages, une conversion de vos images .jpg ou .png en .webp s\u2019av\u00e8re \u00eatre une piste \u00e0 explorer.<\/p>\n Les images repr\u00e9sentent, en moyenne, 21% du poids d\u2019une page web : leur taille influence la vitesse de votre site<\/a> (et donc son classement dans les pages de r\u00e9sultat).<\/p>\n Et ce n\u2019est pas tout : des visuels volumineux augmentent le taux de rebond et diminuent l\u2019engagement. Ce qui p\u00e8se aussi sur le SEO de votre contenu en g\u00e9n\u00e9ral, images incluses.<\/p>\n Bon \u00e0 savoir : nous vous conseillons d\u2019uploader des images entre 100 et 130 ko maximum. D\u2019o\u00f9 l\u2019int\u00e9r\u00eat d\u2019utiliser le format Webp, qui pr\u00e9serve la qualit\u00e9 des images, tout en diminuant leurs poids de 25% \u00e0 30%.<\/p>\n En ce qui concerne les dimensions, vous avez s\u00fbrement remarqu\u00e9 que les images r\u00e9f\u00e9renc\u00e9es dans les r\u00e9sultats de recherche sont en format paysage. Le moteur de recherche ne donne pas de directives claires \u00e0 cet \u00e9gard, mais il est recommand\u00e9 d’utiliser des images qui s’adaptent \u00e0 votre page sans laisser d’espace blanc g\u00eanant autour.<\/p>\n Vous le savez, quand on parle de r\u00e9f\u00e9rencement, on \u00e9voque souvent les sacro-saints mots-cl\u00e9s ! Vouloir r\u00e9f\u00e9rencer une image n\u2019\u00e9chappe pas \u00e0 cette r\u00e8gle : nommez vos fichiers avec les mots-cl\u00e9s utilis\u00e9s dans votre strat\u00e9gie SEO.<\/p>\n Par exemple, si votre article parle des coupes de cheveux tendance en 2025, que l\u2019expression cl\u00e9 travaill\u00e9e est \u00ab tendances cheveux 2025 \u00bb pensez \u00e0 nommer vos photos ainsi :<\/p>\n N’h\u00e9sitez pas \u00e0 varier pour \u00eatre certain de toucher toutes les mani\u00e8res qu’auront les internautes de r\u00e9diger la requ\u00eate cibl\u00e9e.<\/p>\n Sachez \u00e9galement qu\u2019il faut :<\/p>\n Le chemin d’acc\u00e8s vers les visuels est pris en compte pour r\u00e9f\u00e9rencer une image sur Google.<\/p>\n Prenons l\u2019exemple d\u2019un e-commerce de v\u00eatements. Au lieu d\u2019uploader toutes les photos dans un dossier g\u00e9n\u00e9rique \/media\/, il est recommand\u00e9 de structurer les sous-dossiers en cat\u00e9gorie, et donc en mots-cl\u00e9s : par exemple \u00ab \/pantalons-homme\/ \u00bb ou \u00ab \/robe-soiree\/ \u00bb.<\/p>\n La balise \u00ab alt text \u00bb est, comme son nom l\u2019indique, un petit texte qui appara\u00eet \u00e0 la place d’une image si celle-ci ne parvient pas \u00e0 se charger dans un navigateur. Cette description s’affiche parfois lorsque la souris survole le fichier, comme dans cet exemple :<\/p>\n Le r\u00f4le principal de cette balise est d’am\u00e9liorer l’accessibilit\u00e9 de votre site, tout en aidant Google \u00e0 comprendre le contexte. Comme elle d\u00e9crit le contenu de l\u2019image, c\u2019est l\u2019endroit id\u00e9al o\u00f9 ins\u00e9rer vos mot-cl\u00e9s de mani\u00e8re naturelle.<\/p>\n En effet, l\u2019alt text doit rester une phrase compr\u00e9hensible aussi bien par les robots des moteurs de recherche que par les internautes. \u00c9vitez donc de la bourrer de mots-cl\u00e9s au risque d\u2019obtenir l\u2019effet inverse de ce que vous recherchez\u2026<\/p>\n \u00c0 lire aussi : SEO : 6 r\u00e8gles \u00e0 respecter pour la balise Alt de vos images<\/a><\/p><\/blockquote>\n Les donn\u00e9es structur\u00e9es<\/a> aident Google \u00e0 fournir de meilleurs r\u00e9sultats visuels. En effet, le moteur de recherche affiche des badges pertinents dans les r\u00e9sultats de recherche d’images sur mobile.<\/p>\n Les utilisateurs identifient imm\u00e9diatement le type de contenu li\u00e9 \u00e0 la photo, ce qui peut les inciter \u00e0 cliquer sur le lien et donc \u00e0 visiter votre site internet. Par exemple, lorsqu\u2019on tape la requ\u00eate \u00ab comment faire du th\u00e9 glac\u00e9 \u00bb, on distingue clairement les articles contenant une recette structur\u00e9e et identifi\u00e9e par Google, gr\u00e2ce au badge \u00ab Recette \u00bb :<\/p>\n Actuellement, Google prend en charge quatre types de badges : produits, recettes, vid\u00e9os et GIF. Il vous suffit d’ajouter le Schema markup appropri\u00e9 \u00e0 la page. Vous trouverez plus d\u2019informations directement dans la doc de Google<\/a>.<\/p>\n Notez que les GIF ne n\u00e9cessitent aucun balisage suppl\u00e9mentaire : Google sait d\u00e9j\u00e0 qu’il s’agit de ce format anim\u00e9.<\/p>\n \u00c0 lire aussi : Boostez votre SEO gr\u00e2ce aux donn\u00e9es structur\u00e9es<\/a><\/p><\/blockquote>\n La pr\u00e9sence de vos images dans un fichier sitemap.xml<\/a> augmente consid\u00e9rablement les chances que les moteurs de recherche explorent et indexent vos visuels.<\/p>\n Pour ce faire, vous devez changer la structure de votre plan de site actuel, afin d\u2019indiquer les emplacements de vos visuels. \u00c0 savoir que vous avez la possibilit\u00e9 d\u2019inclure 1 000 images par page HTML. Cela devrait \u00eatre suffisant pour optimiser le r\u00e9f\u00e9rencement de vos photos !<\/p>\n Voici \u00e0 quoi ressemble un sitemap qui int\u00e8gre les images :<\/p>\n Si vous le souhaitez, vous pouvez inclure des informations compl\u00e9mentaires sur les visuels, telles que la l\u00e9gende, la localisation, le titre et m\u00eame la licence. Ces donn\u00e9es sont particuli\u00e8rement utiles pour mieux r\u00e9f\u00e9rencer une image sur Google<\/strong>.<\/p>\n Dans ce cas, votre sitemap.xml devrait s\u2019enrichir du code suivant :<\/p>\n \u00c0 lire aussi : Pourquoi r\u00e9diger un sitemap ?<\/a><\/p><\/blockquote>\n Les images responsives s’adaptent \u00e0 la taille du site sur tous les devices (mobile ou desktop).<\/p>\n Supposons que vous uploadez une image de 720 pixels de large sur votre site. Si un utilisateur visite votre site web sur un appareil avec un \u00e9cran de 320 px, l\u2019image va mettre du temps \u00e0 se charger et peut m\u00eame entraver l\u2019exp\u00e9rience utilisateur. Des facteurs qui nuisent \u00e0 votre r\u00e9f\u00e9rencement.<\/p>\n Pour rendre l\u2019image responsive, utilisez l\u2019attribut srcset<\/em>, picture <\/em>ou img src<\/em>. C\u2019est un \u00e9l\u00e9ment de code HTML qui indique au navigateur de charger diverses versions d’une image pour diff\u00e9rentes r\u00e9solutions d’\u00e9cran.<\/p>\n Pour savoir comment rendre une image responsive en CSS, nous vous invitons \u00e0 consulter notre tutoriel sur ce sujet<\/a>.<\/p>\n Le partage social constitue un facteur de classement dans les moteurs de recherche. Pour partager vos images, il n\u2019y a pas meilleur r\u00e9seau social que Pinterest !<\/p>\n Alors, pensez \u00e0 int\u00e9grer des hovers \u00ab pin it \u00bb \u00e0 vos visuels, via une extension. Lorsque les visiteurs font passer leur souris sur l\u2019image, ils sont invit\u00e9s \u00e0 la publier sur Pinterest, comme dans cet exemple provenant du site Elle D\u00e9coration :<\/p>\n Plus votre photo sera partag\u00e9e, mieux elle sera r\u00e9f\u00e9renc\u00e9e dans les moteurs de recherche !<\/p>\n\n
\n
2. Encoder l\u2019image dans le bon format<\/h2>\n
3. Choisir la bonne taille d\u2019image<\/h2>\n
4. Optimiser le nom du fichier pour r\u00e9f\u00e9rencer une image<\/h2>\n
\n
\n
5. Ranger intelligemment les images<\/h2>\n
6. R\u00e9f\u00e9rencer une image avec la balise \u00ab alt text \u00bb<\/h2>\n
![\"la](\"https:\/\/www.redacteur.com\/blog\/wp-content\/uploads\/sites\/6\/2022\/03\/1._referencer_image_google_alttext.jpg\")
<\/p>\n7. Ajouter des donn\u00e9es structur\u00e9es<\/h2>\n
![\"Google](\"https:\/\/www.redacteur.com\/blog\/wp-content\/uploads\/sites\/6\/2022\/03\/2._referencer_image_google_badges.png\")
<\/p>\n8. Cr\u00e9er un sitemap pour mieux r\u00e9f\u00e9rencer vos images<\/h2>\n
<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<urlset xmlns=\"http:\/\/www.sitemaps.org\/schemas\/sitemap\/0.9\"\nxmlns:image=\"http:\/\/www.google.com\/schemas\/sitemap-image\/1.1\">\n<url>\n<loc>http:\/\/nomdedomaine.com\/page1.html<\/loc>\n<image:image>\n<image:loc>http:\/\/nomdedomaine.com\/image.jpg<\/image:loc>\n<\/image:image>\n<image:image>\n<image:loc>http:\/\/nomdedomaine.com\/photo.jpg<\/image:loc>\n<\/image:image>\n<\/url>\n<\/urlset><\/pre>\n
<url>\n<loc>http:\/\/nomdedomaine.com\/page1.html<\/loc>\n<image:image>\n<image:loc>http:\/\/nomdedomaine.com\/image.jpg<\/image:loc>\n<image:caption>l\u00e9gende de l\u2019image<\/image:caption>\n<image:geo_location>ville, pays<\/image:geo_location>\n<image:title>titre de l\u2019image<\/image:title>\n<image:license>http:\/\/nomdedomaine.com\/image-license<\/image:license>\n<\/image:image>\n<\/url><\/pre>\n
9. Rendre l\u2019image responsive<\/h2>\n
10. Cr\u00e9er une image pinnable sur Pinterest<\/h2>\n
![\"Pinterest](\"https:\/\/www.redacteur.com\/blog\/wp-content\/uploads\/sites\/6\/2022\/03\/3._referencer_image_google_pinterest.jpg\")
<\/p>\n