O que devo fazer em relação ao perfil de cores ao projetar para a Web?


15

Li este artigo de Doug Avery, onde ele explica como desativar o Gerenciamento de cores no Adobe Photoshop e o artigo de acompanhamento em resposta ao tumulto dos comentaristas que discutem e apoiam o sRGB, embora eu ainda não esteja convencido de qual técnica eu deve aplicar-se no meu fluxo de trabalho pessoal.
Pelo que reuni durante a leitura do artigo (corrija-me se estiver errado), a maneira correta de lidar com isso seria fazer com que o Photoshop gerencie as cores como sRGB e faça uso de cores de prova quando necessário. visualização "fiel" do seu trabalho.

No momento, tenho um projeto de site inteiro que foi projetado com perfis de cores desativados. Comecei assim porque meses atrás eu havia notado que as cores renderizadas pelo Photoshop, embora relatadas corretamente pela ferramenta Eyedropper do Photoshop , não correspondiam quando medidas de uma captura de tela ao que eu estava vendo no Google Chrome ao abrir a imagem exportada como um PNG.
Após uma rápida pesquisa, me deparei com o post que citei anteriormente e apliquei suas sugestões cegamente (sem nem perceber o acompanhamento nem ler sobre os problemas com ele). Desde então, não tenho problemas: faço capturas de tela do meu trabalho no Photoshop e as carrego para o desenvolvedor fazer uso. Ele consegue ver as mesmas cores que eu vejo e uso no desenvolvimento do design, e não preciso pular arestas para ver o que estou realmente fazendo.

Minhas perguntas:

  • É realmente necessário usar o sRGB em um web design (eu entendo as implicações de não usá-lo em algo como fotografia ou impressão) quando ele adiciona mais trabalho forçando você a usar o Proof Colors ? (É assim que eu vejo, corrija-me se estiver errado)

  • Como o salvamento com um perfil ICC levará alguns navegadores a aplicá-lo corretamente, enquanto outros o ignoram, o artigo também diz que provavelmente é a melhor ideia apenas projetar com sRGB e salvar sem o perfil ICC . Isso não anula o propósito de usar o perfil de cores em primeiro lugar? Ou estou interpretando mal o que o artigo diz?


11
Não acho que a resposta de Marc Edwards esteja certa. Se você definir seu perfil de cores para "monitorar", sua cor ficará ótima para apenas uma pessoa: você! O sRGB permite que um maior número de pessoas veja com mais consistência. Leia este link. Oferece as melhores informações que encontrei ainda sobre o assunto. gballard.net/psd/saveforwebshift.html

Respostas:


5

Minha opinião (às vezes controversa): as pessoas que recomendam o uso de sRGB para interface do usuário e web design são loucas. Aqui está o porquê.

Para que o gerenciamento de cores funcione no design da tela, há três coisas importantes que devem acontecer.

  1. A imagem deve ser criada usando o fluxo de trabalho correto.
  2. A imagem deve ser salva com o perfil de cores ICC correto.
  3. A imagem deve ser exibida corretamente, aderindo ao perfil da imagem e ao ambiente em que está sendo exibida (no navegador e no SO, etc.).

Se você não tiver os três, o gerenciamento de cores não funcionará. Ter uma ou duas dessas coisas significa que toda a cadeia está quebrada.

E aqui está o problema: todos os PNGs e GIFs salvos no Photoshop não podem ter perfis ICC, portanto, o número 2 não é possível na maioria dos casos (embora os JPEGs possam ter perfis). E muitos navegadores não se comportam corretamente, então o número 3 também está disponível em muitos casos.

Se você estiver exibindo uma foto na web, sua melhor opção é converter destrutivamente em sRGB e incorporar um perfil ICC sRGB e usar apenas JPEGs. Se você estiver criando elementos da interface do usuário da web, sua melhor opção é configurar o Photoshop para segmentar o "dispositivo RGB" (cores nativas sem perfil ou gerenciamento de cores).

O conselho de Doug Avery é bom. A parte importante de seu post é a grade que ele usa para comparar todos os resultados. O que ele procura é combinar HTML, CSS e cores nas imagens, o que é a coisa certa a se procurar. Isso só é possível se os valores de cores nas imagens e os valores de cores usados ​​em HTML / CSS forem tratados da mesma maneira.

Eu escrevi muito mais sobre o tópico aqui:

Gerenciamento de cores e design de interface do usuário

E discutiu ad nausium com um engenheiro da Adobe aqui:

Salvar na Web, a opção Converter em sRGB deve estar desativada por padrão para PNGs e GIFs

É realmente necessário usar o sRGB em um web design (eu entendo as implicações de não usá-lo em algo como fotografia ou impressão) quando ele adiciona mais trabalho forçando você a usar o Proof Colors? (É assim que eu vejo, corrija-me se estiver errado)

Não, não é necessário. De fato, assumir que o sRGB está ajudando demonstra uma falta de entendimento do tópico. Há situações em que você definitivamente deve usar sRGB, mas ele faz parte de um fluxo de trabalho completo de fotos: você precisa usar imagens JPEG, usar sRGB e incorporar um perfil sRGB. Você não pode fazer parte disso sem fazer tudo e esperar qualquer benefício com o gerenciamento de cores.

Se você estiver salvando GIFs ou PNGs do Photoshop, nunca terá um perfil ICC em suas imagens, portanto, verifique se o fluxo de trabalho está configurado para isso e como os navegadores tratam as imagens.

