SEO des images : ce que Google lit vraiment dans une image

Quand vous ajou­tez une image à une page Word­Press, un champ « Texte alter­na­tif » appa­raît dans ses réglages. On lit par­fois qu’il faut y glis­ser son mot-clé « pour le réfé­ren­ce­ment ». Google a pour­tant docu­men­té ce qu’il fait de ce champ et de tout ce qui entoure une image : le SEO des images tient moins à une astuce qu’à quelques infor­ma­tions lisibles, pla­cées au bon endroit. Cet article suit une image depuis le code de votre page jus­qu’aux résul­tats de recherche ; le poids des fichiers, autre ver­sant du sujet, relève de notre article sur les for­mats et la com­pres­sion des images.

Avant tout, Google doit trouver l’image

Google ne découvre pas une image en la regar­dant : il la repère dans le code de la page. D’a­près sa docu­men­ta­tion consa­crée aux images, il les trouve dans les balises <img>, l’élé­ment HTML qui insère une image dans une page, y com­pris quand cette balise est pla­cée dans un élé­ment <picture>.

Une vraie image, pas un décor

La même docu­men­ta­tion est sans ambi­guï­té : « Google n’in­dexe pas les images CSS. » Une image CSS est ici une image pla­cée en arrière-plan au moyen d’une règle CSS, le lan­gage qui défi­nit l’ap­pa­rence d’une page. Elle s’af­fiche à l’é­cran comme n’im­porte quelle autre, mais Google ne la traite pas comme une image HTML à indexer.

Dans Word­Press, deux réglages pro­duisent une image CSS sans que rien ne le signale :

• le bloc Ban­nière, quand l’op­tion « Arrière-plan fixe » ou « Arrière-plan répé­té » est acti­vée. Sans ces options, le bloc insère une balise <img> ; avec l’une d’elles, il trans­forme la pho­to en arrière-plan CSS ;
• les images d’ar­rière-plan d’E­le­men­tor, réglées dans l’on­glet Style d’une sec­tion ou d’un conte­neur, qui sont écrites dans la feuille de style.

Une image de décor peut très bien res­ter en arrière-plan : une tex­ture, un motif ou une pho­to d’am­biance der­rière un titre n’ont rien à apprendre à Google. En revanche, une pho­to qui porte l’in­for­ma­tion de la page, le pro­duit, le lieu ou la per­sonne, gagne à être insé­rée comme une vraie image, avec un bloc Image ou un wid­get Image.

Véri­fier com­ment une image est insérée

➔ Dans votre navi­ga­teur, faites un clic droit sur l’i­mage, puis choi­sis­sez « Ins­pec­ter ». Sur Safa­ri, acti­vez d’a­bord les outils de déve­lop­pe­ment s’ils ne le sont pas.

➔ Dans le code HTML, recher­chez une balise <img> cor­res­pon­dant à l’i­mage. Sa pré­sence per­met à Google de décou­vrir son adresse, sans garan­tir son indexation.

➔ Si vous ne trou­vez aucune balise <img> et que l’i­mage figure dans le pan­neau des styles sous la pro­prié­té background-image, c’est un arrière-plan, que Google n’in­dexe pas.

Le sitemap d’images, pour les images difficiles à trouver

Le site­map est un fichier qui liste les adresses de votre site à l’in­ten­tion des moteurs de recherche. Il peut aus­si lis­ter des images : Google explique qu’on peut ain­si lui four­nir l’a­dresse d’i­mages « que nous n’au­rions peut-être pas trou­vées autrement ».

Avec SEO­Press, vous pou­vez inté­grer les images au site­map XML. Pour le véri­fier, ren­dez-vous dans SEO, puis Plan de site XML – HTML, onglet Géné­ral, et contrô­lez que l’op­tion « Acti­ver le plan de site image » est acti­vée. Elle per­met d’y inclure les images des conte­nus, les gale­ries, les images mises en avant et celles des pro­duits Woo­Com­merce. Le site­map natif de Word­Press, celui qui fonc­tionne sans exten­sion SEO, ne liste aucune image.

Le site­map aide Google à trou­ver une image, pas à la comprendre.

Une image signa­lée par ce fichier, mais posée sans texte autour, reste une image sur laquelle Google dis­pose de peu d’in­for­ma­tions. Pour le fonc­tion­ne­ment de ce fichier lui-même, notre article pour com­prendre le fichier sitemap.xml en détaille le rôle dans WordPress.

