Vous vous demandez ce que sont les images décoratives et comment elles affectent le référencement ?
Les images décoratives doivent être traitées différemment des autres types d'images.
La bonne nouvelle est qu'il est très facile de gérer correctement les images décoratives.
Dans cet article
- Que sont les images décoratives ?
- Images informatives vs. Images décoratives : Quelle est la différence ?
- Qu'est-ce que le texte alternatif (texte de remplacement) ?
- Texte alternatif pour les images décoratives
- Texte alternatif pour les images informatives
- More SEO tips: Image File Names and Sizes
- Web Page SEO: Get More Visitors
- How is Alt Text Written in HTML?
Que sont les images décoratives ?
Une image décorative est une image qui ne fournit aucune information pertinente.
Par exemple, une photo de stock de livres empilés est une image décorative couramment trouvée sur les sites Web éducatifs.
Bien que les images décoratives apportent rarement une valeur informative, elles peuvent améliorer le style d'un site Web et contribuer au plaisir de l'utilisateur sur une page.
Par exemple, les magazines et journaux littéraires peuvent utiliser des images de stock ou des illustrations personnalisées pour ajouter une touche visuelle aux pages.
Ici, l'image décorative peut être attrayante et parler principalement à l'imagination.
La page « À propos » du magazine Nautilus en est un bon exemple. Elle promet « un voyage dans les merveilles de l'univers », et une illustration onirique attire le lecteur.
Images informatives vs. Images décoratives : Quelle est la différence ?
La principale différence entre les images décoratives et informatives est que ces dernières fournissent des informations relatives au sujet d'une page.
Voici des exemples d'images informatives :
- Photos d'événements d'actualité, tels qu'une manifestation ou une scène de crime.
- Diagrammes et graphiques qui amplifient les points soulevés dans un article.
- Images d'un lieu, d'une personne ou d'une chose discutée dans l'article.
Les images informatives sont également appelées images fonctionnelles.
Les images informatives aident les utilisateurs à vérifier l'exactitude du texte et, dans certains cas, à approfondir les détails.
Mais comme nous l'avons vu avec l'exemple de Nautilus, il semble incorrect d'affirmer que les images décoratives ne transmettent aucune information, car elles peuvent évoquer visuellement une ambiance et créer des attentes.
Cependant, on peut dire que les images décoratives ne fournissent aucune information qui ne soit déjà présente dans le texte.
Ces deux types d'images sont également traités différemment en SEO.
Pour comprendre comment et pourquoi, revenons à la signification du texte alternatif.
Qu'est-ce que le texte alternatif (texte de remplacement) ?
Le texte alternatif est un texte qui décrit une image.
Il y a 2 objectifs pour le texte alternatif :
- Les moteurs de recherche lisent et indexent le texte alternatif, ce qui les aide à comprendre le contenu de l'image.
- Le texte alternatif est lu à voix haute par les lecteurs d'écran, des appareils utilisés par les personnes handicapées.
Le texte alternatif est également appelé balise alt. Il s'agit d'une référence au code HTML que les systèmes de gestion de contenu comme WordPress ajoutent automatiquement aux images.
Texte alternatif pour les images décoratives
La gestion du texte alternatif pour les images décoratives est simple : le laisser vide est considéré comme la meilleure pratique.
Voici comment procéder pour vous assurer que le champ est vide :
- Connectez-vous à WordPress
- Accédez à n'importe quelle page Web sur laquelle vous avez une image.
- Cliquez ensuite sur l'image pour ouvrir les paramètres de l'image de WordPress dans la barre latérale droite.
C'est là que vous verrez le champ Texte alternatif.
Le laisser vide signifie simplement que vous n'avez pas à ajouter de texte alternatif.
En le laissant vide, les lecteurs d'écran ignoreront l'image décorative. Cela offre une meilleure expérience utilisateur aux personnes malvoyantes, car la description de cette image n'apporterait aucune valeur.
Imaginez un lecteur d'écran lisant à voix haute,
- « des gens pointant vers des sites Web »
- « image verte décorative », ou,
- « illustration pour un article de site Web »
Ennuyeux, n'est-ce pas ?
Voyons maintenant en quoi la gestion du texte alternatif pour les images informatives est différente
Les lecteurs d'écran sont l'une des nombreuses technologies d'assistance utilisées par les personnes handicapées.
Texte alternatif pour les images informatives
À titre d'exemple, nous allons utiliser un article sur un modèle de stratégie numérique créé par Avinash Kaushik.
Kaushik est un visionnaire du marketing bien connu. Comme l'article se concentre sur son travail, nous avons ajouté une photo de lui.
Et voici le texte alternatif que nous avons ajouté : « avinash kaushik parlant lors d'une conférence ».
La photo de Kaushik ne fournit pas beaucoup d'informations, vous vous demandez peut-être : « Pourquoi ne pas la traiter comme une image décorative ? » Nous pourrions. Mais Kaushik est au centre de l'article. Et nous voulons que les moteurs de recherche indexent ce texte alternatif.
De cette façon, les utilisateurs recherchant « Avinash Kaushik » pourraient tomber sur cette photo et cliquer pour accéder à l'article.
Examinons maintenant 2 problèmes d'image qui peuvent affecter le référencement.
Plus de conseils SEO : Noms et tailles de fichiers image
S'assurer que le nom et la taille de votre fichier image sont optimisés peut améliorer votre référencement.
Examinons d'abord les noms de fichiers.
Noms de fichiers image vs. Types de fichiers
Avant de commencer, il est utile de savoir qu'un nom de fichier image est différent du type de fichier image. Le type de fichier est exprimé par une « extension » – un petit bout de texte qui apparaît automatiquement à la fin d'un nom de fichier image.
Par exemple, Nom-photo.jpg
Cela nous indique que le nom du fichier est « Nom-photo » et qu'il est au format de fichier jpg.
Si cette image était au format png, elle ressemblerait à ceci : Nom-photo.png.
L'extension est une toute petite information qui indique le format du fichier.
Il existe de nombreux types de formats d'images numériques, tels que .webp et .svg. Il n'est pas nécessaire de tous les comprendre car cette extension sera ajoutée automatiquement.
Comment optimiser les noms de fichiers image
Étant donné que les moteurs de recherche lisent également les noms de fichiers image, assurez-vous que les vôtres sont clairs et descriptifs.
Les fichiers image mal nommés sont vagues, comme ceux-ci :
- 1100073658.jpg
- Homme-qui-s'entraîne.jpg
Les bons titres d'images doivent être spécifiques et décrire l'image.
Par exemple, disons que vous écrivez un article sur la façon dont les recrues améliorent leur condition physique avant d'être envoyées au camp d'entraînement du corps des Marines des États-Unis.
Votre image montre une vraie recrue pratiquant des exercices de gainage. Au lieu de homme-qui-s'entraîne.jpg, vous pourriez nommer votre image recrue-marine-en-gainage.jpg.
Les noms de fichiers pour les images décoratives sont souvent moins spécifiques car ils sont utilisés pour évoquer une ambiance ou un sentiment de marque. Par exemple, l'image décorative du Nautilus ci-dessus s'appelle véhicule-merveilleux.jpg.
Si vous partagez une œuvre d'art, le titre de l'œuvre est un nom de fichier image approprié.
En savoir plus dans notre article sur le SEO des noms de fichiers image.
Attention : La publication d'images pour lesquelles vous n'avez pas de licence peut entraîner de lourdes amendes. Aux États-Unis, ces amendes peuvent atteindre 150 000 $ par utilisation d'image.
Taille des fichiers image
Étant donné que les tailles de fichiers volumineuses peuvent ralentir le chargement de votre page, envisagez d'utiliser un plugin WordPress qui optimisera automatiquement vos images pour la vitesse.
Des plugins comme WP Rocket sont faciles à installer et à utiliser.
Astuce de pro : La taille de votre fichier image et la taille d'affichage de l'image sont 2 choses différentes. Il est possible de réduire la taille de l'image et qu'elle s'affiche toujours comme une image haute résolution, prête pour Retina.
SEO de page Web : obtenez plus de visiteurs
Les images informatives et décoratives peuvent vous aider à engager les visiteurs de votre site. Et le texte alternatif pour les images informatives peut attirer du trafic depuis les moteurs de recherche.
Mais le SEO ne se limite pas au texte alternatif des images.
C'est là qu'un plugin comme All in One SEO (AIOSEO) entre en jeu.
Conçu pour être facile à utiliser pour les débutants, il fournit la plupart de ce dont vous avez besoin pour le SEO (autre que le contenu).
C'est un plugin établi avec des milliers d'avis 5 étoiles sur WordPress.org. Plus de 3 millions d'utilisateurs l'ont téléchargé.
Voici comment cela fonctionne.
Classez plus haut : Tout le monde veut que son contenu se classe plus haut, mais apprendre le SEO prend du temps. C'est là qu'AIOSEO est essentiel. Il analyse votre contenu et vous dit exactement quoi faire pour l'optimiser pour le SEO.
Au fur et à mesure que vous suivez les recommandations, votre score TruSEO augmente.
Apparaissez bien dans les résultats de recherche : Le plugin facilite la qualification de vos pages Web pour être affichées en tant que rich snippets. Vous pouvez considérer les rich snippets comme des affichages de moteurs de recherche super-développés.
Voici à quoi ressemble un extrait de recherche standard :
Et voici un extrait enrichi.
Aucun code requis : All in One SEO gère automatiquement plusieurs fonctions techniques. Par exemple, il générera automatiquement des sitemaps XML et RSS. Ces sitemaps informent les moteurs de recherche de vos modifications ou de votre nouveau contenu.
N'oubliez pas de planifier les conversions
Pendant que vous travaillez à attirer plus de trafic, assurez-vous de déterminer les actions que vous souhaitez que les visiteurs du site effectuent.
Nous utilisons OptinMonster pour créer des pop-ups d'intention de sortie. Ces pop-ups apparaissent lorsque les gens s'apprêtent à *quitter* votre site Web.
OptinMonster est peu coûteux et efficace.
Comment le texte alternatif est-il écrit en HTML ?
Ceux d'entre vous qui sont curieux de connaître la représentation HTML du texte alternatif trouveront l'information suivante utile.
La syntaxe du texte alternatif est la suivante :
<img alt="your alt text goes here">Notez que alt est une *propriété* de l'élément image HTML et que tout ce qui est placé entre les guillemets est la *valeur* de la propriété.
<img alt="baseball player sliding into homebase">Les balises Img contiendront également la source (src) (URL) de l'image, par exemple :
<img src="/baseball-player-scoring.png/" alt="baseball player sliding into homebase">Lorsque le champ de texte alternatif est vide, on l'appelle texte alternatif nul et il ressemble à ceci en HTML.
<img src="/baseball-player-scoring.png/" alt="">Ceci est également appelé un attribut alt vide.
Astuce : Découvrez comment afficher le code de n'importe quelle page Web.
Questions et réponses sur les images
Vous avez d'autres questions sur la façon dont certaines images servent à des fins décoratives, sur le texte alternatif ou sur l'accessibilité ? Nous avons répondu à quelques questions courantes ci-dessous.
Si vous avez une question supplémentaire, veuillez laisser une note dans la section des commentaires.
Les images d'arrière-plan sont-elles considérées comme des images décoratives ?
Oui, les images d'arrière-plan, telles que définies par la propriété background-image en CSS, sont considérées comme décoratives. Dans ces cas, le code CSS du site Web désignera généralement une classe dont l'attribut alt est toujours rendu vide.
Qu'est-ce que l'accessibilité Web ?
L'accessibilité Web est un ensemble de pratiques et de normes technologiques conçues pour permettre aux personnes handicapées de naviguer et de consommer facilement le contenu d'un site Web. Les Web Accessibility Content Guidelines (WCAG) décrivent les meilleures pratiques pour les développeurs Web, mais les débutants peuvent vouloir commencer par les fondamentaux.
Bien que rendre un site accessible n'ait pas d'impact direct sur le SEO, l'accessibilité est cohérente avec un bon SEO. C'est pourquoi un site optimisé pour l'accessibilité peut se classer plus haut dans les résultats de recherche.
Quelles sont les directives d'accessibilité Web ?
Le document des directives d'accessibilité Web a établi des lignes directrices pour rendre les sites Web plus faciles d'accès pour les personnes handicapées. Développées par le Web Accessibility Initiative (WAI), les Web Accessibility Content Guidelines (WCAG) sont en constante amélioration.
Les directives adhèrent à 4 principes, définis comme Perceptible, Opérable, Compréhensible et Robuste.
Le Web Accessibility Initiative fait partie du World Wide Web Consortium (W3).
Après les images décoratives . . .
Nous espérons que cet article vous a aidé à comprendre ce que sont les images décoratives et pourquoi il est préférable de laisser le texte alternatif vide.
Ensuite, apprenez-en davantage sur le SEO d'images et comment les images peuvent être utiles pour créer du contenu scannable.
Si vous avez trouvé cet article utile, veuillez vous abonner à notre chaîne YouTube. Vous y trouverez de nombreux autres tutoriels utiles. Vous pouvez également nous suivre sur X (Twitter), LinkedIn ou Facebook pour rester informé.
Envie d'essayer AIOSEO gratuitement ?
Entrez l'URL de votre site Web WordPress pour installer AIOSEO Lite.
Divulgation : Notre contenu est financé par nos lecteurs. Cela signifie que si vous cliquez sur certains de nos liens, nous pouvons gagner une commission. Nous ne recommandons que les produits qui, selon nous, apporteront de la valeur à nos lecteurs.
