Madde Listeleri: Ne Zaman Yardım Eder, Ne Zaman Bilgi Kaybettirir
Madde listesi web metninin varsayılan çözümü haline geldi: paragraf uzadıysa böl, üç şey sayılacaksa alt alta yaz. Çoğu zaman da işe yarar. Ama paragrafı listeye çevirdiğin her seferde bir şey kaybedersin, çünkü liste biçimi maddeleri birbirine eşit ve bağımsız gösterir. Asıl soru kuralların ne olduğu değil, o kaybı göze alıp almadığın.
Liste, maddeler arasındaki bağı siler
Bir paragrafın içindeki "çünkü", "ancak", "bu yüzden" gibi bağlaçlar süs değil, bilgi taşır. Cümleleri alt alta madde yaptığında hepsi düşer ve geriye eşit ağırlıkta, birbirine bakmayan üç satır kalır.
Kart bilgisi doğrulanır, adres kontrol edilir, sipariş oluşturulur. Bunları madde işaretiyle alt alta yazarsan okuyucu üç ayrı kontrol görür; oysa üçüncüsü ilk ikisi geçtiği için oluyor. Sıra ve koşul biçimden okunmuyorsa metin bilgi kaybetmiş demektir. Liste kurmadan önce sorulacak tek soru bu: maddeler gerçekten birbirinden bağımsız mı?
ul ile ol arasındaki fark görsel değil
Numaralı liste "sıra önemli" ya da "adet önemli" der. Adım adım bir kurulum, bir sıralama, bir öncelik listesi numaralı olmalı. Seçenek sunuyorsan, yani okuyucu maddelerden herhangi birini alıp gidebiliyorsa, işaretli liste doğrusudur.
Bu tercihi CSS ile geri almaya çalışmak yanlış yerden çözmektir. Numarayı gizleyip madde işareti koyabilirsin ama işaretleme hâlâ sıralı liste der ve ekran okuyucu maddeyi "7 öğeden 2." diye okur. Görünen ile duyulan ayrışır.
Eşit uzunluk hedef değil, belirti
"Maddeleri benzer uzunlukta yaz" tavsiyesi yaygın ama ters yönden kuruluyor. Maddelerden biri diğerlerinin üç katı uzunluktaysa problem uzunluk değildir; o madde büyük ihtimalle aynı listeye ait değildir ya da kendi başına bir paragrafı hak ediyordur. Simetriyi tutturmak için içerik kırpmak, biçimin anlamı yönetmesi demek.
İşe yarayan asıl kural paralel yapı: maddeler aynı dilbilgisel kalıpla başlasın, hepsi fiille ya da hepsi isimle. Okuyucu ikinci maddede kalıbı öğrenir, kalanını taramaya başlar. Uzunlukların birbirine yaklaşması zaten bunun yan etkisi.
Girişi ve noktalamayı bir kez kararlaştır
Liste, üstündeki cümleden ne içerdiğini anlayacak kadar bağlam almalı. "Etkinlik için:" yetmez, "Etkinlik çantasında bulunması gerekenler:" yeter. Okuyucu listeye girmeden ne aradığını bilsin.
Noktalamada tek kural yok, tutarlılık var. Maddeler tam cümleyse büyük harfle başlar ve nokta alır; öğe adı, ürün, tek kelimeyse noktasız kalır. Aynı sayfada iki farklı stili karıştırma; okuyucu farkı bilinçli fark etmez ama metin dağınık görünür.
Görünmeyen kısım: işaretlemenin kendisi
Listenin en somut faydası ekranda değil, ekran okuyucuda ortaya çıkar. Gerçek bir ul ya da ol öğesine gelindiğinde okuyucu "liste, 7 öğe" bilgisini duyar ve daha ilk maddeye girmeden ne kadarlık bir yığınla karşılaştığını bilir. Satır sonlarıyla ve elle yazılmış nokta karakteriyle taklit edilen liste bunu vermez, sadece art arda birkaç cümle olarak okunur.
Bir ayrıntı da tasarım tarafında: Safari, listeye list-style: none uygulandığında öğenin liste rolünü erişilebilirlik ağacından düşürüyor. Yani madde işaretlerini kaldırdığın anda "7 öğe" duyurusu da gidiyor. Çözümü basit, rolü elle geri yazarsın (bir stil kuralının anlamı silmesini hâlâ tuhaf bir tercih buluyorum):
<ul role="list" class="isaretsiz">SEO tarafındaki iddia abartılı
Madde listesi kurmak sıralamayı yükseltmez. Yaptığı şey daha dar: sorgu zaten bir liste bekliyorsa, örneğin "nasıl", "adımları", "türleri" gibi bir kalıpsa, iyi işaretlenmiş bir listenin öne çıkan sonuç olarak çekilme ihtimali artar. Liste olmayan bir içeriği madde işaretlerine bölerek bu ihtimali yaratamazsın, sadece okunması zor bir sayfa üretirsin.
Karar kuralı
Listeye maddeler aynı seviyedeyse, birbirinden bağımsızsa ve sayılabiliyorsa geç. Üçünden biri tutmuyorsa paragrafta kal; bağlaçlar orada durduğu için metin daha az yer kaplar ve daha çok şey söyler. İç içe listeye ihtiyaç duyduğun noktada da genellikle liste değil, alt başlıklı bir bölüm ya da tablo aranıyordur.