Çevrimiçi Okuma için Font Seçimi: Neyi Ölçmek Gerekiyor

Çevrimiçi okuma için tek bir en iyi font yok, ama bu "hepsi aynı" demek değil. Okuma hızı kişiden kişiye değişiyor ve yaş ilerledikçe aradaki fark açılıyor, dolayısıyla asıl soru hangi fontun kazandığı değil, kimin üzerinde ölçtüğünüz. Bir de fontun adı kadar etkili olan, tartışmanın çoğunlukla atladığı bir kısım var: satır uzunluğu, satır aralığı ve fontun tarayıcıya ne zaman ulaştığı.

Ortalamanın kazananı, kimsenin kazananı değil

Okunabilirlik çalışmalarında sık görülen bir sonuç şu: bir font ortalamada öne çıkıyor, ama katılımcı bazında bakıldığında sıralama dağılıyor. Garamond bir grupta en hızlı okunan font olurken, en çok kişide birinci sıraya çıkan başka bir font, örneğin Franklin Gothic olabiliyor. İki ölçüt farklı sorulara cevap veriyor ve aynı çalışmadan iki farklı "en iyi" çıkıyor.

Peki ortalama neden yanıltıcı? Çünkü kişiler arasındaki okuma hızı farkı, fontlar arasındaki farktan büyük. Yavaş okuyan birkaç kişinin hangi fontla test edildiği, tüm grubun ortalamasını kolayca kaydırır. Yaş burada en görünür değişken: ileri yaşta okuma yavaşlıyor ve font tercihinin etkisi belirginleşiyor, genç okuyucularda ise fontlar arası fark büyük ölçüde siliniyor.

Buradan çıkan pratik sonuç, popüler tavsiyelerin tersi. Kitlenizin yaş dağılımı genişse tek bir fontla herkesi optimize edemezsiniz; yapabileceğiniz şey en kötü durumu iyileştirmek, yani zayıf gören ya da yavaş okuyan kullanıcıyı zorlamayan bir font, punto ve kontrast bileşimi seçmek.

Seçimi kullanıcıya bırakmak

Arayüzde font seçeneği sunmak makul görünür. Uygulamada iki şey oluyor: kullanıcıların büyük kısmı varsayılanı hiç değiştirmiyor, değiştirenlerin bir bölümü de kendilerini yavaşlatan bir fontu seçiyor. Hoşa giden font ile hızlı okunan font aynı şey değil.

Peki bu seçeneği tamamen kaldırmalı mı? Hayır, çünkü bazı kullanıcılar için tercih bir konfor meselesi değil, erişim meselesi. Disleksi, düşük görme, ekran büyütme kullanan okuyucular için ayarlanabilirlik gerçek bir kazanç. Doğru kurgu şu: iyi bir varsayılan seçin, seçeneği gizli bir tercihler ekranında değil ama ana akışın da ortasında olmayan bir yerde bırakın, ve kullanıcının sistem düzeyindeki yazı boyutu ayarını ezmeyin.

Font testini nasıl yaparsanız sonuç anlamsız olur

"A/B testi yapın" tavsiyesi bu konuda çoğu zaman boşa gider. Sebebi ölçmek istediğiniz etkinin, kişiler arasındaki doğal farkın yanında küçük kalması. Ziyaretçilerin yarısına A fontunu, yarısına B fontunu gösterip sayfada kalma süresine bakarsanız, gördüğünüz şey büyük ihtimalle iki grubun kim olduğudur, fontun etkisi değil.

Okuma hızını ölçen çalışmalar bu yüzden aynı kişiye her iki fontu da okutur, metinleri zorluk bakımından eşler ve sırayı katılımcılar arasında dengeler. Küçük bir laboratuvar düzeneği bile bunu yapabilir: on beş kişi, kişi başı iki metin, her metnin sonunda birkaç anlama sorusu. Anlama sorusu şart, yoksa hızlı taramayı hızlı okuma sanırsınız.

Sayfada kalma süresi, tıklama oranı ve dönüşüm bu iş için kötü ölçütlerdir. Kalma süresinin artması okuyucunun metinden keyif aldığı anlamına gelebileceği gibi, metni zor söktüğü anlamına da gelir. İkisini ayırt edemeyen bir metriği font kararına dayanak yapmayın.

Türkçe metinde fontun teknik tarafı

Türkçe, fontu seçtikten sonra iki ek soru getirir. Birincisi kapsama: ğ, ş, İ ve noktasız ı karakterleri Latin temel alt kümesinde yok, latin-ext alt kümesinde. Alt kümeyi daraltıp dosya boyutunu kısarken bu karakterleri dışarıda bırakmak, tarayıcının o harfleri yedek fonttan çizmesine yol açar. Ekranda bir kelimenin ortasında değişen harf yüksekliği görürsünüz, sebebi de kolay kolay akla gelmez. İkincisi büyük harf davranışı: text-transform: uppercase kullandığınızda i harfinin İ olması dile bağlıdır, bunun için sayfada lang="tr" tanımlı olması gerekir.

Yükleme tarafında, gövde ve başlık için ayrı ayrı dosya indirmek yerine tek bir değişken fontun ağırlıklarını kullanmayı tercih ederim; iki ağırlık ve bir italik zaten üç ayrı istek demek, değişken font bunu tek dosyaya indiriyor. Fontları kendi sunucunuzdan servis etmek de ikinci bir alan adına bağlanma maliyetini kaldırır. Google Fonts dosyaları indirip barındırmaya izin verir, kullanmak için betiğine bağlı kalmanız gerekmez.

Bir de fontun ne zaman göründüğü var. font-display: swap metni hemen yedek fontla çizer, font gelince değiştirir; okuyucu beklemez ama satırlar yerinden oynayabilir. optional ise yavaş bağlantıda fontu o ziyaret için hiç kullanmaz, düzen sabit kalır. Metin ağırlıklı bir sitede ikincisi genelde daha iyi bir takas, çünkü sayfanın zıplaması okumayı fontlar arası hız farkından daha çok bozar. Yedek fontu seçerken de ölçülere yakın bir aile yazın, aksi halde takas anındaki kayma büyür.

Fontun tek başına taşımadığı yük

Punto, satır aralığı ve satır uzunluğu birlikte çalışır. Gövde metni için 16 ila 18 piksel makul bir başlangıç, satır aralığı punto değerinin yaklaşık 1,5 katı, satır uzunluğu ise 60 ile 75 karakter arasında. Uzun satırda göz satır sonundan bir sonraki satırın başına dönerken sık kaybolur, kısa satırda ise geri dönüş çok sıklaşır.

Kontrast tarafında WCAG normal boyutlu metin için 4,5:1 oranını isterken, 18,66 piksel kalın ya da 24 piksel normal metinde 3:1 yeterli sayılır. Saf siyah üzerine saf beyaz zorunlu değil, koyu gri bir metin rengi bu eşiği rahat geçer.

Bu üçünü ayarlamadan font değiştirmek, çoğu sitede ölçülebilir bir kazanç getirmez. Önce satır uzunluğunu ve aralığı düzeltin, sonra font tartışmasına dönün.