web-dev-qa-db-fra.com

Chargement paresseux d'images (avec URI de données) et effets sur le référencement

J'ai vu cette question: Chargement paresseux d'images et d'effets sur le référencement

Ma question est très similaire, sauf que j'utilise des images data-uri comme ceci:

<img width="1100" height="340" class="img-responsive lazy lazy-hidden"
     src="data:image/png;base64,iVBORw0KGgoAAAANS ... "
     data-src="//example.com/epic-cat-fails-omg.png"
     alt="" >

Chaque image à chargement paresseux a une unique uri de données pour créer une image transparente de taille spécifique. Que dois-je mettre dans la balise alt pour le référencement? Quelque chose? Rien? Est-ce que Google se préoccupe même des images data-uri?

(Ou devrais-je utiliser une description correcte et utiliser la balise <noscript> pour placer le <img> avec la même description? Je suis dans le noir à ce sujet.)

seogoogle-searchjavascriptimagesgoogle-image-search
3
Drakes

Que dois-je mettre dans la balise alt pour le référencement? N'importe quoi? Rien? Est-ce que Google se préoccupe même des images data-uri?

Les moteurs de recherche définissent le contenu sous forme de texte.

Un site Web ne contenant que des images et des valeurs pour le paramètre alt ne sera pas bien classé dans les moteurs de recherche car il n'y a pas de texte supplémentaire pour décrire l'image en détail.

Si vous essayez de charger des images basées sur un URI de données, gardez à l'esprit que cela augmentera davantage la taille de votre code HTML que si vous venez d'utiliser un fichier image externe.

Si vous essayez de charger paresseux des centaines d’images assez petites pour économiser sur la puissance de traitement du serveur, nous vous conseillons d’utiliser une image Sprite, ce que j’utilise sur mon site Web pour les listes d’images. Dans un sens, cela ressemble à une charge paresseuse, sauf que les images sont déjà montrées au lieu d'être chargées lentement. De plus, la compatibilité du navigateur avec le chargement de Sprite est supérieure à celle des URI de données.

1
Mike

Que dois-je mettre dans la balise alt pour le référencement?

Pourquoi avez-vous cette question? Je veux dire, vous traitez ici avec une construction assez banale (image en tant que données uri et image régulière en tant que solution de secours pour les navigateurs noscript), de sorte qu’il n’a pas besoin de solution spéciale.

Utilisez, comme tout le monde, alt et title, remplissez-les de manière significative - ce sont les seules meilleures pratiques, tant pour le référencement naturel que pour le W3C.

1
Evgeniy

J'ai utilisé des images URI de données sur un site et j'ai découvert les éléments suivants:

  1. Il est peu probable que vos images URI de données soient indexées dans la recherche d'images Google. Lorsque les images sont chargées paresseusement, il est pratiquement impossible de les indexer.
  2. Lors de l'utilisation de l'image complète dans l'URI des données, la taille de la page augmente considérablement. Cela oblige Googlebot à explorer votre site beaucoup plus lentement.
  3. Les anciennes versions d'Internet Explorer (version 7 et précédente) ne pourront pas voir vos images.

Étant donné que vous utilisez une image transparente dans l'URI des données et que vous chargez la totalité de l'image plus tard, je ne pense pas que la taille de votre page augmentera au point de vous inquiéter pour Googlebot.

En ce qui concerne le texte alternatif, faites ce qui est logique pour les utilisateurs. Tout utilisateur disposant d'un navigateur qui ne charge pas les images aimerait voir du texte utile lorsque l'image n'est pas chargée. La recherche d'images Google n'indexera pas vos images, cela n'a donc aucune importance. Google n’accorde presque aucune attention au texte alternatif en matière de recherche Web.

1
Stephen Ostermiller