Mengapa browser menambahkan warna kebiruan dan kecoklatan ke warna font yang solid?

Saya bertanya-tanya mengapa browser saya (Firefox) menambahkan warna biru di sebelah kanan dan warna cokelat di sebelah kiri warna font abu-abu pekat (# 333333) seperti yang ditunjukkan pada gambar di bawah ini.

Bisakah seseorang menjelaskan kepada saya mengapa ini terjadi?

website-design fonts css anti-aliasing subpixel-rendering cooxie
sumber

Antialiasing ? Ada banyak opsi terkait, Anda dapat mengaturnya menggunakan plugin .

Paolo Gibellini

Jawaban:

Ini disebut rendering subpixel , atau subpixel anti aliasing. Microsoft melakukan hal serupa untuk sebagian besar aplikasi windows.

Layar Anda terdiri dari warna-warna yang bersebelahan. Jika Anda melakukan anti aliasing sampel sederhana, Anda tidak mendapatkan hasil terbaik. Tetapi dengan memanfaatkan pengetahuan tentang bagaimana piksel diletakkan, Anda bisa mendapatkan hasil yang lebih baik. Saat Anda bekerja dengan data yang kurang dari satu piksel.

Anda harus berhati-hati dengan ini. Monitor yang berbeda memiliki pengaturan yang berbeda untuk emisi warna (karenanya tuner disebutkan oleh @PaoloGibellini). Jadi, jika Anda menyiapkan tangkapan layar berkualitas sangat tinggi, sebaiknya matikan rendering subpiksel, atau Anda akan mendapatkan kesalahan 2 kali *. Demikian juga jika Anda mengambil tangkapan layar untuk dicetak, yang terbaik untuk menonaktifkan ini atau teks Anda akan terlihat seperti pelangi berlumuran.

^{* Sekali oleh monitor, yang memiliki satu urutan dan sekali oleh gambar yang memiliki urutan yang berbeda}

joojaa
sumber

Hei, tidak ada yang salah dengan pelangi berlumuran!

Janus Bahs Jacquet

Dalam windwo yang disebut ClearType - microsoft.com/en-us/Typography/ClearTypeInfo.aspx dan dilakukan pada level sistem, saya tidak berpikir actuallz FF melakukan hal itu.

Hurda

@ Burda no firefox tidak melakukannya sendiri, Anda dapat melihatnya di opsi yang mereka bicarakan langsung menggambar dan itu termasuk tipe yang jelas. Anda dapat mematikannya secara global jika mau.

joojaa

Tangkapan layar yang berisi rendering sub-piksel tidak akan diterapkan ulang saat dilihat. Ini adalah fungsi pada teks dan beberapa elemen UI, bukan pada semua grafik. Selain itu, toko cetak mana pun yang bernilai garam akan mengubah teks hitam tangkapan layar seperti itu menjadi hitam murni sebelum dipisahkan.

Logar

@ Logog tidak itu tidak akan diterapkan kembali, tetapi akan diperbaiki jika urutan pixel berbeda maka kesalahan dilakukan 2 kali. Saya benar-benar ragu toko cetak mana pun akan pergi dan memperbaiki gambar secara surut dengan cara ini tanpa biaya. Karena itu berarti mereka harus maju dan melakukan ini untuk setiap elemen pada latar belakang yang berbeda (pada abu-abu, putih pada kuning dll). Lebih mudah untuk menonaktifkannya sebelum tangkapan layar

joojaa

Ini disebut rendering subpixel . Warna-warna yang berbeda hanya terlihat karena gambar telah diledakkan. Akan lebih mudah untuk memberikan contoh putih di atas hitam.

Penjelasan tentang rendering subpixel

Bayangkan garis putih tebal satu piksel. Pada sebagian besar layar LCD desktop warna subpiksel individual disusun secara horizontal. Selama ketiga piksel warna dihidupkan, kita akan melihat garis putih setebal satu piksel - tidak masalah urutan warnanya. Inilah yang ditampilkan dua baris pertama. Menggunakan rendering subpiksel meningkatkan resolusi horizontal layar sebanyak tiga kali, yang sangat membantu saat membaca teks horizontal.

Tetapi ketika Anda mengambil tangkapan layar dan memperbesarnya, alih-alih melihat subpiksel, Anda melihat warna yang mereka kombinasikan untuk diproduksi. Ketika satu garis piksel kami selaras dengan piksel, Anda hanya melihat garis putih satu piksel. Tetapi jika tidak maka Anda akan melihat garis tebal dua piksel yang terdiri dari dua warna. Anda dapat melihat ini secara langsung jika Anda cukup dekat dengan layar Anda sehingga Anda dapat melihat kesenjangan antara piksel - jika Anda cukup dekat mata Anda mungkin tidak menyelesaikan piksel yang terpecah menjadi satu, dan Anda akan melihat garis itu sebagai dua piksel lebar. Tetapi jika resolusi layar cukup tinggi maka rendering subpixel dapat bekerja dengan sangat baik dan hanya akan diperhatikan ketika Anda memperbesar tangkapan layar.

curiousdannii
sumber