Que dois-je faire concernant le profil de couleur lors de la conception pour le Web?


15

J'ai lu cet article de Doug Avery où il explique comment désactiver la gestion des couleurs dans Adobe Photoshop et l' article de suivi en réponse au tollé des commentateurs qui s'y opposent et soutiennent le sRGB, bien que je ne sois toujours pas convaincu de la technique que je devrait s'appliquer dans mon flux de travail personnel.
D'après ce que j'ai rassemblé en lisant l'article (corrigez-moi si je me trompe), la bonne façon de gérer cela serait de faire en sorte que Photoshop gère les couleurs en tant que sRGB et d'utiliser les couleurs d'épreuve lorsque vous en avez besoin de plus aperçu "fidèle" de votre travail.

Pour le moment, j'ai un projet de site Web complet qui a été conçu avec des profils de couleurs désactivés. J'ai commencé comme ça car il y a des mois, j'avais remarqué que les couleurs rendues par Photoshop, bien que rapportées correctement par l' outil Eyedropper de Photoshop , ne correspondaient pas, mesurées à partir d'une capture d'écran, à ce que je voyais dans Google Chrome lors de l'ouverture de l'image exportée en tant que PNG.
Après une recherche rapide, je suis tombé sur le message que j'ai cité plus tôt et j'ai appliqué ses suggestions à l'aveuglette (sans même remarquer le suivi ni lire les problèmes). Depuis lors, je n'ai eu aucun problème: je prends des captures d'écran de mon travail dans Photoshop et je les télécharge pour que le développeur puisse les utiliser. Il voit les mêmes couleurs que je vois et utilise lors du développement du design, et je n'ai pas à sauter à travers des cerceaux pour voir ce que je fais réellement.

Mes questions:

  • Est-il vraiment nécessaire d'utiliser sRGB dans une conception Web (je comprends les implications de ne pas l'utiliser dans quelque chose comme la photographie ou l'impression) quand cela ajoute seulement plus de travail en vous forçant à utiliser les couleurs d'épreuve ? (C'est comme ça que je le vois, corrigez-moi si je me trompe)

  • Étant donné que l'enregistrement avec un profil ICC conduira certains navigateurs à appliquer correctement le profil tandis que d'autres l'ignoreront, l'article indique également que c'est probablement la meilleure idée de simplement concevoir avec sRGB, puis d'enregistrer sans profil ICC . Cela ne va-t-il pas à l'encontre de l'objectif d'utiliser le profil de couleur en premier lieu? Ou suis-je mal interprété ce que dit l'article?


1
Je ne pense pas que la réponse de Marc Edwards soit correcte. Si vous définissez votre profil de couleurs sur "surveiller", votre couleur ne sera superbe que pour une seule personne: vous! sRGB permet à un plus large éventail de personnes de visualiser de manière plus cohérente. Lisez ce lien. Il offre les meilleures informations que j'ai trouvées à ce sujet. gballard.net/psd/saveforwebshift.html

Réponses:


5

Mon opinion (parfois controversée): les gens qui recommandent d'utiliser sRGB pour l'interface utilisateur et la conception Web sont fous. Voici pourquoi.

Pour que la gestion des couleurs fonctionne pour la conception d'écran, trois choses importantes doivent se produire.

  1. L'image doit être créée à l'aide du flux de travail correct.
  2. L'image doit être enregistrée avec le profil de couleur ICC correct.
  3. L'image doit être affichée correctement, en respectant le profil de l'image et l'environnement dans lequel elle est affichée (le navigateur et le système d'exploitation, etc.).

Si vous n'avez pas les trois, la gestion des couleurs ne fonctionne pas du tout. Avoir une ou deux de ces choses signifie que la chaîne entière est brisée.

Et voici le hic: tous les PNG et GIF enregistrés à partir de Photoshop ne peuvent pas avoir de profils ICC, donc le numéro 2 n'est pas possible dans la plupart des cas (les JPEG peuvent cependant avoir des profils). Et beaucoup de navigateurs ne se comportent pas correctement, donc le numéro 3 est également disponible dans de nombreux cas.