Le texte alternatif, pièce centrale du SEO des images

Ce que Google en fait

Le texte alter­na­tif est le texte pla­cé dans l’at­tri­but alt de la balise <img>. Il a été conçu pour les per­sonnes qui ne voient pas l’i­mage : un lec­teur d’é­cran, le logi­ciel qui lit la page à voix haute, le pro­nonce à sa place, et le navi­ga­teur peut l’af­fi­cher quand l’i­mage ne se charge pas.

Google lui accorde une place à part. Sa docu­men­ta­tion le pré­sente comme « l’at­tri­but le plus impor­tant lors­qu’il s’a­git de four­nir plus de méta­don­nées pour une image ». Il ne le lit pas seul : il le croise avec des algo­rithmes de vision par ordi­na­teur, qui ana­lysent l’i­mage elle-même. Et quand l’i­mage sert de lien, son texte alter­na­tif joue le rôle du texte de ce lien.

Un bon texte alter­na­tif trans­met l’in­for­ma­tion utile de l’i­mage, selon le contexte où elle appa­raît. Pour une icône de loupe qui sert à lan­cer une recherche, « Recher­cher » est plus utile que « Loupe ».

Pourquoi y entasser des mots-clés dessert votre page

Google décon­seille expli­ci­te­ment de « rem­plir les attri­buts alt avec des mots clés ». La pra­tique relève de ce qu’il appelle l’ac­cu­mu­la­tion de mots clés, que ses règles contre le spam visent nommément.

Pre­nons une bou­lan­ge­rie qui illustre sa page « Nos pains » par la pho­to d’une miche, et com­pa­rons deux textes alternatifs :

• « pain bou­lan­ge­rie arti­sa­nale pain bio meilleur pain Lyon » : une suite de mots-clés, que le lec­teur d’é­cran récite telle quelle et qui n’ap­prend rien sur la photo ;
• « Miche de pain au levain tran­chée, à la mie alvéo­lée » : ce que montre l’i­mage, en une phrase.

Le second texte sert les deux lec­teurs à la fois. La per­sonne qui écoute la page sait ce que montre la pho­to, et Google trouve une des­crip­tion cohé­rente avec l’i­mage comme avec la page. Un mot-clé peut figu­rer dans le texte alter­na­tif s’il décrit réel­le­ment l’i­mage. Ce que Google décon­seille, c’est son ajout arti­fi­ciel ou sa répé­ti­tion. Pour le reste, le mot-clé a sa place dans le titre, les inter­titres et le texte de la page.

Toutes les images n’ap­pellent pas une des­crip­tion. Une image pure­ment déco­ra­tive reçoit un texte alter­na­tif vide, que les lec­teurs d’é­cran passent sous silence. Ce choix relève de l’ac­ces­si­bi­li­té, et les règles qui l’en­cadrent sont pré­sen­tées dans notre article sur les normes d’ac­ces­si­bi­li­té web.

Dans WordPress, le texte alternatif vit aussi dans la page

Le champ « Texte alter­na­tif » de la média­thèque n’est pas le seul endroit où ce texte se trouve. Quand vous insé­rez une image avec le bloc Image de l’é­di­teur, Word­Press reco­pie le texte alter­na­tif du média dans le bloc, et c’est cette copie que la page affiche ensuite.

Consé­quence pra­tique : cor­ri­ger le texte alter­na­tif dans la média­thèque ne met pas à jour les pages où l’i­mage est déjà insé­rée. Nous l’a­vons véri­fié sur un site de test : une image insé­rée sans texte alter­na­tif, la page enre­gis­trée, puis le texte ren­sei­gné dans la média­thèque. La page ne l’a jamais reçu.

Une exten­sion peut com­bler ce vide à l’af­fi­chage. SEO­Press le fait avec son option « Texte alter­na­tif sur les images insé­rées », acti­vée dès son ins­tal­la­tion : quand le texte alter­na­tif d’une image est vide dans la page, elle affiche celui de la média­thèque. Un texte déjà sai­si dans le bloc reste prio­ri­taire. Revers de l’op­tion : une image déco­ra­tive, lais­sée vide exprès, reçoit elle aus­si le texte de la média­thèque, que les lec­teurs d’é­cran annonceront.

