Marka rengini korurken web yazılarını nasıl daha okunur yaparsınız?
Markanın açık yeşili bir logoda iyi görünebilir, fakat aynı renk beyaz zemindeki küçük açıklamaya taşınınca okumak zorlaşabilir. Rengi tamamen bırakmak ile her yerde aynı tonu kullanmak arasında seçenekler vardır. Önce rengin görevini belirleyin: metin, zemin, vurgu veya süsleme. Bu yazı bir markanın bütün erişilebilirliğini puanlamaz; yazı ve arka plan eşleşmesini teslimde kontrol etmek için somut bir çalışma yöntemi önerir.
Palet yerine kullanım çiftlerini listeleyin
Marka sunumundaki beş renk, sitede çok daha fazla eşleşmeye dönüşür. Açıklama metni açık zeminde, düğme yazısı vurgu zemininde, kart başlığı fotoğraf üzerinde görünebilir. Her önemli bileşen için yazı rengi ve hemen arkasındaki zemini birlikte kaydedin. Renk kodu tek başına kontrastı anlatmaz.
Önceliği işlem yapmayı veya karar vermeyi etkileyen bilgilere verin: ürün ölçüsü, form açıklaması, hata mesajı ve bağlantı gibi. Büyük, dekoratif bir başlık okunaklıyken daha küçük yardımcı metin zor okunabilir. İncelemeyi yalnızca ana sayfanın ilk ekranıyla sınırlamayın; gerçek içerikle doldurulmuş sayfalara bakın.
Ölçüm sonucunu tasarım kararıyla ilişkilendirin
WCAG’nin metin kontrastı ölçütü, olağan metin için en az 4,5:1; büyük metin için 3:1 oranını tanımlar. “Büyük” sınıfının da teknik koşulları vardır; yalnız ekranda büyük görünmesine göre karar vermeyin. Geliştiriciden hesaplanan oranı ve kullanılan gerçek renkleri kontrol etmesini isteyin.
Ölçüm yetersizse birkaç seçenek deneyin: yazı tonunu koyulaştırmak, daha açık bir zemin kullanmak veya fotoğrafın üzerine sabit bir metin alanı yerleştirmek. Marka rengini vurgu çizgisinde veya dekoratif parçada koruyabilirsiniz. Amaç her alanı siyah yapmak değil, hangi rengin hangi işi yapacağını bilinçli seçmektir.
Fotoğrafın en zor bölgesini de kontrol edin
Bir başlık fotoğrafın koyu köşesinde okunaklıyken mobil kadrajda açık bir duvarın üstüne gelebilir. Yalnız ortalama görüntü rengine bakmayın. Metnin arkasına düşebilecek farklı bölgeleri ve farklı ekran oranlarını deneyin; gerekirse metni fotoğraftan ayırın.
Yarı saydam katmanlarda sonuç alttaki görsele bağlıdır. İçerik ekibi daha sonra başka bir fotoğraf yüklediğinde ilk ölçüm geçerli kalmayabilir. Fotoğraf seçimi için basit bir kural ve kontrol sorumlusu belirleyin. Kadraj kararını mobil görsel rehberimizle birlikte değerlendirin.
Aynı zemin üzerinde iki metni karşılaştırın
Teslimi durumlar üzerinden gözden geçirin
Düğmenin yalnız normal görünümünü değil üzerine gelme, klavye odağı ve seçili durumunu da inceleyin. Açık ve koyu tema varsa ayrı çiftler oluşturun. Renk değişiminin yanında gerekli metin veya işaret de bulunmalı; örneğin hata yalnız kırmızı bir çerçeveden anlaşılmamalı.
Kontrol listesini bileşen adı, renk çifti, bulunan sorun ve sorumlu kişi olarak tutun. Birkaç başarılı ölçüm, bütün sitenin erişilebilir olduğu anlamına gelmez. Erhan Mobilya projemiz marka sunumu için bağlam sağlar; buradaki örnek palet o projeden alınmamıştır. Web tasarım tesliminde okunurluk kararlarını da görsel dosyalar kadar açık biçimde paylaşın.
Sık sorulan sorular
Marka rengini değiştirmek zorunda mıyız?
Her zaman değil. Aynı rengin daha koyu bir tonunu metinde, açık tonunu zeminde veya dekoratif alanlarda kullanmak mümkün olabilir. Eşleşmeyi ölçerek karar verin.
Kontrast ölçümü bütün erişilebilirliği kanıtlar mı?
Hayır. Klavye kullanımı, içerik yapısı, etiketler ve başka kontroller ayrıca değerlendirilir. Bu çalışma yalnız belirli renk eşleşmeleri hakkında kanıt sağlar.