2 poin oleh GN⁺ 2025-01-21 | 1 komentar | Bagikan ke WhatsApp
  • Jika sebuah situs web hanya menyediakan dark mode, sebagian pengguna bisa mengalami mata lelah dan rasa tidak nyaman saat membaca tulisan panjang, sehingga diperlukan pilihan atau kombinasi warna yang nyaman
  • Intinya bukan dark mode itu sendiri, melainkan rasio kontras antara teks dan latar belakang; teks putih murni di atas latar hitam sepenuhnya memiliki kontras 21:1, yang bisa terasa membebani
  • Menggunakan teks abu-abu #888888 di atas latar hitam menurunkan rasio kontras menjadi 5.9:1, sehingga menjadi contoh dark mode yang lebih nyaman dibaca dibanding kontras berlebihan
  • WCAG 2.1 hanya mensyaratkan rasio kontras minimum 4.5:1 untuk teks biasa dan tidak menetapkan batas kontras maksimum, sehingga kombinasi 21:1 pun dapat dianggap aksesibel menurut aturan
  • Persyaratan Maximum text contrast dalam draf WCAG 3.0 dihapus pada pembaruan 4 September 2025, dan tulisan dengan dark mode paksa saat ini memerlukan penanganan sementara seperti menimpa CSS secara manual

Saat dark mode paksa membuat membaca menjadi sulit

  • Ada banyak situs web dan blog pribadi yang dirancang khusus untuk dark mode, dan di beberapa situs mata bisa mulai terasa tidak nyaman bahkan sebelum sempat membaca satu paragraf
  • Dark mode berguna dalam situasi tertentu, tetapi jika dipaksakan tanpa memberi pengguna pilihan, itu menjadi pengalaman pengguna yang buruk
  • Setelah membaca tulisan panjang dalam dark mode, mata bisa tidak langsung beradaptasi kembali sehingga terasa seperti masih melihat garis-garis horizontal

Inti masalahnya adalah rasio kontras

  • Faktor utama yang menentukan kenyamanan dalam dark mode adalah rasio kontras antara teks dan latar belakang
  • Menempatkan teks putih murni di atas latar belakang hitam sepenuhnya menghasilkan rasio kontras 21:1
    • Kombinasi ini bisa membebani mata dan membuat teks sulit dibaca
  • Menggunakan teks abu-abu #888888 di atas latar hitam menurunkan rasio kontras menjadi 5.9:1
    • Ini adalah contoh kombinasi warna yang tetap dark mode tetapi lebih nyaman dibaca
  • Rasio kontras yang lebih tinggi tidak selalu lebih baik; dalam dark mode, kontras berlebihan justru dapat meningkatkan ketidaknyamanan

Bagian yang terlewat oleh standar WCAG

  • Saat ini WCAG 2.1 SC 1.4.3 mensyaratkan rasio kontras minimum 4.5:1 untuk teks biasa
  • WCAG 2.1 tidak memiliki batas rasio kontras maksimum
    • Kombinasi dengan kontras 21:1, seperti teks putih murni di atas latar hitam sepenuhnya, dapat dianggap sepenuhnya aksesibel menurut aturan
    • Meski bisa membuat banyak pengguna tidak nyaman, pedoman yang ada tidak menangani masalah kontras berlebihan dalam dark mode
  • WCAG 3.0 sempat direncanakan menambahkan Maximum text contrast sebagai persyaratan eksploratif
    • Menurut pembaruan Desember 2025, persyaratan ini dihapus dalam pembaruan draf WCAG 3.0 pada 4 September 2025
    • GitHub Issue tentang matematika rasio kontras masih terbuka

Solusi sementara yang saat ini memungkinkan

  • Jika tulisan penting hanya tersedia dalam dark mode paksa, warna dapat dibalik dengan menimpa CSS melalui developer tools di browser
  • Jika tidak ingin memakai plugin terpisah, developer tools tetap menjadi solusi sementara sampai ada solusi yang lebih baik