Pour ces pages, la cor­rec­tion se fait dans le bloc lui-même, dans la colonne de réglages. Le code de Word­Press 7.1 le confirme : à l’af­fi­chage, Word­Press com­plète la balise de l’i­mage (dimen­sions, tailles adap­tées à l’é­cran, char­ge­ment dif­fé­ré), mais ne touche pas au texte alternatif.

La docu­men­ta­tion fran­çaise de Word­Press le dit en toutes lettres : les infor­ma­tions de la média­thèque servent de « valeurs par défaut au moment où une image est insé­rée », puis l’i­mage « est décon­nec­tée des don­nées de la média­thèque ». Ce fonc­tion­ne­ment a sa logique, puis­qu’une même image peut appe­ler un texte alter­na­tif dif­fé­rent selon la page où elle appa­raît. La pho­to de la miche pré­sente un pro­duit sur la page « Nos pains », et une mie bien alvéo­lée dans un article sur le levain.

Le wid­get Image d’E­le­men­tor fonc­tionne autre­ment : il va cher­cher le texte alter­na­tif dans la média­thèque à chaque affi­chage. Sur une page construite avec Ele­men­tor, une cor­rec­tion faite dans la média­thèque se réper­cute par­tout où l’i­mage est uti­li­sée, une fois le cache du site vidé s’il y en a un. Si votre site com­bine les deux édi­teurs, l’en­droit où cor­ri­ger dépend de la page.

Chaque champ d’une fiche de média a son propre rôle : titre, légende, des­crip­tion et texte alter­na­tif. Notre article sur la média­thèque Word­Press les pré­sente un par un et explique aus­si com­ment bien nom­mer ses fichiers.

Et si l’IA rédigeait le texte alternatif ?

Depuis Word­Press 7.0, l’ex­ten­sion expé­ri­men­tale AI, publiée sur le réper­toire offi­ciel, pro­pose de géné­rer le texte alter­na­tif d’une image : par un bou­ton dans les réglages du bloc Image, ou en lot depuis la média­thèque. Elle s’ap­puie sur un connec­teur vers un ser­vice d’in­tel­li­gence arti­fi­cielle, confi­gu­ré avec une clé four­nie par ce ser­vice, comme nous l’ex­pli­quons dans notre article sur Word­Press 7.0. Rien ne se déclenche sans votre action.

L’ou­til décrit ce qu’il voit, ce qui en fait un point de départ utile. Il ignore pour­quoi l’i­mage est dans la page : il peut écrire « Homme sou­riant devant une vitrine » là où l’in­for­ma­tion utile est « Le gérant devant sa boutique ».

Un texte alter­na­tif géné­ré se relit comme un brouillon.

Après une géné­ra­tion en lot, ouvrez aus­si une page déjà publiée et véri­fiez que le nou­veau texte y appa­raît bien, pour la rai­son vue plus haut : la fiche du média et le bloc de la page sont deux endroits distincts.

Le contexte en dit autant que l’image

Le texte autour, la légende, le titre de la page

Google ne juge pas une image iso­lé­ment. Sa docu­men­ta­tion indique qu’il « uti­lise le conte­nu de la page, y com­pris les légendes et le titre des élé­ments visuels », et recom­mande de pla­cer les images « à proxi­mi­té du texte qui les concerne ».

Repre­nons la miche de pain. Pla­cée sous le para­graphe qui pré­sente le pain au levain, elle est entou­rée de mots qui la confirment. La même pho­to glis­sée en bas de page, sous les horaires d’ou­ver­ture, ne l’est plus. Le lien entre l’i­mage et le texte, évident pour le lec­teur qui voit les deux, gagne à l’être aus­si dans l’ordre de la page.

La légende, le texte affi­ché sous l’i­mage, est l’en­droit le plus proche qui soit. Elle n’a pas le rôle du texte alter­na­tif : le texte alter­na­tif rem­place l’i­mage pour qui ne la voit pas, la légende la com­mente pour tout le monde. Une légende qui répète mot pour mot le texte alter­na­tif fait entendre deux fois la même phrase à la per­sonne qui uti­lise un lec­teur d’é­cran. Une légende qui ajoute une infor­ma­tion, un lieu, une date ou un nom, sert tous les lec­teurs, Google compris.

