webdesign - jpg ou png, lequel est le meilleur pour le web
Je suis développeur Web depuis un certain temps, et j'ai l'habitude de transformer tous mes designs au format de fichier png afin de construire mes pages web. Malgré le fait que le png, contrairement au jpg, permette la transparence des images, est-ce une meilleure solution?
La question concerne le temps de chargement des pages et les meilleures pratiques de conception Web, ainsi que la taille du fichier par rapport à la qualité des images.
Quelle est selon vous la meilleure solution à utiliser?
Cela dépend.
Le PNG est meilleur pour des images nettes avec un faible nombre de couleurs,
JPG est meilleur pour une image à faible bande passante - mais il n'est pas aussi net et donc pas très bon pour l'interface graphique.
Généralement, JPG est pour les photos et les images, tandis que PNG (ou GIF) est pour la mise en page.
Vous pouvez trouver cette page intéressant, car il passe en revue les bases de PNG vs GIF.
Google a très bien écrit à ce sujet. De Sélection du bon format d'image , vous pouvez trouver un organigramme pour prendre la décision:
Étant donné la vitesse toujours croissante de la connexion Internet moyenne, je n'ai pas tendance à penser que le temps de chargement des pages est plus une préoccupation [canards!]; Il est vraiment beaucoup plus utile de réfléchir à ce que vous essayez de réaliser avec les ressources dont vous disposez: par exemple, la bande passante est-elle limitée? Alors, tendre vers une compression plus lourde est une évidence. Le contenu graphique du site va-t-il augmenter, garantissant que le coût de l'espace serveur augmentera avec le temps? Ensuite, tendre vers une compression plus lourde retardera ce coût. Est-ce un site de portfolio d'art? Alors - aha! - des artefacts de compression dans le travail de l'échantillonneur peuvent en fait être souhaitables! Essayez-vous de fouetter un jeu? Ensuite, les captures d'écran devraient probablement être ultra-nettes.
En général, je répète donc ce qui a été dit, bien que peut-être dans un langage légèrement différent: Pour le site mobilier, qui a tendance à être généré par ordinateur et qui sera mis en cache pour être réutilisé entre les pages, a tendance à png; Pour le site conten, qui sera souvent spécifique à la page et probablement assez grand et complexe pour masquer la compression avec perte, a tendance à jpg.
En ce qui concerne spécifiquement le passage au png lorsque vous décidez que cela est approprié, exécutez tout via PNGCrush comme une évidence - sinon ils ne seront pas affichés avec les couleurs que vous attendez dans chaque navigateur et la qualité globale de votre conception sera diminuée .
"Étant donné la vitesse sans cesse croissante de la connexion Internet moyenne, je n'ai pas tendance à penser que le temps de chargement des pages est plus un problème"
Selon l'optimisation du référencement du site Web, Google classe votre site Web moins bien si le temps de chargement de la page est supérieur à 2 secondes, de sorte que la compression est nécessaire, en particulier sur les nouveaux sites Web riches en graphiques.
jpg est généralement préféré pour les images photographiques qui ont beaucoup de couleurs subtilement différentes. png fonctionne bien avec les graphiques générés par ordinateur.
C'est ma règle d'or.
Je suis un débutant et surtout ce que je fais est que si l'image est trop grande, je la fais petite à moins que ce soit une image de fond. Et si c'est pour la mise en page, je choisis PNG et JPG pour les photos.