Par exemple, une image 1x1 charge-t-elle plus rapidement qu'un 2x2? La taille serait plus petite, mais le navigateur devra travailler deux fois autant, non?
Ainsi, y a-t-il une taille et une forme idéales (carré vs rectangle) pour les images de fond?
Je sais que ce n'est probablement pas trop important, mais je suis intéressé à savoir.
merci
5 Réponses :
Je ne pense pas qu'il y ait une taille "idéale" pour votre image.
Bien que la qualité de l'image ait un rôle dans le temps de téléchargement. Une image avec des couleurs riches intégrées sera de taille lourde par rapport à une autre avec la même dimension.
Enfin, le choix d'une image d'arrière-plan entièrement Si vous devez optimiser les performances d'un site en utilisant de nombreuses images de fond, vous pouvez regarder
et certains outils d'optimisation de l'image
12 outils d'optimisation d'image vraiment utiles Pour les concepteurs Web
CSS Sprits est NEAT ... merci pour le lien
J'ai remarqué que le carrelage de très petites images (telles que 1 × 1 ou 2 × 2) est très lente dans de nombreux navigateurs. Depuis avec les formats d'image la plupart de compression, il n'ya presque pas d'inconvénient d'être plus grand avec des répétitions, je pense au moins pour les images de carrelage, vous devez opter pour des images autour d'au moins 50 × 50 pixels afin de réduire la complexité de dessin dans l'UA.
question intéressante. Vous devriez demander à chacun des fournisseurs de navigateur, car ils ont chacun des façons différentes de rendre des images.
Mais en réalité, ignorant la durée de téléchargement toute différence dans le temps de rendu sera négligeable, il est donc logique de simplement utiliser une image plus petite si vous le pouvez.
Je ferai également remarquer l'évidence que si vous utilisez une image répétée 1x1, vous devez utiliser une couleur d'arrière-plan à la place.
Dans certains cas, vous pourriez avoir besoin d'une image au lieu d'une couleur d'arrière-plan, car les couleurs ne sont pas toujours affichées exactement la même.
GUFFA: Même chose pour les images, cependant. Et idéalement, les algorithmes pour déterminer la couleur affichée doivent être identiques pour les couleurs et images solides.
Vous voudrez peut-être une image png semi-transparente
J'ai dû utiliser une image transparente 1x1 dans un projet pour saisir des clics dans une DIV, sinon les clics ne seraient pas pris sur la DIV, mais par tout ce qui était derrière elle (c'est-à-dire seulement).
La taille idéale différerait d'un navigateur à l'autre, d'un système à l'autre.
Évitez de le rendre trop petit ou trop grand. Une image d'arrière-plan La taille 1x1 peut avoir des problèmes de rendu dans certains navigateurs. Vous devriez au moins en faire quelques pixels dans chaque dimension.
Je me souviens que Netscape 4 a refusé de répéter des images s'ils étaient moins que quelque chose comme dix pixels de large. Les navigateurs d'aujourd'hui sont moins sensibles, mais il est toujours logique de ne pas rendre les images trop petites.
La compression des images (au moins pour les images GIF et PNG) est basée sur la répétition, de sorte que si vous apportez l'image plus grande en le répétant, la taille d'image supplémentaire ajoutera très peu à la taille du fichier.
Juste pour noter: Si vous essayez d'accélérer le téléchargement, la surcharge de téléchargement de 1x1 Image vs. Dites, 10x10, est négligeable, en particulier pour des images décemment comprimées - pour le client et le serveur.
Par conséquent, puisque le rendu est définitivement plus rapide / meilleur avec 10x10, optez pour une taille d'image plus grande.