Le nom de fichier, un indice très léger

Le nom du fichier compte aus­si, mais Google en rela­ti­vise lui-même la por­tée : il « peut don­ner à Google des indices très légers sur l’ob­jet de l’i­mage ». Un fichier nom­mé miche-pain-levain.jpg vaut mieux que IMG_4892.jpg, mais il ne com­pense pas un texte alter­na­tif mal adap­té ni une image éloi­gnée de son sujet.

C’est sur­tout un geste d’or­ga­ni­sa­tion, qui se fait avant l’en­voi dans la média­thèque : renom­mer un fichier déjà insé­ré dans vos pages expose à des images qui ne s’af­fichent plus, comme le détaille l’ar­ticle sur la média­thèque cité plus haut.

Où vos images peuvent apparaître

Dans Google Images

Google Images est un moteur de recherche à part entière, et chaque image indexée peut y conduire un visi­teur vers la page qui la contient. Pour cer­tains sites, c’est une vraie porte d’en­trée : un arti­san qui montre ses réa­li­sa­tions, un site de recettes, une bou­tique dont les pro­duits se choi­sissent à l’œil. Pour un cabi­net de conseil ou une asso­cia­tion dont les pho­tos illus­trent sans infor­mer, le gain sera faible, et c’est normal.

Cette visi­bi­li­té a sa contre­par­tie : une per­sonne qui cher­chait une image peut l’a­voir trou­vée sans jamais cli­quer vers votre page. Être visible dans Google Images ne donne pas non plus à qui­conque le droit de réuti­li­ser vos pho­tos, un point déve­lop­pé dans notre article sur les droits d’au­teur et les images.

À côté de votre résultat

Dans les résul­tats clas­siques, Google affiche par­fois une minia­ture à côté d’une page. Il la choi­sit lui-même par­mi plu­sieurs signaux, mais vous pou­vez l’o­rien­ter, notam­ment avec la balise og:image, une ligne du code de la page qui désigne son image repré­sen­ta­tive et qui sert aus­si lors d’un par­tage sur les réseaux sociaux. Avec SEO­Press, quand l’op­tion Open Graph est active, cette balise reprend l’i­mage mise en avant de la page, sauf si vous en choi­sis­sez une autre dans ses réglages de réseaux sociaux.

Google donne ses cri­tères pour cette image : qu’elle soit « per­ti­nente et repré­sen­ta­tive de la page », en haute réso­lu­tion si pos­sible, sans for­mat extrême, et qu’elle ne soit ni « une image géné­rique (par exemple, le logo de votre site) » ni « une image conte­nant du texte ». L’i­mage mise en avant mérite donc d’être choi­sie pour ce qu’elle montre du conte­nu, pas seule­ment pour son effet en tête d’article.

Cette minia­ture n’est qu’un élé­ment du résul­tat, qui se tra­vaille comme un tout : notre article sur la balise title et la méta-des­crip­tion traite des deux textes qui l’accompagnent.

À retenir

• Une image qui porte l’in­for­ma­tion de la page s’in­sère comme une vraie image, avec un bloc Image ou un wid­get Image : Google n’in­dexe pas les images posées en arrière-plan.
• Le texte alter­na­tif trans­met l’in­for­ma­tion utile de l’i­mage dans son contexte. Un mot-clé per­ti­nent peut y figu­rer, mais pas une accu­mu­la­tion de mots-clés ; une image déco­ra­tive reçoit un texte alter­na­tif vide.
• Dans l’é­di­teur de blocs, une cor­rec­tion du texte alter­na­tif se fait dans chaque bloc où l’i­mage est insé­rée ; avec le wid­get Image d’E­le­men­tor, la média­thèque suffit.
• Un texte alter­na­tif géné­ré par l’IA se relit avant publication.
• L’i­mage se place près du texte qui en parle, avec une légende qui ajoute une infor­ma­tion plu­tôt qu’elle ne répète le texte alternatif.
• Le nom de fichier aide un peu, et se choi­sit avant l’envoi.
• L’i­mage mise en avant se choi­sit pour ce qu’elle repré­sente : SEO­Press la reprend par défaut dans la balise og:image, qui sert aux réseaux sociaux et peut orien­ter Google dans le choix de la miniature.