Ustawienia kolorów programu Photoshop do projektowania stron internetowych

9

Jakie ustawienia profilu kolorów należy zastosować w programie Photoshop do projektowania stron internetowych? Czy efekt kalibracji monitora oszczędza obrazy internetowe?

Kalibruję monitor za pomocą kolorymetru i chcę mieć pewność, że moje kolory będą spójne we wszystkich głównych przeglądarkach.

Używam skalibrowanego profilu monitora do pracy, wyłączam zarządzanie kolorami i nie osadzam profilu do zapisywania w Internecie i próbuję używać .png 24, gdy tylko jest to możliwe. Czy to najlepsza praktyka?

Ustawienia kolorów

wprowadź opis zdjęcia tutaj

Zapisz dla Internetu

wprowadź opis zdjęcia tutaj

Chris_O
źródło
1
Możliwe dodatkowe pytanie - chociaż wyjaśniłeś, że Twoja witryna jest przykładem użycia, czy powyższe ustawienia są „bezpieczne”, jeśli od czasu do czasu trzeba było edytować czyjąś grafikę CMYK?
e100
Słuszna uwaga. Nie mam dużego doświadczenia w drukowaniu lub CMYK, więc nie wiedziałbym.
Chris_O

Odpowiedzi:

5

„Zarządzanie kolorami” i „tworzenie stron internetowych” nigdy nie powinny być używane w tym samym zdaniu, chyba że mają kwalifikacje „nie przejmuj się”, „stratą czasu” lub „fuggedaboudit”. Powody przedstawione przez lawndartcatchera są prawidłowe. Nie widziałem jeszcze biura (innego niż studio graficzne), gdzie dwa dowolne monitory wyświetlały te same kolory. Komputery domowe są co najmniej tak samo złe.

Jeśli pracujesz przede wszystkim w Internecie, sRGB musi być domyślnym ustawieniem, ponieważ jest to standard w Internecie i to do tego służą wszystkie programy użytkownika (przeglądarki).

NIE osadzaj profilu kolorów w obrazach witryn internetowych. Dodają rozmiar obrazu, ale nie dodają żadnych przydatnych informacji, więc wszystko, co robisz, to powiększanie stron. Podczas zapisywania dla Internetu i urządzeń w Photoshopie usuń zaznaczenie opcji „Osadź profil kolorów”. Ze względów bezpieczeństwa zaznacz opcję „Konwertuj na sRGB” (na wypadek, gdy masz do czynienia z obrazem w innej przestrzeni kolorów i zapomnisz go przekonwertować).

Aby odpowiedzieć na inne pytania: Kalibracja monitora nie wpływa na obrazy SfW, z wyjątkiem sytuacji, gdy używasz monitorowanego profilu jako profilu kolorów obrazu (czego nigdy nie powinieneś robić z jakiegokolwiek powodu lub w jakimkolwiek celu innym niż tapeta na pulpicie osobistym).

PNG-24 jest użyteczny w przypadku obrazów z przezroczystością. Jeśli nie ma żadnej przezroczystości, jpeg zwykle daje mniejszy plik dla tej samej jakości obrazu i dla prostych obrazów z kilkoma kolorami, a zwłaszcza jeśli mają twarde krawędzie (logo to klasyczny przykład) .gif jest często najlepszym wyborem.

Alan Gilbertson
źródło
7

Cóż, dużym problemem jest to, że będziesz spędzać dużo czasu i dbać o kalibrację i wybieranie kolorów (dobre dla ciebie!) I najprawdopodobniej będą oglądane przez ludzi, którzy nie mogą nawet pracować Przyciski „Jasności” na monitorze. Wszyscy moi (niebędący projektantami) współpracownicy mają dwa ekrany i żaden z nich nawet do siebie nie pasuje. Jeśli więc pytasz: „Czy jest jakiś sposób, aby ten konkretny czerwony, o który prosił mój klient, zawsze wyglądałby poprawnie w oparciu o żmudną kalibrację, którą przeprowadziłem?” niestety odpowiedź brzmi:

Nie.

Ale (i to jest całkiem spore, ale) cała wasza opieka jest ważna. Utrzymując spójny profil, wszystkie strony / kolory będą wyglądały tak samo na tym samym monitorze. Pamiętaj tylko, że nie wszyscy nie używają tego samego monitora, co Ty, więc nie zawsze będzie wyglądał tak samo.

Nie osadzając profilu, może pozostawić szeroko otwarte drzwi, aby przeglądarka mogła zastąpić bieżący profil. Jeśli uda Ci się skłonić główne przeglądarki do wyrażenia zgody na obsługę kolorów, prawdopodobnie jest to dla ciebie jakaś nagroda Nobla.

