Pengaturan Warna Photoshop untuk desain web

9

Pengaturan profil warna apa yang harus digunakan dalam Photoshop untuk desain web? Apakah efek kalibrasi monitor disimpan untuk gambar web?

Saya menjaga monitor saya dikalibrasi dengan colorimeter dan ingin memastikan warna saya akan konsisten pada semua browser utama.

Saya menggunakan profil monitor saya yang dikalibrasi untuk ruang kerja saya, manajemen warna tidak aktif dan tidak menyematkan profil untuk disimpan di web dan mencoba menggunakan .png 24 bila memungkinkan. Apakah ini praktik terbaik?

Pengaturan warna

masukkan deskripsi gambar di sini

Simpan untuk web

masukkan deskripsi gambar di sini

Chris_O
sumber
1
Kemungkinan pertanyaan tambahan - walaupun Anda telah menjelaskan web tentang kasus penggunaan Anda, apakah pengaturan di atas 'aman' jika Anda memang perlu mengedit CMYK karya seni orang lain sesekali?
e100
Poin bagus. Saya tidak punya banyak pengalaman cetak atau CMYK jadi saya tidak akan tahu.
Chris_O

Jawaban:

5

"Manajemen Warna" dan "pengembangan web" tidak boleh digunakan dalam kalimat yang sama, kecuali memenuhi syarat dengan "jangan repot-repot," "buang-buang waktu" atau "fuggedaboudit." Alasan Lawndartcatcher diuraikan benar. Saya belum melihat kantor (selain studio desain grafis) di mana dua monitor menampilkan warna yang sama. Komputer rumahan setidaknya sama buruknya.

Jika Anda bekerja terutama di web, maka sRGB harus menjadi default Anda, karena itu adalah standar untuk Internet , dan semua agen pengguna (browser) dibuat untuk ditampilkan.

JANGAN menyematkan profil warna pada gambar untuk situs web. Mereka menambah ukuran pada gambar, tetapi tidak menambahkan informasi yang berguna, jadi semua yang Anda lakukan adalah membuat halaman Anda lebih berat. Saat Anda Menyimpan untuk Web dan Perangkat dari Photoshop, pastikan untuk menghapus centang "Embed Color Profile." Sebagai ukuran keamanan, tetap centang "Konversikan ke sRGB" (jika Anda berurusan dengan gambar yang ada di ruang warna lain dan Anda lupa untuk mengubahnya).

Untuk menjawab pertanyaan Anda yang lain: Kalibrasi monitor tidak memengaruhi gambar SfW kecuali ketika Anda menggunakan Anda memantau profil sebagai profil warna untuk gambar (yang seharusnya tidak pernah Anda lakukan untuk alasan apa pun atau untuk tujuan apa pun selain wallpaper desktop pribadi).

PNG-24 berguna untuk gambar dengan transparansi. Jika tidak ada transparansi yang terlibat, jpeg biasanya memberikan file yang lebih kecil untuk kualitas gambar yang sama, dan untuk gambar sederhana dengan beberapa warna, dan terutama jika mereka memiliki tepi yang keras (logo menjadi contoh klasik). Gif sering merupakan pilihan terbaik.

Alan Gilbertson
sumber
7

Nah, masalah besarnya adalah Anda akan menghabiskan banyak waktu dan perhatian dalam mengkalibrasi dan memilih warna (baik untuk Anda!) Dan mereka kemungkinan besar akan dilihat oleh orang-orang yang bahkan tidak bisa mengerjakannya. Tombol "Kecerahan" pada monitor mereka. Rekan kerja (non-desain) saya semua memiliki dua layar, dan tidak ada satupun yang cocok satu sama lain. Jadi, jika Anda bertanya, "Apakah ada warna merah tertentu yang diminta klien saya akan selalu terlihat benar berdasarkan kalibrasi yang saya lakukan?" sayangnya jawabannya adalah:

Tidak.

Tapi (dan ini cukup besar tetapi) semua perawatan yang Anda lakukan adalah penting. Dengan menjaga profil yang konsisten semua halaman / warna Anda akan terlihat sama di monitor yang sama. Ingatlah bahwa tidak semua orang tidak menggunakan monitor yang sama dengan Anda, jadi monitor tidak akan selalu terlihat sama.

Dengan tidak menyematkan profil, itu dapat membiarkan pintu terbuka lebar bagi browser untuk mengganti profil saat ini. Jika Anda bisa membuat browser utama menyetujui penanganan warna, mungkin ada semacam hadiah Nobel untuk Anda.