Si vous affichez une photo sur le Web, votre meilleure option est de convertir de manière destructive en sRGB et d' incorporer un profil ICC sRGB et d' utiliser uniquement des JPEG. Si vous créez des éléments d'interface utilisateur Web, votre meilleure option est de configurer Photoshop pour cibler le "périphérique RVB" (couleurs natives sans profil ni gestion des couleurs).

Les conseils de Doug Avery sont bons. La partie importante de son message est la grille qu'il utilise pour comparer tous les résultats. Il cherche à faire correspondre HTML, CSS et couleurs dans les images, ce qui est la bonne chose à viser. Cela n'est possible que si les valeurs de couleur dans les images et les valeurs de couleur utilisées en HTML / CSS sont traitées de la même manière.

J'ai écrit beaucoup plus sur le sujet ici:

Gestion des couleurs et conception d'interface utilisateur

Et argumenté ad nausium avec un ingénieur Adobe ici:

Enregistrer pour le Web, Convertir en sRGB doit être désactivé par défaut pour les PNG et les GIF

Est-il vraiment nécessaire d'utiliser sRGB dans une conception Web (je comprends les implications de ne pas l'utiliser dans quelque chose comme la photographie ou l'impression) quand cela ajoute seulement plus de travail en vous forçant à utiliser les couleurs d'épreuve? (C'est comme ça que je le vois, corrigez-moi si je me trompe)

Non, ce n'est pas nécéssaire. En fait, supposer que le sRGB contribue à aider démontre un manque de compréhension du sujet. Il y a des situations où vous devriez certainement utiliser sRGB, mais cela fait partie d'un flux de travail photo complet: vous devez utiliser des images JPEG, utiliser sRGB et intégrer un profil sRGB. Vous ne pouvez pas faire une partie de cela sans tout faire et vous attendre à tout avantage de la gestion des couleurs.

Si vous enregistrez des GIF ou PNG à partir de Photoshop, vous n'aurez jamais de profil ICC dans vos images, vous devez donc vous assurer que votre flux de travail est configuré pour cela et comment les navigateurs traiteront les images.

Étant donné que l'enregistrement avec un profil ICC conduira certains navigateurs à appliquer correctement le profil tandis que d'autres l'ignoreront, l'article indique également que c'est probablement la meilleure idée de simplement concevoir avec sRGB, puis d'enregistrer sans profil ICC. Cela ne va-t-il pas à l'encontre de l'objectif d'utiliser le profil de couleur en premier lieu? Ou suis-je mal interprété ce que dit l'article?

Garde en tête que:

  • Les GIF ne peuvent pas avoir de profils ICC.
  • Les fichiers PNG enregistrés par Photoshop ne peuvent pas avoir de profils ICC.
  • Les fichiers PNG peuvent avoir des profils, mais il est rare qu'ils soient enregistrés avec eux.
  • Les fichiers JPEG peuvent avoir des profils.
  • Le rendu par le navigateur d'images avec des profils diffère d'un navigateur à l'autre.
  • Les couleurs HTML et CSS sont souvent supposées être des périphériques RVB ou sRVB, et vous n'avez aucun contrôle sur cela.

4
J'ai 6 ordinateurs à la maison et deux moniteurs calibrés au travail. Un moniteur calibré n'a tout simplement pas une gamme décente, donc même avec le calibrage, il n'est pas fiable. Tous les six à la maison sont en stock et ils affichent tous des couleurs différemment. Ceci est une leçon d'utilisation du monde réel. Voici comment j'ai appris à cesser de m'inquiéter et à l'aimer.
horatio

3
Ouais. L'objectif est la cohérence au sein de la page pour les éléments de l'interface utilisateur, plutôt que la cohérence entre les différents affichages (ce qui est impossible dans la plupart des circonstances).
Marc Edwards

3

Les profils sont absolument nécessaires si vous développez / concevez sur Mac.

Si je travaille sur mes images dans Photoshop en tant qu'Adobe RVB ou ProPhoto RVB (les 2 profils utilisés par un bon appareil photo), les couleurs changent BEAUCOUP lorsque le PSD est enregistré pour le Web et affiché sur un PC Windows.

Pour un utilisateur Mac, l'utilisation du profil sRGB dans les fichiers WORKING est nécessaire pour conserver les couleurs sur toutes les plateformes.

Le fichier final publié (sauf pour le Web) n'a pas de profil, mais l'utilisation de sRGB lors de sa création est nécessaire sur Mac - au moins est sur le nôtre si vous voulez que les couleurs se ressemblent sur Mac et Windows.


2

Je voudrais confirmer les déclarations de ces paragraphes:

D'après ce que j'ai rassemblé en lisant l'article (corrigez-moi si je me trompe), la bonne façon de gérer cela serait de faire en sorte que Photoshop gère les couleurs en tant que sRGB et d'utiliser les couleurs d'épreuve lorsque vous en avez besoin de plus aperçu "fidèle" de votre travail.

et

Étant donné que l'enregistrement avec un profil ICC conduira certains navigateurs à appliquer correctement le profil tandis que d'autres l'ignoreront, l'article indique également que c'est probablement la meilleure idée de simplement concevoir avec sRGB, puis d'enregistrer sans profil ICC. Cela ne va-t-il pas à l'encontre de l'objectif d'utiliser le profil de couleur en premier lieu? Ou suis-je mal interprété ce que dit l'article?

Je fais la distinction entre l'environnement de production (connu et auto-contrôlé) et le périphérique de sortie, et j'organise le flux de travail en fonction de ce qui est le mieux pour les photos. Laissez-moi expliquer:

Lorsque j'ouvre des photos de mon appareil photo numérique, j'ai la possibilité de les ouvrir avec le profil sRGB contenu. Si je les ouvre sans le profil, je perdrais des informations importantes (les couleurs sont différentes). Je garde donc également le profil pour un traitement ultérieur. Avec le profil contenu, Photoshop peut adapter les couleurs à mon profil de moniteur, aux profils auxquels j'accède pour les couleurs d'épreuve, à mon profil d'imprimante et à tous les profils avec lesquels mon collègue travaille.

Si vous utilisez des photos dans vos fichiers de conception, vous devez créer la toile vierge avec un profil attaché. Et si vous remettez le fichier de conception et non les graphiques finaux à un développeur, il est bon d'avoir toujours le profil attaché ...

J'enregistre les fichiers finaux sans profil et ils se présentent comme prévu. Pourquoi est-ce si? Je pense que parce que les graphiques sans profil sont interprétés comme s'ils avaient un profil sRGB attaché (peut-être que quelqu'un connaît une référence pour cela).

Et je suppose également que lorsque vous prenez une capture d'écran, votre système convertit les couleurs de votre profil de moniteur en sRGB (ou vous avez un très bon moniteur proche de l'espace colorimétrique sRGB).


1

La réponse à votre première question: si vous n'utilisez pas sRGB dans le flux de travail, toutes les images utilisées à partir d'autres espaces colorimétriques ne finiront pas par avoir des couleurs précises ou même recadrées sur le Web. La plupart des images sans profil que vous importez ou utilisez feront l'affaire car elles sont déjà dans le bon espace colorimétrique (par exemple l'espace standard dans l'appareil photo).

2ème question, oui le but est échoué car l'utilisation des profils de couleurs n'est pas encore implémentée sur le web de telle manière que vous pouvez les utiliser. Les navigateurs attendent le sRGB, il n'est donc pas nécessaire de les attacher, cela augmente simplement la taille du fichier. Parce que beaucoup de navigateurs ne comprennent pas les profils, ce n'est pas une bonne idée de proposer des images avec un profil, par exemple Adobe rgb 1998, car les couleurs seront recadrées.


"Les navigateurs attendent le" sRGB "- en quelque sorte. Il existe un comportement mixte entre les navigateurs. La plupart rendent des images non marquées en tant que périphérique RVB (pas de conversion). Safari 6 sur OS X suppose (à tort) que les images non balisées sont sRGB et convertit.
Marc Edwards

0

Mise à jour pour Adobe Photoshop CC (2017):

  1. Laissez votre espace de travail par défaut (North American General Purpose 2)

  2. Ne changez rien d'autre

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.