Merhaba, blog yapımında kullanmak için arka plan ve yazı rengi seçimlerini araştırırken okuduğum birkaç şeyi sizinle paylaşmak istedim. Yıllar önceden beri detaylı yazmak istiyordum; fakat çok detaya inmeden kısaca belirtmem daha uygun olacak 🙂
Web Content Accessiblity Guideline bazı engeli olan kişilerin web erişiminde kolaylıklar yaşamasını sağlayacak önerilerde bulunmaktadır.
Yayınladıkları kılavuza göre standart bir yazı için yazı rengi ve arkaplan arasındaki kontrast oranı minimum 4.5:1 şeklinde olmalıdır. Bu oran karakter boyutu arttırılarak ya da yazı tipi koyulaştırılarak biraz daha düşük tutulabiliyor. Fakat normal şartlarda minimum 4.5:1 yapılarak okumak için yeterli koşul sağlanabiliyor.
Kontrast Oranı Nasıl Hesaplanıyor
(L1 + 0.05) / (L2 + 0.05)
- L1 relative luminance değeri açık olan renk
- L2 relative luminance değeri koyu olan renk
L değeri renklerin RGB değerlerine göre hesaplanıyor ve bu değer en açık beyaz için 0 ve en koyu siyah için ise 1 olarak geliyor.
İster RGB değeriyle, ister L değeriyle isterse de rengin Hex değeriyle bu kontrast oranına ulaşmak mümkün.
Ayrıca office programlarında ya da benzeri programlarda renk seçimleri yaparken size kontrast hesaplamasında gerekecek hex değerine aşağıdaki şekilde renk seçim kutusuna tıklayıp customa tıklayarak ulaşabilirsiniz.
Gerekli değerleri hesaplayan yahut direk kontrast oranını hesaplayan sitelere aşağıdaki linklerden ulaşabilirsiniz.
Relative Luminance and Contrast Ratio Calculator
Aşağıdaki linklerden herhangi bir değerini bilmediğiniz renklerin değerlerine ulaşabilirsiniz.
Web Accessibility Evaluation Tool – İnternet sitesi girerek girdiğiniz adresteki uyumsuzlukları görebiliyorsunuz.
ColorZilla – Renk görüntüleme eklentisi
Instant Eye Dropper – Renk Değeri Bulma Programı – Küçük ve hızlı bir tıkla çalıştır programı
Color Picker and Analyser – Renk görüntüleme ve analiz programı
İmage Color Picker – Elinizdeki rengin ekran görüntüsünü upload ederek renk değerini öğrenebilirsiniz
Ayrıca maksimum kontrastı sağlamak için renk paletlerinde bulunan Complementary Colors – tamamlayıcı renkleri seçebilirsiniz.
Bu sitede de konu hakkında güzel bilgiler var, örneğin ikea ve fedex logolarında zıt renklerin kullanılarak maksimum okunabilirlik ve tanınırlığın sağlandığından bahsetmiş.
İlave Linkler
Yüklediğiniz görselle uyumlu renkleri gösteren bir site
Renk incelemeleri yapan ve güzel bilgiler içeren bir site
Çeşitli hesaplayacıların olduğu bir site, ve benzeri bir diğer site
Çeşitli bilgiler veren bir boya firmasının sitesi
Gelecekte konuya tekrar dönmek istediğimde bulunsun diye tüm ilgimi çeken linkleri ekledim. Hayatın çoğu anında renk seçimleri yapabildiğimiz için konuya biraz hakim olmak önemli aslında.
Renkli ve güzel günler dilerim 🙂
Berker, renk secimi basit ve onemli degilmis gibi gorunen ama dogru yapilmadiginda kullanilabilirligi kotu yonde etkileyen bir sey. Bu konuyla ilgili birden fazla ders aldim. Uzun zamandir https://color.adobe.com/explore sayfasini kullaniyorum. Bu sayfada birbiriyle uyumlu renklerleden olusturulmus renk paletleri var. Ayrica cok fazla sayida renk kullanmak da kullanilabilirligi azaltan bir etken.
BeğenBeğen
Önerdiğin link de güzelmiş Kadir, matematiksel yöntemlerle doğru renkleri seçmek daha kolay oluyor, biraz göz zevki biraz da renk paketlerini kullanarak doğru yolu bulmak lazım
BeğenBeğen