CATALOGUE Design et Infographie Formation WebDesign UX / UI Apprendre le Responsive Design - en HTML5 et CSS3

Optimisation d'images pour le web avec Photoshop

Retour à la formation
Chapitre 3 Leçon 2
Précédent
Suivant

Apprenez à optimiser vos images pour le web en utilisant la commande Enregistrer pour le web dans Photoshop.

Détails de la leçon

Description de la leçon

Après avoir réalisé les maquettes, il est indispensable de créer les différents éléments qui constitueront la page HTML, notamment les images. Pour cela, il faut utiliser la commande Enregistrer pour le web dans Photoshop. Cette commande permet d'optimiser parfaitement les images pour différents formats tels que JPEG, GIF et PNG.

La boîte de dialogue de cette commande présente généralement quatre vignettes permettant de comparer le poids et la qualité de l'image dans différents formats. Par exemple, les formats GIF, JPEG, et PNG peuvent être comparés facilement. Ensuite, il est possible de comparer différentes qualités d'un même format pour choisir le meilleur compromis entre qualité et poids de l'image. En effet, une qualité JPEG de 80 est souvent suffisante pour une image destinée au web et a un poids beaucoup plus faible qu'une qualité de 100.

Il est également possible de modifier la taille de l’image de sortie au dernier moment. Enfin, pour des fichiers de type logo, il est recommandé d'utiliser les formats GIF ou PNG avec transparence, plutôt que le format JPEG.

Objectifs de cette leçon

Les objectifs de cette vidéo sont de :

  • Présenter l'importance de l'optimisation des images pour le web
  • Expliquer comment utiliser la commande 'Enregistrer pour le web' de Photoshop
  • Comparer différents formats d'image et leurs implications sur la qualité et le poids
  • Fournir des conseils pour choisir les meilleures options d'optimisation

Prérequis pour cette leçon

Pour suivre cette vidéo, il est recommandé de :

  • Connaître les bases de Photoshop
  • Avoir des notions sur les différents formats d'image (JPEG, GIF, PNG)
  • Comprendre l'importance de l'optimisation des images pour le web

Métiers concernés

Les compétences présentées dans cette vidéo sont utiles dans plusieurs domaines professionnels tels que :

  • Web design
  • Développement web
  • Graphisme
  • Marketing digital

Alternatives et ressources

En plus de la commande 'Enregistrer pour le web' de Photoshop, d'autres outils et logiciels peuvent être utilisés pour l'optimisation des images :

  • Adobe Lightroom
  • GIMP
  • ImageOptim
  • Affinity Photo

Questions & Réponses

La commande 'Enregistrer pour le web' permet d'optimiser les images pour qu'elles soient plus légères et adaptées à une utilisation sur des pages web, ce qui améliore les temps de chargement et l'expérience utilisateur.
Les formats d'image couramment utilisés pour le web sont JPEG, GIF, et PNG, chacun ayant ses propres avantages en termes de qualité et poids.
Il est important de trouver un équilibre entre la qualité de l'image et son poids. En général, une qualité JPEG de 80 est suffisante pour une image destinée au web, offrant un bon compromis entre qualité et légèreté.