Vitesse du site: moins d'images en Ko que moins de requêtes HTTP
J'ai un problème intéressant, je suppose ...
Tout d'abord, je souhaite utiliser des images-objets afin de réduire la requête HTTP sur mon site. C'est parce que je sais que c'est mieux pour le référencement et que le site est plus rapide, la plupart du temps.
La chose intéressante, cependant, est que mon Sprite est plus grand que si j'utilise quatre images d'arrière-plan distinctes. Le Sprite: 20 Ko contre 10 Ko si j'utilise 4 images distinctes.
20 Ko vs. 10 Ko = 1 requête vs 4 requêtes.
Qu'est-ce qui pèse plus?
P.S .: les images de fond sont utilisées parce que je veux distinguer le forum posté; donc pas indispensable, mais je l'ai trouvé nécessaire.
P.S. 2: Je sais qu'il vaut mieux utiliser les balises <img> avec l'attribut alt, mais je n'ai pas le choix dans celui-ci, car c'est conditionnel.
De nos jours, avec les connexions Internet que nous avons, 20 Ko est une taille minuscule et donc presque rien à charger. C'est pourquoi je vous conseille d'utiliser l'image des sprites au lieu de 4 requêtes HTTP. De plus, vous obtenez des images-objets pour afficher des images plus rapidement.
Cependant, une différence de 10 kb est nécessairement en faveur de l'image des sprites, mais si vous avez une différence plus importante, telle que 400 kb, un bon moyen de connaître la meilleure option consiste à charger la page avec vos deux cas de test et à voir dans quel cas votre la page se charge plus rapidement (car plus votre site se charge rapidement, meilleur est le référencement). La console de Safari, Chrome ou Firebug pour Firefox peut vous aider.
Sinon, considérez les images-objets comme une option qui ne devrait être utilisée que pour les icônes, les pictos, etc. (éléments décoratifs). <img> les balises avec l'attribut alt sont utilisées différemment; un bouton d'envoi ou une photo par exemple. N'oubliez pas que les attributs alt pour les icônes, les pictos, etc. ne sont pas pertinents.