Web Sitesi İçin Renk ve Font Seçimi

Bir sitenin ilk izlenimi, tek bir cümle okunmadan renklerden ve yazı tipinden oluşur. Soluk gri yazılarla dolu bir sayfa güvensiz, her satırı farklı renkli bir sayfa dağınık görünür. Renk ve font seçimi bir süs işi değildir; okunabilirlik ve güven işidir. İyi haber şu ki bu seçimleri yapmak için tasarımcı olmanız gerekmiyor, birkaç temel kural yeterli.

Önce işletmenizin hissini belirleyin

Renk seçmeden önce işletmenizi üç sıfatla tarif edin. Bir çocuk kıyafet mağazası "neşeli, sıcak, güvenilir" olabilir; bir muhasebe bürosu "düzenli, sakin, güvenilir". Bu sıfatlar renklerin ve yazı tipinin yönünü gösterir. Sıcak tonlar yakınlık, soğuk tonlar sakinlik hissi verme eğilimindedir; ama bunlar kesin kurallar değil, genel eğilimlerdir. Sektörünüzdeki alışılmış renklerden ayrılmak da bilinçli bir tercih olabilir.

Logonuz varsa işe oradan başlayın. Logodaki baskın renk, sitenin ana rengi için en doğal aday olur. Böylece site, kartvizit ve tabela aynı kimliği taşır.

Az renk, çok etki

Çoğu işletme sitesi için beş renk fazlasıyla yeter:

• Bir ana renk: düğmelerde ve vurgularda
• İki üç nötr ton: zemin, kartlar, metin
• İsteğe bağlı bir vurgu rengi: uyarı ya da kampanya gibi nadir durumlar için

Ana rengi sayfanın her yerine boyamayın; yalnızca dikkat çekmek istediğiniz yerlerde, örneğin düğmelerde ve bağlantılarda kullanın. Sayfanın büyük kısmı nötr kalırsa ana renk gerçekten dikkat çeker.

Okunabilirlik: karşıtlık kuralı

Yazı rengi ile zemin rengi arasında yeterli fark olmalı. Açık gri zemin üzerinde açık gri yazı, tasarımcıya şık görünse de ekranı güneşin altında tutan biri için okunmaz. Koyu zemin üzerinde açık yazı ya da açık zemin üzerinde koyu yazı kullanmak güvenli bir yoldur. Erişilebilirlik standartlarında önerilen karşıtlık oranlarını ölçen ücretsiz araçlar vardır; renk çiftinizi bu araçlara yazıp sonucu görebilirsiniz.

Düğme metinleri için de aynısı geçerli. Parlak sarı zemin üzerine beyaz yazı yazmak, düğmenin ne dediğini görünmez kılar. Düğmenin rengini değiştirdiğinizde yazı rengini de gözden geçirin.

Renk tek başına bilgi taşımamalı

Renk körü ya da düşük görüşlü ziyaretçiler için kırmızıyı "hata", yeşili "başarılı" diye ayırt etmek zordur. Bir form hatasını yalnızca kırmızı çerçeveyle belirtmeyin; yanına bir mesaj yazın. Bir durumu göstermek için renk ile birlikte metin ya da simge kullanmak herkes için daha açıktır.

Yazı tipi: iki aile yeter

Yazı tipi seçiminde en önemli kural sadeliktir. Biri başlıklar, diğeri gövde metni için olmak üzere iki yazı tipi çoğu site için yeterlidir. İkisi birbirinden belirgin biçimde farklı olmalı ama aynı sayfada uyumlu görünmeli. Üç dört farklı yazı tipi karıştırmak sayfayı dağınık gösterir ve yüklenme süresini artırır.

Gövde metni için yalın, okunaklı bir yazı tipi seçin. Süslü, el yazısı benzeri yazı tipleri başlıkta ya da logoda yer alabilir; uzun bir paragrafı bu yazı tipiyle okumak yorucudur. Türkçe karakterleri (ı, İ, ş, ğ, ç, ö, ü) sorunsuz gösterdiğinden emin olun. Bazı dekoratif yazı tipleri bu harfleri desteklemez ve harfler farklı bir yazı tipine dönüşerek çirkin bir görünüme yol açar.

Boyut ve aralık

Gövde metni için 16 piksel ve üzerini, telefon için ise rahat okunur bir değeri tercih edin. Satır aralığı yazı boyutunun yaklaşık bir buçuk katı olduğunda metin rahat okunur. Paragraflar arasında boşluk bırakın. Başlıklar gövdeden belirgin biçimde büyük olmalı ama birbirleriyle de tutarlı bir hiyerarşi izlemeli: büyük başlık, orta başlık, normal metin.

Metin satırlarının çok uzun olmamasına dikkat edin. Geniş bir ekranda bir satırın yüzlerce harf içermesi okumayı güçleştirir. Metin alanını makul bir genişlikle sınırlamak okuma konforunu artırır.

Tutarlılık markadır

Aynı düğme sitenin her yerinde aynı renkte, aynı büyüklükte ve aynı yazı tipinde olmalı. Aynı başlık seviyesi her sayfada aynı görünmeli. Tutarlılık, ziyaretçiye sitenin düzenli olduğunu ve arkasında özen gösteren birinin bulunduğunu fısıldar. Farklı sayfalarda farklı tonlar ve farklı yazı tipleri kullanmak, bu izlenimi bozar.

Karanlık mod ve parlak ekranlar

Bazı ziyaretçiler cihazlarında koyu tema kullanır. Siteniz bu temayı destekliyorsa her iki durumda da metnin okunduğundan emin olun. Desteklemiyorsanız açık temada tutarlı kalmak yeterlidir; ancak yarım yamalak bir koyu mod, hiç olmamasından kötüdür.

Renkleri gerçek koşullarda deneyin

Ekranda iyi görünen bir renk paleti, güneşli bir kaldırımda ya da parlaklığı düşük bir telefonda bambaşka görünebilir. Siteyi kapalı bir odada değil, pencere kenarında ve farklı parlaklık seviyelerinde açın. Soluk bir gri yazı, ofiste okunur olsa da dışarıda kaybolabilir.

Bir ek kontrol olarak ekranın görüntüsünü gri tonlamaya çevirin. Metinle zemin arasındaki fark griye çevirdiğinizde bile hissediliyorsa kontrastınız sağlamdır. Düğmenin sayfadan ayrışıp ayrışmadığını da aynı şekilde görebilirsiniz. Bu basit yöntem, pahalı bir araca ihtiyaç duymadan en sık yapılan hatayı yakalar.

Bir de yaşlı bir yakınınıza ekranı gösterin. Gözü daha az seçici olan biri için okunabilen bir sayfa, hemen herkes için okunabilirdir.

Renk ve font kontrol listesi

• Ana renk logomla ve işletmemin hissiyle uyumlu mu?
• Toplam renk sayısı beşi geçmiyor mu?
• Yazı ile zemin arasında yeterli karşıtlık var mı?
• Düğme metni düğme rengi üzerinde okunuyor mu?
• Hata ve başarı durumları yalnızca renkle anlatılmıyor mu?
• En fazla iki yazı tipi kullanıldı mı ve Türkçe karakterler doğru görünüyor mu?
• Gövde metni telefonda rahat okunuyor mu?
• Aynı öğe sitenin her yerinde aynı görünüyor mu?

Bu liste, güzel olduğunu düşündüğünüz bir tasarımı gerçekten okunabilir ve tutarlı olduğuna emin olarak yayımlamanıza yardımcı olur.