Picture Superiority Effect Arayüzde Nerede İşler, Nerede İşlemez

Görsellerin kelimelerden daha iyi hatırlandığı laboratuvarda defalarca ölçüldü. Bulgu gerçek. Sorun, bulgunun arayüz tasarımına taşınırken ölçüldüğü koşulların geride kalması. Etkinin işlediği alan, tasarım yazılarında anlatıldığından epey dar.

Etki hangi koşulda ölçüldü

Allan Paivio'nun çift kodlama teorisi, bir görselin hem imge hem de sözel etiket olarak iki kez kodlandığını, bu yüzden hatırlanma olasılığının arttığını söyler. Deneyler tipik olarak şöyle kurulur: katılımcıya izole kelimelerden ya da izole resimlerden oluşan bir liste gösterilir, bir süre beklenir, sonra hatırlama ölçülür.

Bu kurulumdaki iki koşula dikkat et. Öğeler birbirinden bağımsızdır ve ölçülen şey serbest hatırlamadır. Bir arayüzde ise öğeler birbiriyle yarışır ve ölçmek istediğin şey hatırlama değil, çoğu zaman bulma ve doğru tıklama olur. Aradaki mesafe küçük değil.

Bu arada, konuyu destekler diye dolaşan "beyin görselleri metinden altmış bin kat hızlı işler" cümlesinin bilinen bir kaynağı yok. Kaynağı olmayan bir sayı, iddiayı güçlendirmez, tersine ona yaslanan her şeyi şüpheli hale getirir.

Her şey görsel olduğunda hiçbiri öne çıkmaz

Etki, bir görselin çevresindeki metne göre ayrıksı olmasından beslenir. Kırk ikonun yan yana dizildiği bir araç çubuğunda böyle bir ayrıksılık kalmaz; hepsi aynı boyutta, aynı stilde, aynı gri tondadır. Kullanıcının hatırladığı şey ikonun kendisi değil, konumu olur.

Pratik sonuç: görsel, sayfada tek başına ya da azınlıkta olduğunda hafızaya yardım eder. Sayfanın tamamı görsele döndüğünde hafıza avantajı sıfırlanır, geriye sadece indirilen bayt kalır.

İkon mu, etiket mi

Etiketli ikonu etiketsiz ikondan belirgin biçimde daha güvenilir buluyorum. Gerekçesi basit: ikon tanınırlığı kullanıcının önceki alışkanlıklarına bağlıdır ve o alışkanlık uygulamadan uygulamaya değişir. Disket simgesinin kaydetme anlamına gelmesi bir uzlaşımdır, doğal bir ilişki değil. Etiket ise bu uzlaşıma ihtiyaç duymadan çalışır.

Yalnız ikon kullanmanın savunulabilir olduğu tek yer, ikon setinin platform standardı olduğu ve kullanıcının onu günde onlarca kez gördüğü durumdur. Geri oku, çarpı, hamburger. Bunun dışındaki her ikon, kullanıcı testinde "bu ne yapıyor" sorusunu üretir.

Görselin faturası tasarım dosyasında görünmez

Bir cümle birkaç yüz bayt yer kaplar. Aynı mesajı taşıyan bir fotoğraf, iyi sıkıştırılmış haliyle bile yüz kilobayt bandındadır. Aradaki fark tasarım dosyasında görünmez, ölçümde görünür.

Hatırlanma avantajı, sayfa açılmadan devreye giremez. Kapak görselini büyük yükleyip LCP değerini iki katına çıkardığında kazandığın hafıza etkisi, kaybettiğin ziyaretçinin yanında küçük kalır. Kararı vermeden önce görselin gerçek ağırlığını ve mobil bağlantıda açılma süresini ölç. Ölçmediğin sürece bu bir tasarım tercihi değil, tahmin.

Ekran okuyucu kullanıcısı için etki hiç başlamaz

Ekran okuyucuya bir görsel değil, alt metni ulaşır. Yani o kullanıcı için içerik zaten metindir ve görsellerin üstünlüğü etkisi hiç devreye girmez. Bilgi taşıyan görselin alt metni, görselin ne gösterdiğini değil ne söylediğini yazmalı.

En kötü senaryo, metnin görsel içine gömülmesi. Ne hafıza avantajı doğar, ne seçilebilir metin kalır, ne de arama motoru okuyabilir. Bir infografikte önemli olan sayılar varsa aynı sayıları altına tablo olarak koy.

Görsel ne zaman gerçekten kazandırır

• Uzamsal ilişki anlatırken. Bir akış şeması, aynı akışı anlatan üç paragraftan hızlı okunur.
• Ürünün fiziksel görünümü kararın parçasıysa. Renk, doku, ölçek.
• Durum gösteriminde. Dolu, boş, hata. Renkle birlikte biçim farkı da veriliyorsa.
• Veri karşılaştırmasında. Sayı tablosu değerleri verir, grafik ilişkiyi verir.

Soyut bir kavramı anlatmak için seçilen stok fotoğraf bu listeye girmez. El sıkışan iki kişi güveni anlatmaz, sadece boşluğu doldurur ve sayfayı ağırlaştırır.