Ana Sayfa Tasarımı: İlk Ekranda Ne Olmalı, Ne Olmamalı

Ana sayfa bir sitenin en çok görülen sayfası ve tasarımında verilen kararların çoğu estetik değil: logo nerede duruyor, ilk ekranda hangi cümle var, butonun üstünde ne yazıyor. Bu kararların bir kısmı ölçülebilir fark yaratır, bir kısmı tekrarlanmaktan tavsiyeye dönüşmüş alışkanlıktır. İkisini ayırmak, yeni bir tema aramaktan daha çok işe yarar.

Logo, ana sayfa bağlantısı ve adres yapısı

Her sayfanın sol üstündeki logo ana sayfaya gitmeli. Bu bir tercih değil, öğrenilmiş bir refleks: ziyaretçi kaybolduğunda oraya tıklar. Menüde ayrıca "Ana Sayfa" maddesi tutmak çoğu kurumsal sitede yer kaybıdır, ama gezinme derinliği üç seviyeyi aşan sitelerde ikisi birlikte dursun.

Adres yapısı da aynı işi görür. Ziyaretçi adres çubuğunu elle kısaltarak ana sayfaya dönmeyi dener, dolayısıyla kök adres çalışan bir sayfa olmalı ve alt dizinler tahmin edilebilir kalmalı.

İlk ekran ne yaptığınızı söyler

Ziyaretçi ana sayfaya "burası ne yapıyor, bana ne veriyor" sorusuyla gelir. Cevap ilk ekranda, tek cümlede olmalı. "Çözüm ortağınız", "yenilikçi yaklaşım" gibi ifadeler bu cevabı vermez; hangi sektöre hangi hizmeti verdiğinizi yazan sade bir cümle verir.

Görseller de aynı kurala tabi. Stok fotoğraf yerine kendi ürününüzün, ekibinizin ya da arayüzünüzün fotoğrafı bilgi taşır. Taşımıyorsa görselin orada durması için bir sebep yok.

"Üst kat" diye tek bir yer yok

En sık tekrarlanan tavsiye şu: önemli içerikler kaydırmadan görünsün. Tavsiyenin kendisi doğru, ölçüsü tanımsız. 360x640 bir telefonda tarayıcı çubukları çıktıktan sonra elinizde 500 piksel civarı yükseklik kalır; 1080p bir masaüstü tarayıcıda 900 pikselin üzerinde. Aynı bölümü her iki yerde de "ilk ekranda" tutmaya çalıştığınızda masaüstünde yarısı boş, telefonda yarısı kesik bir tasarım çıkar.

Çalışan yaklaşım, ilk ekrana tek bir iş yüklemek: kim olduğunuzu söyleyen cümle ve bir yönlendirme. Geri kalanı kaydırmayla gelsin. Aşağı ok simgeleri, kaydırmanın yıllar önce refleks haline geldiği bir kitlede iş görmez (bunları süs sayıyorum). Hangi yüksekliğe tasarlayacağınıza karar verirken de kendi analitiğinizdeki viewport dağılımına bakın, tasarım dosyasındaki çerçeveye değil.

Buton etiketleri

"Daha Fazla" ve "Buraya Tıklayın" hiçbir şey söylemez. Etiket, tıklamadan sonra ne olacağını söylemeli: "Teklif Al", "Demoyu İzle", "Fiyatları Gör". Fiil artı nesne, iki üç kelime.

Ana sayfada üçten fazla birincil yönlendirme varsa hiçbiri birincil değildir. Hangisinin öne çıkacağına karar verin. Karar veremiyorsanız sorun butonlarda değil, o sayfanın ne için var olduğunun belirsiz kalmasındadır.

Ana sayfadan çıkarılacaklar

Sadelik soyut bir hedef değil, kısa bir çıkarma listesi:

• Girişte açılan pencereler. Yasal zorunluluk dışında hiçbiri kalmasın.
• Otomatik oynayan video. Sesi kapalı olsa bile ilk yüklemeyi ağırlaştırır.
• Kendi kendine dönen slider. İlk kareden sonrasını neredeyse kimse görmez, buna karşılık her kare için birkaç boyutta görsel üretmek ve sonra da güncel tutmak gerekir.
• İçeriğin görünmesini geciktiren giriş animasyonları.

Bu liste uygulandığında ana sayfanın sıkıcı görüneceği düşünülür. Görünmez, hızlı görünür. Ziyaretçinin ana sayfada geçirdiği birkaç saniyede fark ettiği şey de zaten bu.