Situasi ketika dark mode cocok digunakan

  • Ini bukan sikap yang menolak dark mode itu sendiri; dark mode lebih disukai dalam situasi berikut
    • Saat membaca di layar OLED dalam ruangan gelap, misalnya membaca artikel di ponsel sebelum tidur
    • Saat menulis kode, karena hampir semua IDE secara default menyediakan dark mode dengan rasio kontras yang nyaman
    • Saat dark mode sebuah situs web memiliki rasio kontras yang nyaman
  • Setelah artikel tersebut, diskusi Hacker News memunculkan dukungan sekaligus kritik, dengan pembahasan tentang pilihan dark/light mode pada OEM awal, pentingnya rasio kontras, pengalaman pribadi, kondisi medis, masalah aksesibilitas, dan cara mengakalinya

1 komentar

 
GN⁺ 2025-01-21
Pendapat di Hacker News
  • Mode gelap sebenarnya awalnya lebih dekat ke default tradisional
    Begitu pula layar monokrom hitam dengan teks hijau/amber awal, mode teks DOS abu-abu di latar hitam, C-64 dengan latar biru tua dan teks biru terang, serta Apple II dengan abu-abu/putih di atas latar hitam
    Di GUI pun, Amiga memiliki Workbench default berlatar biru tua, dan semua palet bisa dipilih pengguna
    Microsoft Windows-lah yang menjadikan teks hitam di layar putih sebagai default di sebagian besar aplikasi dengan alasan mirip kertas, dan meski kertas itu putih, ia bukan putih yang bercahaya, sehingga peralihan itu menyakitkan
    Senang mode gelap kembali, tetapi yang dibutuhkan adalah pilihan, bukan mode gelap yang dipaksakan; kalau bisa, mode terang juga jangan putih dengan kecerahan maksimum

    • Mode gelap bukanlah default tradisional, dan kertas adalah latar putih dengan teks hitam
      Perangkat atau monitor tidak boleh dibiarkan putih bercahaya; kecerahannya harus diturunkan agar terlihat mirip kertas yang diletakkan di sampingnya
      Yang mengubah paradigma juga bukan Windows, melainkan Mac lebih dulu sebagai perangkat konsumen yang tersebar luas, dan CRT bawaannya pun di bawah pencahayaan kantor tradisional kurang terang dibanding kertas
      Komputer awal memakai skema warna gelap karena resolusinya rendah dan kecerahan piksel melebar, sehingga lebih mudah dibaca; seiring teknologi membaik, masalah itu hilang, dan teks gelap di latar terang—baik di layar maupun cetakan—lebih nyaman di mata
    • Rasio kontras CRT lama sama sekali berbeda dari layar LCD/IPS/OLED modern
      Amber dan hijau juga dianggap lebih nyaman daripada teks putih, dan perbedaannya begitu besar sampai sulit dibandingkan
      Jika latarnya memiliki tingkat kecerahan tertentuih-alih hitam total, mode gelap mungkin cocok untuk lebih banyak orang, tetapi itu menghilangkan sebagian besar keunggulan OLED
    • “Default tradisional” bukanlah istilah yang mutlak
      Memang benar DOS/Unix pada PC awal memakai latar hitam karena karakteristik tampilan saat itu, tetapi sebelumnya orang berbagi informasi lewat kertas putih, dan internet awal kembali membawa teks hitam di latar putih
      Pada akhirnya tidak ada yang namanya default ortodoks; semuanya tergantung kapan Anda ikut masuk
    • Masa itu adalah momen yang sangat singkat ketika segala sesuatu sedang ditentukan, dan batasan biaya lebih menentukan kemampuan komputasi serta cara tampilan daripada selera pribadi atau ergonomi
      Latar biru tua Amiga Workbench juga karena biaya. Banyak orang diperkirakan akan menghubungkannya ke TV melalui output video komposit, dan teks putih dengan latar biru adalah kombinasi yang bisa ditampilkan TV dengan baik
      Monitor 1080 harganya sekitar sepertiga dari harga A1000, dan kemungkinan besar banyak A500 setelah dibuka pada Natal sempat lama dihubungkan ke TV
      Saya pernah memakai hampir semua pengolah kata untuk Amiga, dan kecuali WordPerfect, semuanya memakai teks hitam di latar putih; WordPerfect pun bisa diubah, hanya saja mempertahankan default biru/putih agar selaras dengan DOS
    • Mode gelap itu normal pada masa awal CRT, dan kebanyakan CRT saat itu diperbarui pada 60Hz atau kurang
      Latar gelap membuat kedipan tidak terlalu terlihat, dan ketika CRT dengan refresh rate lebih tinggi menjadi umum pada 1990-an, masalah kedipan berkurang sehingga mode terang menjadi default
  • Tunggu, kalau sebuah situs web hanya memiliki teks terang dan latar gelap, itu adalah tema dan suasana situs tersebut
    Mode gelap hanya ada jika ada mode terang, dan sebaliknya juga begitu
    Kita tidak bisa memaksa situs web yang tidak menginginkannya untuk mempertahankan kedua mode

    • Itu sudah disebutkan di awal tulisan
      Jika mode gelap adalah karakteristik merek, tertulis agar memilih rasio kontras yang nyaman untuk teks
  • Mode terang yang menjadi default dan tidak bisa dikonfigurasi sudah lama ada, dan untuk mengimbanginya ada plugin seperti Dark Reader
    Namun sebaliknya, tidak banyak infrastruktur untuk memaksa mode terang
    Dalam kebanyakan situasi, saya rasa mode terang lebih baik daripada mode gelap. Satu-satunya situasi ketika mode gelap lebih baik adalah saat duduk di ruangan gelap dengan layar sebagai satu-satunya sumber cahaya, dan itu biasanya bukan lingkungan yang sehat
    Mode gelap lebih mirip alat bantu; lebih baik menyalakan lampu atau tidur
    Di lingkungan tanpa cahaya, mode terang bisa mengganggu untuk dibaca, tetapi di lingkungan terang, mode gelap nyaris tidak bisa dibaca. Cobalah membaca UI mode gelap di ponsel pada hari cerah di tengah musim panas; bahkan dengan kecerahan dimaksimalkan, tetap sulit terlihat

    • Plugin Dark Reader di sistem saya juga punya opsi untuk memaksa tema terang
      Sebenarnya browser punya fitur untuk mengatur warna latar dan warna teks default, jadi jika situs web cukup menghormati default ini kecuali benar-benar diperlukan, ekstensi tidak akan dibutuhkan
      Dunia yang membutuhkan ekstensi untuk “benar-benar menghormati preferensi saya” memang menyedihkan, tetapi jika memang perlu, setidaknya patut diketahui bahwa ia mendukung opsi di kedua sisi. Situasi keseluruhannya cukup konyol, tetapi ada jalan pintas
    • Selalu terasa aneh bahwa begitu banyak orang tanpa alasan medis ingin duduk di ruangan gelap seperti troll gua
      Sekarang semua sistem operasi memiliki mode yang bisa dialihkan dan bisa memberi tahu browser tentangnya. Browser dapat, dan seharusnya, beradaptasi dengan pengaturan yang dilaporkan sistem operasi
      Desain UI pada umumnya adalah rangkaian suasana dan tren yang diterapkan secara keliru, kecuali beberapa pulau rasionalitas seperti Paul Fitts
      Awalnya, karena kontras dianggap buruk, kontras dipakai terlalu sedikit; lalu karena kecerahan dianggap buruk, kecerahan dipakai terlalu sedikit. Kemudian orang kembali menyadari mengapa kontras dan kecerahan sejak awal penting, dan siklusnya terus berulang
    • Dari sudut pandang seseorang yang pernah mengalami katarak, mode terang sangat sulit dibaca
      Rasanya seperti menatap lampu jauh mobil dari depan; saya memang memakai plugin Dark Reader, tetapi itu berbeda dari situs yang mendukung mode gelap dengan benar
    • Mode gelap juga bisa lebih baik jika kecerahan layar disetel terlalu tinggi secara tidak tepat
    • Saya suka mode Pure Black karena di layar saya piksel hitam benar-benar mati
      Bahkan di siang bolong pun jauh lebih nyaman dilihat. Saya berharap mode Pure Black menjadi opsi terpisah dari mode gelap/terang, seperti di beberapa aplikasi Android
      Untuk saat ini saya bertahan dengan menurunkan kecerahan di Dark Reader ke minimum, tetapi agak kasar
  • Blog ini sendiri tidak mengikuti pengaturan perangkat dan memaksa pembaca memakai mode terang
    Penulisnya kemudian mengubah posisi di tengah jalan dan menyimpulkan bahwa masalahnya bukan mode gelap, melainkan kontras warna

    • Blog penulis itu sendiri juga secara eksplisit mendefinisikan color: #111; dan background-color: #fdfdfd;, yang berarti rasio kontras 18,56:1
    • Inti sebenarnya adalah rasio kontras, jadi judulnya terasa agak tidak jujur
      Ironisnya, di bagian akhir ia mengatakan akan memakai filter inversi sebagai jalan pintas; kalau orang yang lebih suka mode gelap memakai sesuatu seperti Invert Mode milik Vivaldi pada situs penulis yang berlatar putih kuat/teks hitam, hasilnya justru rasio kontras gelap yang penulis keluhkan itu
  • Saya berharap pengguna tidak dipaksa memakai rasio kontras rendah
    Tidak semua orang melihat konten di layar yang dikalibrasi di atas 100 nit dan dengan pencahayaan sekitar yang terang tetapi wajar
    Kombinasi abu-abu di atas abu-abu yang direkomendasikan bisa sulit dibaca, misalnya saat dilihat pada kecerahan 0 di ruangan yang sepenuhnya gelap atau di bawah sinar matahari langsung
    Seluruh rentang warna SDR memang ada untuk digunakan, bukan HDR yang perlu dibatasi agar tidak membutakan pengguna

    • Kombinasi abu-abu di atas abu-abu juga bisa menyulitkan orang yang lebih tua
  • Ini bukan hanya soal terang versus gelap. Saya ingin situs web secara umum menghormati preferensi sistem saya
    Kalau tema sistem operasi saya adalah teks Comic Sans ungu di atas latar bata kuning, browser juga seharusnya menghormatinya
    Kalau saya ingin membaca teks selebar seluruh browser, bukan dipaksa melihatnya dalam kolom sempit selebar 5 inci di tengah, saya seharusnya tidak perlu melakukan sulap di pengaturan browser, memanggil CSS override, atau memasang ekstensi
    Browser seharusnya cukup berkata, “Maaf, pengembang web. Preferensi pengguna menang”
    Browser sudah memberi terlalu banyak kendali kepada pengembang untuk mengabaikan keinginan pengguna, sampai istilah “user agent” terasa hampa. Sekarang lebih mirip developer agent

    • Kalau latar kuning mungkin tidak bisa dihindari, memaksa Comic Sans mudah dilakukan di pengaturan Firefox dengan menetapkannya sebagai font pilihan dan mematikan “Allow pages to choose their own fonts”
      Saya juga memakainya begitu, dan menjelajah web jadi jauh lebih baik
    • Apakah aplikasi desktop atau yang lain benar-benar menghormati pengaturan seperti itu?
    • Saya tidak menginginkan itu; saya ingin memilih skema secara terpisah untuk tiap situs atau aplikasi
      Di sebagian tempat mode gelap sangat bagus, di tempat lain konyol. Tema putih juga sama
    • Kedengarannya seperti Anda ingin memakai mode baca secara default. Sebagian browser mengizinkan itu
  • Terlalu banyak pengembang web menganggap semua orang menyukai mode gelap lalu menjadikannya default, kemudian membenarkannya karena ada tombol toggle Dark/Light Mode
    Mengejutkan bahwa bahkan situs web yang baru dibuat pun sering tidak mendeteksi preferensi pengguna dan malah menguncinya
    Sebagai pengembang, Anda bisa memakai properti color-scheme di CSS untuk menandai skema warna apa yang bisa dirender dengan nyaman oleh suatu elemen
    :root { color-scheme: light dark; }
    element { light-dark(light-color-code, dark-color-code); }
    Sebagai pengguna macOS, saya punya preferensi campuran: mode gelap bagus untuk hal seperti bilah menu atau IDE, tetapi untuk membaca, menulis, dan browsing saya lebih suka mode terang
    Atur tema ke LIGHT di System Preferences, lalu jalankan defaults write -g NSRequiresAquaSystemAppearance -bool Yes, logout, kemudian atur tema ke DARK di System Preferences
    Untuk mengembalikan ke tema default, jalankan defaults write -g NSRequiresAquaSystemAppearance -bool No

    1. https://developer.mozilla.org/en-US/docs/Web/CSS/color-schem...
  • Lucunya, contoh “teks yang mudah dibaca” di blog itu bagi saya benar-benar sulit dibaca karena kontrasnya rendah
    Saya penasaran kondisi mata atau monitor seperti apa yang digunakan

    • Tebakan saya, ia memakai monitor HDR yang sangat mahal dan ditujukan untuk desainer, lalu memakai seluruh gamut warna untuk semuanya
    • Saya tidak bisa memahami obsesi perusak keterbacaan seperti abu-abu di atas abu-abu di atas abu-abu
      Saya tidak tahan, jelek, dan sulit dibaca. Saya berharap semua orang berhenti melakukannya
    • Saya juga lebih suka mode terang, tetapi di layar saya yang sekitar 300 dolar, teks abu-abu jauh lebih mudah dibaca daripada teks putih
  • Ada API web untuk mengetahui apakah pengguna memakai mode gelap, jadi pakai saja itu
    @media (prefers-color-scheme: dark) { CSS Rules here... }

  • Mode gelap adalah sebuah kekeliruan
    LCD awal terlalu redup, jadi semua orang menaikkan putih dengan kuat untuk mengimbanginya, dan sekarang LCD sudah mengejar sampai pada tingkat yang membakar mata cukup banyak orang
    Akibatnya, makin lama kita harus mendukung dua mode, dan ikon mode gelap Apple yang tampak sangat jelek menunjukkan betapa sulitnya melakukan ini dengan baik
    Idealnya, menurut saya warna dasar antarmuka komputer dikembalikan ke abu-abu, seperti pada masa ketika CRT terang menjadi standar
    Itu juga punya kelebihan karena bisa memberi petunjuk kedalaman pada elemen UI, dan hal ini juga seharusnya dikembalikan

    • Itu hanya selera pribadi
      Intinya adalah harus dapat dikonfigurasi agar pengguna bisa menetapkan preferensi mereka sendiri
      Secara pribadi, mode terang menyilaukan, membuat mata saya sakit, dan melelahkan. Setiap orang berbeda
    • CRT juga punya kenop untuk mengatur kecerahan dan kontras dengan mudah, sehingga siapa pun bisa cepat menyesuaikan dengan preferensinya, entah teks hitam di latar putih atau sebaliknya
    • Bukankah “warna dasar menjadi abu-abu” pada umumnya sudah dilakukan oleh mode gelap?
      Mode terang biasanya tidak sepenuhnya putih, dan mode gelap memakai nuansa abu-abu