Comment optimiser ses images pour le web ?

seo
Les images peuvent être le plus grand atout comme le plus gros handicap de vos pages web. Dans cet article, vous verrez pourquoi il est dangereux de ne pas prendre des mesures pour optimiser vos images, et comment maximiser leur efficacité pour votre site.

Pourquoi faut-il optimiser ses images ?

Pour être bien référencé et éviter de faire fuir ses visiteurs, un site web doit être rapide. Selon une étude menée par Google, plus de 50% des utilitateurs sur mobile quittent un site si le temps de chargement excède trois secondes. Il est donc primordial que le contenu de vos pages s'affiche rapidement. Hors les ressources pesant le plus lourd dans un site web sont en général les images. Si vous souhaitez préserver vos performances, c'est donc le principal levier sur lequel agir. Rendez-vous compte : une seule image mal optimisée peut multiplier par dix le temps de chargement de votre site !

Plus généralement, on constate que lorsqu'un site est très lent à afficher son contenu, c'est dans la majorité des cas à cause d'un problème d'image. Nous allons donc aborder les règles à suivre et les choses à ne pas faire pour éviter que cette situation ne vous arrive.

1ère étape : réduire le poids de votre image

Une balance indique un poids égal à zéro

Utiliser des formats adaptés au web

Internet suit une règle très simple concernant les images : moins c'est lourd, mieux c'est. Google favorisera toujours les images les plus légères, même si elles sont moins nettes. Pour éviter de vous retrouver avec des médias trop pixelisés, vous devez donc vous arranger pour trouver le meilleur ratio entre poids et qualité. Mais tous les formats d'image ne sont pas adapté à cette pratique. Ainsi, un format comme le PNG, utilisé pour augmenter au maximum la qualité d'une image, a aussi tendance à être bien plus lourd. Privilégiez plutôt des formats comme le JPG et le WEBP, qui sont parfois 3 à 4 fois moins lourd. Il y existe cependant des cas spécifiques nécessitant d'autres formats spécifiques. Voici donc une liste précisant quels formats utiliser, et dans quels cas :

Jpg (ou JPEG) et WEBP : Ce sont les formats à utiliser par défaut. En théorie, le WEBP est conçu pour mieux s'adapter aux moteurs de recherche, mais il arrive souvent en pratique qu'une image en JPG soit moins lourde. Le choix est donc à votre convenance.

SVG : Ce format est utile pour les icônes et les logos, car il permet de préserver la netteté des contours.

PNG : Ce format est utile pour intégrer une image sans fond. Il est néanmoins à réserver pour les très petits médias, car il est bien plus lourd. Il faut l'éviter dans la mesure du possible.

Dimensionner correctement ses images

Même au bon format, une image peut s'avérer très lourde tout simplement car elle est très grande. On mesure généralement la taille d'une image en px (à ne pas confondre avec des pixels). Il faut environ 37,8 px pour faire un centimètre. Cela signifie qu'une image d'une taille de 4000px est dimensionnée pour un écran de plus d'un mêtre de large. Une taille utile pour l'impression mais pas du tout optimisée pour un site web ! En réalité, il n'est pas utile que vos images dépassent les dimensions suivantes :

1800 à 2500px pour une image de fond ou faisant toute la taille de l'écran.

900 à 1400px pour des images secondaires

100 à 600px pour des miniatures

Utiliser des dimensions différentes sur tablette et mobile

Les smartphones sont aujourd'hui tellement démocratisés que nous y passons souvent plus de temps que sur un ordinateur. Hors il est toujours plus difficile de rendre efficace le chargement d'une page sur mobile, notamment si le réseau n'est pas optimal. Une option intéressante est donc d'utiliser des images moins grandes et plus verticales pour les petits formats d'écran. Cela permet d'une part d'économiser de précieuses ressources, et d'autre part de faciliter le rendu de la page sur mobile.

Exemple : Imaginons une page contenant 10 images d'une taille moyenne de 150Ko (Kilo-octets). Le fait de prévoir des images petites pour la version mobile peut permettre d'économiser facilement plus de 50% du poids total, soit une économie générale de 750Ko; en pratique, cela signifie que la page chargera 1 à 2 secondes plus vite sur mobile. Cette différence semble peu impressionnante, mais une seule seconde de chargement en moins peut énormément impacter l'expérience utilisateur.

Compresser ses images

Si vous avez fait votre possible pour minimiser le poids de vos médias, mais que certains sont encore trop imposant, il vous reste une dernière option, à savoir la compression d'image. Cette technique consite à diminuer le poids d'une image en altérant légérement sa qualité. Le résultat final dépendra du niveau de compression, mais la différence entre une image originale et compressée n'est généralement pas visible à l'oeil nu. Il est donc conseillé de compresser tous ses médias.

En fonction du nombre de couleurs et d'éléments, la compression d'image peut être plus ou moins eficace; elle peut permettre d'économiser de 10% à 90% du poids original. Le résultat dépendra également du logiciel de compression que vous utilisez, les outils payants étant naturellement plus efficaces.

