Web İçeriği Nasıl Okunur: Tarayan Göz İçin Sayfa Düzeni

Ziyaretçi sayfanızı baştan sona okumuyor, tarıyor. Bunu düzeltilecek bir kusur saymak yanlış; tarama, kullanıcının "burada aradığım şey var mı" sorusuna verdiği hızlı cevaptır. Okunabilirlik de bu yüzden üslup meselesi değil, birkaç somut karardan ibaret.

Tarama varsayılan davranıştır

Nielsen Norman Group'un klasik ölçümüne göre ortalama bir ziyarette sayfadaki kelimelerin en fazla %28'i okunuyor, gerçekçi tahmin ise %20 civarında (kaynak). Bu sayıyı "kullanıcı tembel" diye okumak işe yaramaz. Kullanıcı bir eleme yapıyor, okumayı reddetmiyor. Aradığını bulduğu anda okuma oranı o bölümde tavan yapar.

Yani hedef, sayfanın tamamını okutmak değil. Hedef, doğru bölümü on saniye içinde bulunur hale getirmek.

F deseni tasarlanacak bir şey değil

Isı haritalarındaki F deseni sık sık bir düzen reçetesi gibi sunulur: önemli kelimeleri sola topla, ilk iki satıra yığ. Bu ters okuma. F deseni, metin taramaya yardım edecek şekilde yapılandırılmadığında ortaya çıkan bir iz. Göz tutunacak başlık, ayırt edici ilk kelime, anlamlı bir bağlantı bulamayınca sol kenardan aşağı kayar.

Dolayısıyla çözüm sola hizalı anahtar kelime yığmak değil, paragrafın ilk kelimelerinin bilgi taşıması. "Bu bölümde ele alacağımız konu…" diye başlayan bir paragraf taramada tamamen görünmez, çünkü ilk üç kelimesi hiçbir şey söylemiyor.

Madde listesi enflasyonu

Liste, etrafındaki metinden farklı göründüğü için işe yarar. Farkı yaratan şey azlığı. Sayfanın yarısı madde işaretiyse hiçbir madde öne çıkmaz ve liste, paragrafın nokta konmuş hali olmaktan öteye geçmez. Okunabilirlik adına yapılan en yaygın hata bu.

Liste iki koşulda gerçekten listedir: öğeler birbirine paralel yapıdadır (hepsi eylem, hepsi kriter, hepsi araç) ve sayıları ya da sırası okuyucu için bir anlam taşır. Bir fikri gerekçesiyle birlikte anlatıyorsanız o paragraftır. Üç maddeye bölünce daha okunabilir olmaz, sadece gerekçeyi kaybeder.

Ölçülebilen kısım

Okunabilirliğin tartışmaya açık olmayan tarafı tipografidir ve burası tahminle değil sayıyla çözülür:

• Satır uzunluğu 45-75 karakter arası. Geniş ekranda tam genişlik akan metin, göz satır başına dönerken yerini kaybettiği için yorar.
• Gövde metni en az 16px, satır yüksekliği 1.5 civarı.
• Metin ile arka plan arasında en az 4.5:1 kontrast oranı (WCAG AA). Açık gri üzerine daha açık gri, tasarım sunumunda hoş durur, telefonda güneş altında okunmaz.

Bunun için okunabilirlik eklentisi kurmaya gerek yok. Gövde metnine max-width: 65ch yazmak sorunun en görünür kısmını tek satırda kapatır, çünkü ch birimi kullanılan yazı tipinin karakter genişliğine bağlıdır ve font değişse bile satır uzunluğu aynı bantta kalır.

Başlık bir söz verir

Taramada gerçekten okunan tek metin katmanı başlıklardır. Bu yüzden başlık, altındaki bölümün ne söylediğini söylemeli. "Detaylar", "Genel Bakış", "Neden Önemli" gibi başlıklar sayfada yer kaplar, bilgi vermez. Aynısı menü etiketleri ve bağlantı metinleri için geçerli: "buraya tıklayın" yazan bir bağlantı, taramada hiçbir şey ifade etmez.

Bilgi mimarisi dediğimiz şeyin okunabilirliğe dokunduğu yer tam olarak burası. Kategori adları, sayfa başlıkları ve bağlantı metinleri tutarlıysa kullanıcı sayfayı okumadan da nerede olduğunu bilir.

SEO ile çatışma yok

Anahtar kelimeyi başlıkta ve ilk paragrafta kullanma tavsiyesi ile tarama davranışı aynı şeyi istiyor: konuyu erken söylemek. Çatışma, anahtar kelime metne zorla serpiştirildiğinde başlar. Sayfada aynı ifadenin sekiz kez geçmesi sıralamaya bugün katkı sağlamıyor, okuyucuya ise metnin insan için yazılmadığını hemen sezdiriyor.

Bir cümleyi anahtar kelime için kurduğunuzu fark ediyorsanız o cümleyi silin. Sıralamada kaybedeceğiniz şey, okuyucunun sayfayı terk etmesinden daha az.