Photoshop Color Settings per il web design


9

Quali impostazioni del profilo colore devono essere utilizzate in Photoshop per il web design? L'effetto di calibrazione del monitor salva per le immagini Web?

Tengo il mio monitor calibrato con un colorimetro e voglio assicurarmi che i miei colori siano coerenti su tutti i principali browser.

Uso il mio profilo monitor calibrato per il mio spazio di lavoro, off gestione del colore e non incorporo un profilo per il salvataggio per il web e provo a usare .png 24 ogni volta che è possibile. È questa la migliore pratica?

Impostazioni colore

inserisci qui la descrizione dell'immagine

Salva per il web

inserisci qui la descrizione dell'immagine


1
Possibile punto di domanda supplementare: mentre hai spiegato che il web è il tuo caso d'uso, le impostazioni di cui sopra sono 'sicure' se hai bisogno di modificare l'arte di CMYK di qualcun altro di tanto in tanto?
e100,

Buon punto. Non ho molta esperienza di stampa o CMYK, quindi non lo saprei.
Chris_O,

Risposte:


5

"Gestione del colore" e "sviluppo web" non dovrebbero mai essere usati nella stessa frase, a meno che non siano qualificati con "non disturbare", "perdita di tempo" o "fuggedaboudit". I motivi per cui il prato inglese delineato è corretto. Devo ancora vedere un ufficio (diverso da uno studio di progettazione grafica) in cui due monitor mostrano gli stessi colori. I computer domestici sono almeno altrettanto cattivi.

Se lavori principalmente sul Web, allora sRGB deve essere il tuo valore predefinito, perché quello è lo standard per Internet ed è ciò che tutti gli agenti utente (browser) sono creati per essere visualizzati.

NON incorporare un profilo colore nelle immagini per i siti Web. Aggiungono dimensioni all'immagine, ma non aggiungono informazioni utili, quindi tutto ciò che fai è rendere le tue pagine più pesanti. Quando salvi per Web e dispositivi da Photoshop, assicurati di deselezionare "Incorpora profilo colore". Come misura di sicurezza, tieni selezionato "Converti in sRGB" (nel caso in cui tu abbia a che fare con un'immagine che si trova in un altro spazio colore e ti dimentichi di convertirla).

Per rispondere ad altre domande: La calibrazione del monitor non influisce sulle immagini SfW, tranne quando si utilizza il profilo del monitor come profilo colore per l'immagine (cosa che non si dovrebbe mai e poi mai fare per qualsiasi motivo o per scopi diversi da uno sfondo del desktop personale).

PNG-24 è utile per le immagini con trasparenza. Se non è coinvolta la trasparenza, jpeg di solito fornisce un file più piccolo per la stessa qualità dell'immagine e per immagini semplici con pochi colori, e soprattutto se hanno bordi netti (i loghi sono l'esempio classico) .gif è spesso la scelta migliore.


7

Bene, il grosso problema è che passerai molto tempo e ti occuperai della calibrazione e della scelta dei colori (buono per te!) E molto probabilmente saranno visti da persone che non possono nemmeno lavorare Pulsanti "Luminosità" sul loro monitor. I miei colleghi (non di design) hanno tutti due schermi, e nessuno di loro si combina nemmeno. Quindi, se stai chiedendo "Esiste un modo in cui questo particolare rosso richiesto dal mio cliente sarà sempre corretto in base alla scrupolosa calibrazione che ho eseguito?" la risposta sarà tristemente:

No.

Ma (e questo è piuttosto grande ma) tutte le cure che prendi sono importanti. Mantenendo un profilo coerente, tutte le pagine / i colori appariranno uguali sullo stesso monitor. Ricorda solo che non tutti non usano lo stesso monitor che sei, quindi non sarà sempre lo stesso.

Non incorporando un profilo, potrebbe lasciare la porta spalancata affinché un browser possa ignorare il profilo corrente. Se riesci a convincere i principali browser a concordare sulla gestione del colore, c'è probabilmente una sorta di premio Nobel per te.