Si vous ne savez pas quel logiciel de compression d'image choisir, vous pouvez utiliser I Love IMG, qui est un outil en ligne gratuit offrant un bon taux de compression.

2e étape : optimiser les informations concernant vos images

Une clé usb est attachée à une étiquette

La balise alternative

Avec toutes ces règles à respecter, on pourrait croire qu'ajouter des images à son site n'est pas une bonne idée. Détrompez-vous, Google adore les images ! Cependant, il n'est pas capable d'identifier par lui-même de quoi parlent vos médias. Il est donc nécessaire de lui faciliter la tâche; c'est le rôle de la balise alternative, aussi appelée attribut ALT, qui permet de donner une description de l'image pouvant être interprétée par un moteur de recherche.

La balise alternative possèdent également d'autres utilités : en cas de problème d'affichage d'une image, l'utilisateur verra s'afficher la description de l'image, ce qui est toujours mieux qu'un cadre vide. Il est également important de préciser que les moteurs de recherche pénalisent les images sans attribut ALT, car elles ne respectent pas les bonnes pratiques du web (il sera par exemple impossible pour une personne aveugle d'obtenir la description de l'image via la lecture audio). Enfin, sachez qu'une balise alternative peut servir votre référencement si vous y incuez les bons mots-clés (attention tout de même au bourrage de mots-clés).

La légende

Similaire à la balise alternative, une légende a pour fonction d'être visible même lorsque l'image est fonctionnelle. Elle a pour but d'ajouter du contexte à vos médias, et permet à un moteur de recherche de déterminer plus facilement si votre image correspond au sujet de la page. Ajouter une légende peut également s'avérer très utile si les images que vous utilisez sont soumises à des droits d'auteur, en vous permettant de citer discrètement l'auteur du média en question.

Comme pour la balise alternative, une légende peut également être utile pour votre référencement. Il n'est pas pour autant judicieux de l'ajouter systématiquement, car vous risquez au contraire d'impacter négativement votre page. Faites en sorte de l'ajouter uniquement si le besoin s'en fait sentir.

Le sitemap

Nous entrons ici dans des techniques avancées. Si vous ne souhaitez pas effectuer cette étape, votre site ne sera pas pénalisé.

Le sitemap n'est pas à proprement parler une optimisation d'image, mais peut vous aider à accélérer l'indexation de vos pages et vos médias, et donc favoriser votre référencement. Cette étape consiste à envoyer à Google Search Console (ou à la console du moteur de recherche que vous utilisez) le plan de votre site, qui regroupe toutes vos pages, mais également vos médias.

Vous pouvez trouver le sitemap de votre site en tapant son adresse URL suivi de "/sitemap.xml". Pour que vos images soient également indexées, vous devez cependant activer les plans de sites des images. Pour plus d'informations à ce sujet, vous pouvez consulter Google Search Central ..

Conclusion

Optimiser ses images est un travail contraignant et qui peut être chronophage, surtout au début. Il serait cependant mal avisé d'expédier cette étape, car chaque image dont l'efficacité n'est pas maximisée vous causera systématiquement des problèmes. Prenez le temps qu'il faudra pour effectuer toutes les actions nécessaires, vous vous en féliciterez grandement par la suite.

wave (10)

Nos derniers articles

Optimiser son SEO avec l'Intelligence Artificielle (IA)

Dans le paysage dynamique du marketing digital, l'Intelligence Artificielle (IA) émerge comme un catalyseur révolutionnaire pour l'optimisation des stratégies SEO. En quête de visibilité accrue et de résultats plus performants, les professionnels du référencement explorent désormais les innombrables possibilités offertes par l'IA. Cette nouvelle ère redéfinit fondamentalement la manière dont les entreprises abordent leur présence en ligne, dépassant les frontières des méthodes traditionnelles.

Comment développer son activité e-commerce à l'étranger ?

Développer une activité e-commerce sur son marché domestique est une chose, mais l'implanter à l'étranger en est une autre. C'est un grand pas à franchir. Mais avec les stratégies adéquates, vous pouvez vous assurer que votre entreprise de commerce électronique est prête pour le marché international.

Voici donc quelques conseils qui pourront vous à développer votre activité e-commerce à l'étranger.

4 idées reçues sur les sites web

Le saviez-vous ? En moyenne, chaque utilisateur visite chaque années plusieurs centaines de sites internet. Pourtant, il subsiste encore de nombreux a priori sur leur fonctionnement, leurs objectifs et leur utilité. Je vous propose donc de nous pencher sur cinq idées reçues qui sont parmi les plus répandues sur les sites web.

Comment savoir quels mots-clés mettre sur votre site web ?

Les mots-clés peuvent faire et défaire le positionnement d'un site web. Comment bien les sélectionner, et surtout comment les utiliser de manière à ce qu'il vous aident à atteindre les premières places, et non l'inverse ?

hello world!
bonjour@tricorn.fr
472000 - Marmande
Contactez-nous
cross linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram