Lorsqu’on affiche un site sur mobile, les images ne s’adapte pas forcément à la taille du support. Sur un site, lorsqu’on intègre une image on lui donne une hauteur et largeur fixe, de ce fait elle ne s’adapte pas à la taille des écran sur laquelle on l’a visionne. Donc pour éviter que l’utilisateur mobile n’est besoin de réduire l’image manuellement, il faut rendre cette image “responsive”.
On le sait, aujourd’hui google attache de plus en plus d’importance aux résultats mobiles, et à l’expérience utilisateur, donc votre site se doit d’avoir un affichage parfait sur mobile également.
Heuresement c’est facile à faire, même pour les novices, pour cela il vous simplement ajouter un bout de code tout simple dans votre CSS, et bien sur SEOTool.fr vous le dévoile ici :
img {
max-width: 100%;
height: auto;
}
Si l’espace sur l’écran est suffisant l’image gardera sa taille originale. Mais au contraire, si l’espace de l’écran n’est pas suffisant, l’image adoptera automatiquement une taille adaptée à l’écran sur laquelle on la visionne. Et voila le tour est joué !