Per farla breve, : tutta la cura che stai prendendo è importante e le impostazioni che stai usando sono buone (anche se personalmente vorrei cercare un profilo RGB un po 'più generico). Ma avrai solo così tanto controllo che avrai una volta che il tuo design lascerà la tua macchina e uscirà nel vasto mondo degli utenti web inconsapevoli.


Molto utile grazie! Immagino che la mia più grande preoccupazione sia che se uso un elemento grafico ho creato come colore # 172550 in Photoshop che il mio # 172550 in CSS corrisponde all'immagine su qualsiasi monitor.
Chris_O,

puoi anche lavorare con colori sicuri per il web
Jack,

2
I colori sicuri per il web sono un buon modo per "limitare il danno" ma sfortunatamente il colore # 172550 apparirà diverso su tutta la linea solo perché la stragrande maggioranza delle persone non calibrerà mai i propri monitor. Se lavorassi nella stampa questo sarebbe più facile poiché le stampanti professionali non rispettano gli standard Pantone in modo che sappiano che aspetto ha # 172550.
lawndartcatcher

2
I browser utilizzano sRGB. Questo è lo standard W3C. L'uso di qualsiasi altro profilo colore per un'immagine garantisce che sarà diverso se visualizzato in un browser.
Alan Gilbertson,

2
I colori sicuri per il Web sono irrilevanti qui (e in qualsiasi altro luogo: graphicdesign.stackexchange.com/questions/40/… )
e100

3

+1 Chris, questa è davvero una buona domanda, esattamente non lo so bene ma quando mi sono interessato a questa domanda ho trovato alcuni articoli sullo stesso, potrebbero essere di aiuto quando ho cambiato le mie impostazioni in base a loro, per favore prendi uno sguardo, potrebbe risolvere anche la tua curiosità.

  1. gestione del colore di ivan
  2. Suggerimenti per la gestione del colore in Photoshop per il Web
  3. Gestione del colore per abbinare i colori su più dispositivi
  4. questa impostazione nessuno dovrebbe usare per Photoshop

Spero che questo non possa aiutare un po '.......


Ricordo l'articolo e il dibattito di Smashing Magazine che seguirono. L'ultimo articolo ha più senso. Grazie!
Chris_O,

sempre il benvenuto ...
Jack,

1

Il mio onesto sentimento riguardo alla gestione del colore web rispecchia quelli espressi sopra, ma con alcuni avvertimenti.

In generale, ha senso mantenere un flusso di lavoro con gestione del colore da parte dell'utente in modo da poter almeno avere un buon punto di partenza, se si sta progettando al di fuori di un flusso di lavoro con gestione del colore e la combinazione di monitor / software risulta essere fuori a pranzo (colate di colore non intenzionali, problemi di gamma e gamma, ecc.), aumenti il ​​rischio che un'altra apparecchiatura non calibrata dell'utente finale sia fuori campo di una quantità equivalente nella direzione opposta e finisce per vedere qualcosa che è il doppio mal visualizzato in primo luogo rispetto a se fosse stato progettato all'interno di un flusso di lavoro con gestione del colore, in base alle decisioni di colore distorte che hai preso.

Inoltre, anche se non taggo mai le immagini grafiche (intestazioni, navigazione, sfondi, ecc.) Per i siti Web e i modelli di siti Web (poiché ciò può portare a brutti disallineamenti tra i colori specificati esadecimali e le immagini con gestione del colore che finiscono per ottenere la gestione del colore nei pochi browser che rispettano effettivamente i profili colore), taggo spesso le fotografie. Immagini a risoluzione particolarmente elevata. Nelle rare occasioni in cui l'utente finale sta visualizzando il contenuto in un browser con gestione del colore, i profili assicurano che l'utente stia vedendo la fotografia mentre è stata scattata e che le tonalità della pelle umana, i cieli, l'acqua, ecc. rappresentato correttamente.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.