Web Sitesinde Görseller: Hangisi Anlatır, Hangisi Süs
"Görsel kullanın, akılda kalır" tavsiyesi o kadar sık tekrarlanıyor ki, hangi görselin neyi kazandırdığı sorulmaz olmuş. Oysa bir sayfadaki görsellerin çoğu anlatmıyor, yer kaplıyor. Ayrım basit bir soruyla yapılabiliyor: bu görseli kaldırırsam metin bir şey kaybeder mi?
Anlatan görsel ile dolgu görsel
Bir ekran görüntüsü, bir diyagram, ürünün gerçek kullanım anı: bunlar metnin tek başına yapamayacağı bir işi yapar. Klavyeye uzanmış bir el fotoğrafı ise metnin söylediğini tekrar etmez bile, sadece boşluğu doldurur. İkisi aynı kutuya "görsel" diye konduğu için, sayfada görsel sayısı artınca iletişimin güçlendiği sanılıyor.
Kaldırma testi bunu hızlıca ayırıyor. Görseli çıkarın, paragrafı tek başına okuyun. Anlam eksilmiyorsa o görsel dolgudur, yerinde kalması için de bir gerekçe gerekir. Estetik bir gerekçe olabilir, ama o zaman kararı estetik hesabıyla verin, anlaşılırlık hesabıyla değil.
Stok fotoğraf yasağı fazla geniş bir kural
Yaygın tavsiye stok fotoğraftan tümüyle kaçınmak yönünde. Sorun stok olmasında değil, jenerik olmasında. Bir soyut kavramı anlatan iyi seçilmiş bir arşiv fotoğrafı, aceleyle çekilmiş bulanık bir ofis fotoğrafından daha iyi iş görür.
Buna karşılık ürününüz ekranda yaşıyorsa, hiçbir arşiv görseli kendi arayüzünüzün görüntüsünün yerini tutmaz. Yazılım anlatan bir sayfada gerçek bir ekran görüntüsü hem kanıt hem tarif olur. Fiziksel üründe de aynısı geçerli: gözlüğü beyaz fon üzerinde değil, birinin yüzünde göstermek ölçek sorusunu tek karede cevaplar.
Yerleşim, sayıdan daha belirleyici
Görselin açıkladığı cümleyle arasına başka içerik girdiğinde, okuyucu ikisini eşleştirmek için geri dönmek zorunda kalıyor. Mobilde tek sütuna inen düzenlerde bu bozulma daha da sık görülür, çünkü masaüstünde yan yana duran metin ve görsel alt alta düşerken araya bir kutu daha girebilir.
Bir de kaynaklarda sık rastlanan bir çelişki var: aynı listede hem "az ve seçici görsel kullanın" hem "her ana başlığa bir görsel ekleyin" yazıyor. İkincisi bir kota, birincisi bir eleme kuralı. Kotayı takip ederseniz, anlatacak görseli olmayan bölümlere de görsel uydurmuş olursunuz. Bölüm sayısı değil, açıklanmayı gerçekten hak eden nokta sayısı belirlemeli.
Ağırlık bir tasarım kararıdır
Netlik ile hız arasındaki denge çoğu yazıda "optimize edin" diyerek geçiştiriliyor. Pratikte iki şey ölçülür: görselin ekranda kapladığı gerçek piksel genişliği ve indirilen dosyanın boyutu. 2400 piksellik bir görseli CSS ile 600 piksele küçültmek kaliteyi artırmaz, sadece kullanıcıya dört katı veri indirtir. Farklı genişlikler için ayrı boyutlar üretip srcset ile sunmak bu farkı tek başına kapatır.
Format tarafında webp ve avif, aynı görsel kalitesinde jpeg'e göre belirgin şekilde küçük dosyalar üretiyor. Sayfanın üst kısmındaki büyük görsel çoğu düzende sayfanın en geç yüklenen belirleyici öğesi olur, yani ilk izlenim süresini doğrudan o dosya belirler. Ölçmeden yapılan "kalite kaybetmeyelim" tercihi genelde hız kaybıyla ödenir.
Testler neyi ölçtüğünü bilmek şartıyla işe yarar
Beş saniye testi, görselin ne hatırlattığını sorar. Faydalıdır, ancak bir varsayım taşır: görsel o beş saniyenin başında ekranda olmuş olmalı. Yavaş bağlantıda görsel üçüncü saniyede geliyorsa test aslında iki saniyelik bir izlenimi ölçüyordur ve sonuç görsel seçimini değil, teslim hızını yansıtır. Testi hızlı bir laboratuvar bağlantısında yapıp sahadaki davranışa genellemek burada yanıltıcı olur.
Açık uçlu tanımlama, kullanıcının görseli kendi cümleleriyle anlatmasını ister ve yanlış anlamayı yakalamakta beş saniye testinden daha bilgi verici. A/B testi ise ancak karşılaştırdığınız iki sürüm arasındaki tek fark görselse anlam taşır; başlık da değiştiyse elinizde yorumlanamaz bir sonuç kalır.
Kültürel okuma farkları da bu ölçümlerin içinde çıkar. El hareketleri, renk çağrışımları ve bayram temalı görseller pazar değiştirdiğinde başka anlamlara gelebiliyor. Tahmin yürütmek yerine hedef pazardan birkaç kişiye görseli tarif ettirmek, uzun kültürel listeler ezberlemekten daha kısa yol.