Singkatnya, ya - semua perawatan yang Anda lakukan adalah penting dan pengaturan yang Anda gunakan baik (meskipun saya pribadi akan mencari profil RGB yang sedikit lebih umum). Tapi hanya ada begitu banyak kontrol yang akan Anda miliki setelah desain Anda meninggalkan mesin Anda dan pergi ke dunia luas pengguna web yang tidak tahu.

lawndartcatcher
sumber
Terima kasih sangat membantu! Saya kira kekhawatiran terbesar saya adalah jika saya menggunakan grafik yang saya buat sebagai warna # 172550 di Photoshop maka # 172550 saya di CSS cocok dengan grafik di monitor mana pun.
Chris_O
Anda juga dapat bekerja dengan warna
Jack
2
Warna web safe adalah salah satu cara yang baik untuk "membatasi kerusakan" tetapi sayangnya warna # 172550 akan terlihat berbeda secara keseluruhan hanya karena sebagian besar orang tidak pernah mengkalibrasi monitor mereka. Jika Anda bekerja di media cetak, ini akan lebih mudah karena printer profesional bekerja di luar standar Pantone sehingga mereka tahu seperti apa bentuk # 172550.
lawndartcatcher
2
Browser menggunakan sRGB. Itu adalah standar W3C. Menggunakan profil warna lain untuk gambar menjamin bahwa gambar itu akan berbeda ketika dilihat di browser.
Alan Gilbertson
2
Warna yang aman untuk web tidak relevan di sini (dan di tempat lain: graphicdesign.stackexchange.com/questions/40/… )
e100
3

+1 Chris ini benar-benar pertanyaan yang bagus, tepatnya saya tidak tahu sedalam itu tetapi ketika saya tertarik dengan pertanyaan ini saya menemukan beberapa artikel yang sama, mungkin mereka membantu Anda ketika saya mengubah pengaturan saya menurut mereka, silakan ambil lihat, itu mungkin akan menyelesaikan rasa ingin tahu Anda juga.

  1. manajemen warna oleh ivan
  2. Kiat mengatur warna di Photoshop untuk web
  3. Manajemen Warna untuk Mencocokkan Warna di Berbagai Perangkat
  4. Pengaturan ini tidak ada yang harus digunakan untuk photoshop

Semoga jangan sampai ini akan membantu sedikit .......

Mendongkrak
sumber
Saya ingat artikel dan debat Majalah Smashing yang menyusul. Artikel terakhir paling masuk akal. Terima kasih!
Chris_O
selalu diterima ...
Jack
1

Perasaan jujur ​​saya tentang manajemen warna web mencerminkan hal-hal yang diungkapkan di atas, tetapi dengan beberapa peringatan.

Secara umum, itu TIDAK masuk akal untuk mempertahankan alur kerja yang dikelola warna di ujung Anda sehingga Anda setidaknya bisa memiliki titik awal yang baik — jika Anda mendesain di luar alur kerja yang dikelola warna, dan kombo monitor / perangkat lunak Anda kebetulan merupakan cara keluar untuk makan siang (gips warna yang tidak disengaja, masalah gamut dan gamma, dll.), Anda meningkatkan risiko bahwa peralatan pengguna akhir yang tidak dikalibrasi out-of-whack dalam jumlah yang setara dalam arah yang berlawanan, dan akhirnya melihat sesuatu yang dua kali lipat ditampilkan dengan buruk daripada jika itu dirancang dalam alur kerja yang dikelola warna di tempat pertama, berdasarkan keputusan warna bias yang Anda buat.

Selain itu, walaupun saya tidak pernah memberi tag pada gambar grafik (tajuk, navigasi, latar belakang, dll.) Untuk situs web dan templat situs web (karena ini dapat menyebabkan ketidakcocokan yang buruk antara warna yang ditentukan heksa dan gambar yang dikelola warna yang akhirnya mendapatkan pengelolaan warna dalam beberapa browser yang benar-benar menghormati profil warna), saya lakukan sering foto-foto tag. Gambar beresolusi lebih tinggi. Dalam kesempatan langka bahwa pengguna akhir melihat konten dalam browser yang dikelola warna, profil memastikan bahwa pengguna melihat foto saat diambil, dan bahwa warna kulit manusia, langit, air, dll. terwakili dengan benar.

Timichango
sumber