generationcyb.net
  • Accueil
  • Web
  • Informatique
  • Marketing Digital
  • Business
  • Contact
No Result
View All Result
  • Accueil
  • Web
  • Informatique
  • Marketing Digital
  • Business
  • Contact
No Result
View All Result
generationcyb.net
No Result
View All Result

Le format SVG et SEO

Jérémy par Jérémy
18/06/2021
dans Marketing Digital
format svg
FacebookTwitter

Vous vous posez la question de l’indexation d’une image au format SVG ? Est-ce que les robots d’indexation accèdent bien à l’image ? Est-ce que l’image est comprise par les moteurs de recherche ? Voyons d’abord de qu’est le format SVG avant de répondre à la problématique SEO.

Le format SVG, c’est quoi ?

SVG signifie Scalable Vector Graphics, en d’autres termes c’est un format de données qui permet de créer des graphiques vectoriels. Il est inspiré des formats VML et PGML. Cependant, SVG est recommandé par la W3C à l’inverse de ces derniers.

SVG utilise le XML afin de créer des éléments graphiques pour le web. Très utilisé pour afficher des graphiques mais il peut être également utilisé pour réaliser des dessins plus avancés que de simples graphiques.

A savoir aussi que SVG peut être utilisé avec du CSS pour définir le style des éléments graphiques comme par exemple la couleur ou la police d’écriture. De même, ces éléments peuvent être manipulé comme d’autres élément du DOM.

L’un des principaux avantages de ce format est que l’on peut redimensionner une image sans perdre la qualité initiale à l’inverse d’une image jpeg ou png par exemple.

SVG et SEO

Il existe plusieurs façons d’inclure une image SVG dans une page HTML dont 3 principales :

  • Via une balise img
  • Via une balise object
  • Via une balise svg

En fonction de l’inclusion choisie, nous pouvons impacter l’indexation des images SVG.

La balise img

La balise img lorsqu’il est possible de la déployer est à favoriser (en effet certain SVG plus complexe nécessite l’utilisation de la balise object). La balise img est la balise de référence pour inclure une image et permet d’y ajouter un attribut alt pris en compte par les moteurs de recherche. Dans ce cas précis, l’image SVG est accessible aux robots d’indexation.

<img src= »equilateral.svg » alt= »un triangle aux trois côtés égaux » />

La balise object

La balise object permet d’inclure une image SVG de la manière suivante :

<object data= »parallelogramme.svg »  type= »image/svg+xml »> </object>

Cependant, cette inclusion n’est pas SEO friendly. L’astuce est d’utiliser une balise img en plus pour permettre l’indexation :

<object data= »parallelogramme.svg »  type= »image/svg+xml »>

<img src= »parallelogramme.svg » alt= »un quadrilatère dont les côtés sont parallèles deux à deux » />

</object>

A savoir : à l’origine l’inclusion d’une balise img dans la balise object sert à fournir au navigateur une image dans un autre format que le SVG au cas où le navigateur ne serait pas compatible avec le format SVG. Cependant nous l’utilisons ici dans un but SEO.

La balise SVG

Ici il s’agit d’écrire le code du fichier SVG directement dans notre HTML :

<svg width= »300″ height= »200″>

<rect width= »100% » height= »100% » fill= »green » />

</svg>

Impossible dans ce cas pour les robots d’indexation de comprendre l’image et de la positionner dans les résultats de recherche.

A lire aussi :

4 conseils qui marchent pour améliorer son référencement 4 conseils qui marchent pour améliorer son référencement
Quels avantages à utiliser Freemind ? Quels avantages à utiliser Freemind ?
C’est quoi le marketing digital ? C’est quoi le marketing digital ?
Article suivant
document word

Comment ouvrir un fichier Opendocument avec Word ?

Laisser un commentaire Annuler la réponse

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

No Result
View All Result

Populaires

wikipedia-zoom

Quelle est l’encyclopédie collaborative en ligne la plus utilisée ?

27/08/2021
malware-ecran-pc

11 Catégories de logiciels malveillants

27/08/2021
paysafecard-mobile

Comment payer avec Paysafecard via Paypal ?

29/06/2021
paypal-vs-amazon

Payer avec PayPal sur Amazon : Possible ?

28/11/2021
logo-paypal-telephone

Numéro PayPal : comment appeler le service clientèle ?

28/02/2022
logiciel-diaporama

2 logiciels permettant de créer un diaporama de présentation

27/08/2021

A propos

Le magazine de la cyber generation : actualités,
conseils et avis sont à retrouver sur notre site

Categories

  • Business
  • Informatique
  • Marketing Digital
  • Web

© 2022 generationcyb.net - Mentions légales

No Result
View All Result
  • Accueil
  • Web
  • Informatique
  • Marketing Digital
  • Business
  • Contact

© 2022 generationcyb.net - Mentions légales