Krótko mówiąc, tak - cała dbałość jest ważna, a używane ustawienia są dobre (chociaż osobiście szukałbym bardziej ogólnego profilu RGB). Ale będzie tylko tyle kontroli, jaką będziesz mieć, gdy Twój projekt opuści Twoją maszynę i przejdzie do wielkiego, szerokiego świata nieświadomych użytkowników sieci.

lawndartcatcher
źródło
Bardzo pomocne dzięki! Myślę, że moim największym zmartwieniem jest to, że jeśli użyję grafiki utworzonej jako kolor # 172550 w Photoshopie, to moja # 172550 w CSS pasuje do grafiki na dowolnym monitorze.
Chris_O
możesz także pracować z kolorami bezpiecznymi dla Internetu
Jack
2
Bezpieczne kolory sieciowe to jeden dobry sposób na „ograniczenie szkód”, ale niestety kolor # 172550 będzie wyglądał inaczej na całej planszy tylko dlatego, że ogromna większość ludzi nigdy nie kalibruje swoich monitorów. Jeśli pracujesz w druku, byłoby to łatwiejsze, ponieważ profesjonalne drukarki działają poza standardami Pantone, dzięki czemu wiedzą, jak wygląda # 172550.
lawndartcatcher
2
Przeglądarki używają sRGB. To jest standard W3C. Użycie dowolnego innego profilu kolorów dla obrazu gwarantuje , że będzie on inny, gdy będzie wyświetlany w przeglądarce.
Alan Gilbertson
2
Kolory bezpieczne w Internecie nie mają tu znaczenia (i wszędzie indziej: graphicdesign.stackexchange.com/questions/40/… )
e100
3

+1 Chris, to jest naprawdę dobre pytanie, dokładnie nie wiem tak głęboko, ale kiedy zainteresowałem się tym pytaniem, znalazłem kilka artykułów na ten sam temat, być może będą one pomocne, ponieważ zmieniłem moje ustawienie zgodnie z nimi, proszę wziąć spojrzenie, może również rozwiązać twoją ciekawość.

  1. zarządzanie kolorami przez ivan
  2. Wskazówki dotyczące zarządzania kolorem w programie Photoshop dla Internetu
  3. Zarządzanie kolorami w celu dopasowania kolorów na wielu urządzeniach
  4. tego ustawienia nikt nie powinien używać w Photoshopie

Mam nadzieję, że to może trochę pomóc .......

Jacek
źródło
Pamiętam artykuł Smashing Magazine i późniejszą debatę. Ostatni artykuł ma jak najbardziej sens. Dzięki!
Chris_O
zawsze mile widziane ...
Jack
1

Moje szczere zdanie na temat zarządzania kolorami stron internetowych odzwierciedla te wyrażone powyżej, ale z pewnymi zastrzeżeniami.

Ogólnie rzecz biorąc, ma sens utrzymywanie przepływu pracy z zarządzaniem kolorami po swojej stronie, abyś mógł mieć przynajmniej dobry punkt wyjścia - jeśli projektujesz poza przepływem pracy z zarządzaniem kolorami, a kombinacja monitora / oprogramowania okazuje się być na lunch (niezamierzone przebarwienia, problemy z gamutą i gamma itp.), zwiększasz ryzyko, że inny nieskalibrowany sprzęt użytkownika końcowego wyleci w powietrze w równoważnej ilości w przeciwnym kierunku i skończy się, widząc coś, co jest dwa razy większe źle wyświetlane, niż gdyby zostały zaprojektowane w ramach przepływu pracy zarządzanego kolorem, w oparciu o podejmowane przez użytkownika błędne decyzje dotyczące kolorów.

Ponadto, chociaż nigdy nie taguję obrazów graficznych (nagłówków, nawigacji, tła itp.) Dla stron internetowych i szablonów stron internetowych (ponieważ może to prowadzić do brzydkich rozbieżności między kolorami określonymi szesnastkowo a obrazami zarządzanymi kolorami, które kończą się zarządzaniem kolorami w kilku przeglądarek, które rzeczywiście szanują kolorów profili), I robić często fotografie tagów. Obrazy o wyższej rozdzielczości. W rzadkich przypadkach, gdy użytkownik końcowy przegląda zawartość w przeglądarce z zarządzaniem kolorami, profile zapewniają, że użytkownik widzi zdjęcie w momencie, w którym zostało zrobione, a odcienie skóry, nieba, wody itp. właściwie reprezentowane.

Timichango
źródło