Ce qu'il faut savoir
- Ouvrir une image dans Photoshop. Sélectionnez Image > Taille de l'image. Entrez une nouvelle largeur, puis sélectionnez Pixels > OK.
- Choose File > Save for Web and Devices. Choisissez l'onglet 2-Up pour voir les images originales et optimisées côte à côte.
- Modifiez la valeur Quality et affichez les résultats. Ajustez la taille ou le type de fichier si nécessaire. Sélectionnez Enregistrer et nommez la nouvelle image.
Cet article explique comment utiliser l'outil Enregistrer pour le Web de Photoshop pour optimiser les images à utiliser sur le Web. Ces informations s'appliquent à Photoshop 20.0.10 et versions ultérieures. Les commandes et les options de menu peuvent différer d'une version à l'autre.
Comment enregistrer pour le Web dans Photoshop
Les graphistes, les concepteurs Web et les autres personnes qui créent du contenu pour le Web créent également des images prêtes pour le Web telles que des photos pour des sites Web et des bannières publicitaires. Avant de télécharger ces images, ils optimisent les images pour les télécharger et les afficher rapidement dans un navigateur Web.
Voici comment utiliser l'outil Enregistrer pour le Web dans Photoshop pour obtenir le bon équilibre entre qualité d'image et taille de fichier pour vos images.
- Ouvrez l'image que vous souhaitez enregistrer dans Photoshop.
-
Select Image > Taille de l'image. Ou, pour PC, appuyez sur Alt+Ctrl+I, pour macOS, appuyez sur Command+Option+I sur le clavier.
-
Dans le champ Largeur, entrez une nouvelle largeur, sélectionnez Pixels, puis sélectionnez OK.
Redimensionner la photo à une petite taille pouvant être utilisée sur un site Web.
-
Select File > Export > Save for Web (Legacy). Ou utilisez le raccourci clavier: Alt/Option+Commande+Maj+S.
Dans les autres versions de Photoshop, le chemin est File > Export > Save for Web. L'élément peut s'appeler Enregistrer pour le Web ou Enregistrer pour le Web et les appareils.
-
Dans la fenêtre Enregistrer pour le Web, accédez à Original, Optimisé,2-Up et 4-Up. Ces onglets permettent de basculer entre une vue de la photo d'origine, la photo optimisée avec les paramètres Enregistrer pour le Web qui lui sont appliqués, ou une comparaison de deux ou quatre versions de la photo.
Choisissez 2-Up pour comparer la photo originale avec la photo optimisée. Cela affiche des copies côte à côte de l'image.
-
Changez la valeur Quality. Lorsque vous réduisez la qualité, l'image semble plus floue et la taille du fichier diminue. Des fichiers plus petits signifient des pages Web à chargement plus rapide.
Trouvez un juste milieu entre la taille et la qualité du fichier. Une qualité entre 40 et 60 est une bonne fourchette. Utilisez les niveaux de qualité prédéfinis (JPEG Medium, par exemple) pour gagner du temps.
-
Changez le type de fichier, si nécessaire, en JPEG, GIF, PNG-8, PNG-24 ou WBMP.
-
Modifier la taille de l'image, si nécessaire. Saisissez une largeur ou une hauteur, ou mettez-la à l'échelle selon un pourcentage.
Cliquez sur l'icône maillon de chaîne pour modifier la proportion de l'image. Sinon, entrez une largeur ou une hauteur différente pour modifier l'autre valeur en proportion.
-
Les valeurs sous l'aperçu de l'image affichent le type de fichier, sa taille et le temps qu'il faudra à l'image pour s'ouvrir sur un site Web. Ces chiffres sont mis à jour au fur et à mesure que vous apportez des modifications.
-
Lorsque vous êtes satisfait de la photo, sélectionnez Enregistrer.
-
Tapez un nom pour la photo, puis cliquez sur Enregistrer.
Qu'est-ce qui rend un graphique prêt pour le Web ?
La plupart des graphiques prêts pour le Web partagent des caractéristiques communes:
- La résolution est de 72 dpi.
- Le mode couleur est RVB.
-
La taille des fichiers est réduite pour un chargement plus rapide des pages Web.