Configurações de cores do Photoshop para web design


9

Quais configurações de perfil de cores devem ser usadas no Photoshop para web design? O efeito de calibração do monitor salva as imagens da web?

Eu mantenho meu monitor calibrado com um colorímetro e quero garantir que minhas cores sejam consistentes em todos os principais navegadores.

Uso meu perfil de monitor calibrado no meu espaço de trabalho, desabilito o gerenciamento de cores e não incorporo um perfil para salvar na Web e tento usar .png 24 sempre que possível. Essa é a melhor prática?

Configurações de cores

insira a descrição da imagem aqui

Salvar para a web

insira a descrição da imagem aqui


11
Possível ponto de interrogação suplementar - embora você tenha explicado que a Web é o seu caso de uso, as configurações acima são "seguras" se você precisar editar a arte CMYK de outra pessoa ocasionalmente?
e100

Bom ponto. Não tenho muita experiência com impressão ou CMYK, então não saberia.
26411 Chris_O

Respostas:


5

"Gerenciamento de cores" e "desenvolvimento da web" nunca devem ser usados ​​na mesma frase, a menos que seja qualificado com "não se preocupe", "perda de tempo" ou "fuggedaboudit". Os motivos descritos pelo lawndartcatcher estão corretos. Ainda não vi um escritório (que não seja um estúdio de design gráfico) em que dois monitores exibissem as mesmas cores. Os computadores domésticos são pelo menos tão ruins.

Se você trabalha principalmente na Web, o sRGB deve ser o padrão, porque esse é o padrão da Internet e é para isso que todos os agentes de usuários (navegadores) são criados para exibir.

NÃO incorpore um perfil de cores nas imagens dos sites. Eles adicionam tamanho à imagem, mas não adicionam nenhuma informação útil; portanto, tudo o que você faz é tornar suas páginas mais pesadas. Ao salvar para Web e dispositivos do Photoshop, desmarque a opção "Incorporar perfil de cores". Como medida de segurança, mantenha a opção "Converter em sRGB" marcada (caso esteja lidando com uma imagem que esteja em algum outro espaço de cores e esqueça de convertê-la).

Para responder às suas outras perguntas: A calibração do monitor não afeta as imagens SfW, exceto quando você usa o perfil de monitor como o perfil de cores da imagem (o que você nunca deve fazer por qualquer motivo ou para qualquer finalidade que não seja o papel de parede pessoal da área de trabalho).

PNG-24 é útil para imagens com transparência. Se não houver transparência envolvida, o jpeg geralmente fornece um arquivo menor para a mesma qualidade de imagem e para imagens simples com poucas cores, e especialmente se elas tiverem bordas rígidas (logotipos sendo o exemplo clássico) .gif é geralmente a melhor escolha.


7

Bem, o grande problema é que você gastará muito tempo e se preocupará em calibrar e escolher cores (bom para você!) E provavelmente será visto por pessoas que nem conseguem trabalhar Botões "Brilho" no monitor. Todos os meus colegas de trabalho (não projetados) têm duas telas, e nenhum deles se iguala. Portanto, se você está perguntando "Existe alguma maneira desse vermelho específico que meu cliente solicitou sempre parecerá correto com base na calibração minuciosa que eu executei?" infelizmente, a resposta será:

Não.

Mas (e isso é muito grande, mas) todo o cuidado que você toma é importante. Ao manter um perfil consistente, todas as suas páginas / cores terão a mesma aparência no mesmo monitor. Lembre-se de que nem todo mundo não está usando o mesmo monitor que você, portanto nem sempre será o mesmo.

Ao não incorporar um perfil, pode deixar a porta aberta para um navegador substituir o perfil atual. Se você conseguir que os principais navegadores concordem com o manuseio de cores, provavelmente há algum tipo de prêmio Nobel para você.

Para encurtar a história, sim - todo o cuidado que você toma é importante e as configurações que você está usando são boas (embora eu pessoalmente busque um perfil RGB um pouco mais genérico). Mas há tanto controle que você terá quando o design sair da sua máquina e sair para o vasto mundo de usuários desconhecidos da web.


Muito útil obrigado! Acho que minha maior preocupação é que, se eu usar um gráfico que criei como cor # 172550 no Photoshop, meu # 172550 em CSS corresponda ao gráfico em qualquer monitor.
26411 Chris_O

você também pode trabalhar com cores Web Safe
Jack

2
As cores seguras da Web são uma boa maneira de "limitar o dano", mas infelizmente a cor # 172550 só parecerá diferente em geral porque a grande maioria das pessoas nunca calibra seus monitores. Se você estivesse trabalhando com impressão, seria mais fácil, pois as impressoras profissionais trabalham fora dos padrões Pantone, para que saibam como é a aparência # 172550.
lawndartcatcher

2
Navegadores usam sRGB. Esse é o padrão W3C. O uso de qualquer outro perfil de cor para uma imagem garante que ela seja diferente quando visualizada em um navegador.
Alan Gilbertson

2
As cores seguras para a Web são irrelevantes aqui (e em qualquer outro lugar: graphicdesign.stackexchange.com/questions/40/… )
e100

3

+1 Chris, essa é realmente uma boa pergunta, exatamente, eu não sei muito bem disso, mas quando me interessei por essa pergunta, encontrei alguns artigos sobre o mesmo, talvez eles o ajudem quando eu mudei minha configuração de acordo com eles. um olhar, isso também pode resolver sua curiosidade.

  1. gerenciamento de cores por ivan
  2. Dicas para gerenciar cores no Photoshop para web
  3. Gerenciamento de cores para combinar cores em vários dispositivos
  4. essas configurações ninguém deve usar para photoshop

Espero que isso não ajude um pouco .......


Lembro-me do artigo da Smashing Magazine e do debate que se seguiu. O último artigo faz mais sentido. Obrigado!
26411 Chris_O

sempre bem-vindo ...
Jack

1

Meu sentimento sincero sobre o gerenciamento de cores da Web reflete os expressos acima, mas com algumas ressalvas.

De um modo geral, faz sentido manter um fluxo de trabalho gerenciado por cores do seu lado, para que você possa, pelo menos, ter um bom ponto de partida - se estiver projetando fora de um fluxo de trabalho gerenciado por cores, e a combinação de monitor / software para almoçar (projeções de cores não intencionais, problemas de gama e gama, etc.), você aumenta o risco de que outro equipamento do usuário final não calibrado esteja fora do alcance de uma quantidade equivalente na direção oposta e acaba vendo algo duas vezes mais mal exibido do que se tivesse sido projetado em um fluxo de trabalho gerenciado por cores em primeiro lugar, com base nas decisões de cores tendenciosas que você tomou.

Além disso, embora eu nunca marque imagens gráficas (cabeçalhos, navegação, planos de fundo etc.) para sites e modelos de sites (uma vez que isso pode causar diferenças desagradáveis ​​entre cores especificadas em hexadecimal e imagens gerenciadas por cores que acabam sendo gerenciadas por cores) nos poucos navegadores que realmente respeitam os perfis de cor), eu faço frequentemente fotografias de tag. Imagens particularmente de alta resolução. Na rara ocasião em que o usuário final está visualizando o conteúdo em um navegador gerenciado por cores, os perfis garantem que o usuário esteja vendo a fotografia como foi tirada e que os tons de pele, o céu, a água etc. representado corretamente.

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.