Como salvar com um perfil ICC fará com que alguns navegadores apliquem corretamente o perfil, enquanto outros o ignoram, o artigo também diz que provavelmente é a melhor ideia apenas projetar com sRGB e salvar sem o perfil ICC. Isso não anula o propósito de usar o perfil de cores em primeiro lugar? Ou estou interpretando mal o que o artigo diz?

Tenha em mente que:

  • GIFs não podem ter perfis ICC.
  • PNGs salvos pelo Photoshop não podem ter perfis ICC.
  • PNGs podem ter perfis, mas é raro que eles sejam salvos com eles.
  • JPEGs podem ter perfis.
  • A renderização do navegador de imagens com perfis difere entre os navegadores.
  • Geralmente, assume-se que as cores em HTML e CSS são RGB ou sRGB do dispositivo e você não tem controle sobre isso.

4
Eu tenho 6 computadores em casa e dois monitores calibrados no trabalho. Um monitor calibrado simplesmente não possui uma gama decente, portanto, mesmo com a calibração, ele não é confiável. Todos os seis em casa têm estoque pronto e exibem as cores de maneira diferente. Esta é uma lição sobre o uso no mundo real. Foi assim que aprendi a parar de se preocupar e a amar.
horatio

3
Sim. O objetivo é consistência na página para elementos da interface do usuário, em vez de consistência em diferentes telas (o que é impossível na maioria das circunstâncias).
Marc Edwards

3

Definitivamente, os perfis são necessários se você estiver desenvolvendo / projetando no Mac.

Se eu trabalhar nas minhas imagens no Photoshop como Adobe RGB ou ProPhoto RGB (os 2 perfis que uma boa câmera usa), as cores mudam MUITO quando o PSD é salvo na Web e visualizado em um PC com Windows.

Para um usuário de Mac, é necessário usar o perfil sRGB nos arquivos de TRABALHO para manter as cores nas plataformas.

O arquivo final publicado (salvo para a web) não tem perfil, mas o uso de sRGB durante sua criação é necessário no Mac - pelo menos é o nosso, se você deseja que as cores sejam semelhantes no Mac e no Windows.


2

Gostaria de confirmar as declarações destes parágrafos:

Pelo que reuni durante a leitura do artigo (corrija-me se estiver errado), a maneira correta de lidar com isso seria fazer com que o Photoshop gerencie as cores como sRGB e faça uso de cores de prova quando necessário. visualização "fiel" do seu trabalho.

e

Como salvar com um perfil ICC fará com que alguns navegadores apliquem corretamente o perfil, enquanto outros o ignoram, o artigo também diz que provavelmente é a melhor ideia apenas projetar com sRGB e salvar sem o perfil ICC. Isso não anula o propósito de usar o perfil de cores em primeiro lugar? Ou estou interpretando mal o que o artigo diz?

Distingo o ambiente de produção (conhecido e autocontrolado) e o dispositivo de saída, e organizo o fluxo de trabalho de acordo com o que é melhor para fotos. Deixe-me explicar:

Quando abro fotos da minha câmera digital, tenho a opção de abri-las com o perfil sRGB contido. Se eu os abrir sem o perfil, perderia informações importantes (as cores são diferentes). Por isso, também mantenho o perfil para processamento adicional. Com o perfil contido, o Photoshop pode adaptar as cores ao meu perfil de monitor, aos perfis que eu acesso para cores de prova, ao meu perfil de impressora e a todos os perfis com os quais meu colega está trabalhando.

Se você usar fotos em seus arquivos de design, deverá criar a tela em branco com um perfil anexado. E se você entregar o arquivo de design e não os gráficos finais para um desenvolvedor, é bom ainda ter o perfil anexado ...

Eu salvo os arquivos finais sem perfil e eles parecem como o esperado. Por que? Eu acho que porque os gráficos sem perfil são interpretados como se tivessem um perfil sRGB anexado a eles (talvez alguém saiba uma referência para isso).

E também acho que, quando você tira uma captura de tela, seu sistema converte as cores do perfil do seu monitor em sRGB (ou você tem um monitor muito bom perto do espaço de cores do sRGB).


1

A resposta para sua primeira pergunta: se você não usar sRGB no fluxo de trabalho, todas as imagens usadas de outros espaços de cores acabarão por não ter cores precisas ou mesmo cortadas na Web. A maioria das imagens sem perfil que você importa ou usa funciona bem porque elas já estão no espaço de cores correto (por exemplo, o espaço padrão nas câmeras).

2ª pergunta: sim, o objetivo é anulado porque o uso de perfis de cores ainda não foi implementado na Web, de forma que você possa usá-los. Os navegadores esperam o sRGB, então não há necessidade de anexá-los, isso apenas aumenta o tamanho do arquivo. Como muitos navegadores não entendem perfis, não é uma boa ideia oferecer imagens com perfil, como Adobe rgb 1998, porque as cores serão cortadas.


"Navegadores 'esperam' sRGB" - mais ou menos. Há um comportamento misto entre os navegadores. A maioria renderiza imagens não marcadas como dispositivo RGB (sem conversão). O Safari 6 no OS X assume (incorretamente) que as imagens não marcadas são sRGB e são convertidas.
Marc Edwards

0

Atualização para o Adobe Photoshop CC (2017):

  1. Deixe seu espaço de trabalho para o padrão (Finalidade Geral da América do Norte 2)

  2. Não mude mais nada

Ao utilizar nosso site, você reconhece que leu e compreendeu nossa Política de Cookies e nossa Política de Privacidade.
Licensed under cc by-sa 3.0 with attribution required.