Web Sitesi Arayüz Tasarımı: Güzel Görünmek Yetmez
Bir web sitesinin arayüzünde okunabilirlik, hiyerarşi, erişilebilirlik ve kurumsal kimlik kararlarının nasıl alınması gerektiğini anlatan rehber.
Arayüz tasarımının amacı siteyi süslemek değil, ziyaretçinin yapmak istediği şeyi kolaylaştırmaktır. Etkileyici görünen ama aradığını buldurmayan bir site, sade ama anlaşılır bir siteye kaybeder.
Görsel hiyerarşi
Ziyaretçi sayfayı okumaz, tarar. Başlık, alt başlık ve düğmelerin boyutu neyin önemli olduğunu göstermelidir. Her sayfada tek bir ana eylem seçin: teklif iste, ara, kataloğu indir. Her şey vurgulandığında hiçbir şey vurgulanmamış olur.
Okunabilirlik
- Gövde metni telefonda rahat okunacak büyüklükte olmalı.
- Satırlar çok uzun olmamalı; geniş ekranda metni daraltın.
- Türkçe karakterleri eksiksiz destekleyen yazı tipi seçin. Bazı yazı tiplerinde ğ, ş ve İ harfleri farklı görünür.
Renk ve karşıtlık
Açık gri zemin üzerine gri yazı şık görünebilir, ama birçok kişi okuyamaz. Metin ile zemin arasındaki karşıtlık yeterli olmalıdır. Renk tek başına bilgi taşımamalıdır; hatalı form alanını yalnızca kırmızıyla değil, yazıyla da belirtin.
Erişilebilirlik
Klavyeyle gezinilebilen menüler, anlamlı bağlantı metinleri ve görseller için açıklama metinleri hem engelli kullanıcılar hem de arama motorları için önemlidir. Bu konuları tasarımın sonuna bırakmak yerine baştan düşünmek daha ucuzdur.
Tutarlılık
Düğme stilleri, boşluklar ve başlık boyutları sitenin her yerinde aynı olmalıdır. Bunun yolu küçük bir tasarım sistemi kurmaktır. Sonradan eklenen sayfalar da böylece bozulmaz.
Kurumsal kimlik
Logonuzu, renklerinizi ve yazı tiplerinizi web'e uyarlamak gerekir. Baskı için hazırlanmış bir renk ekranda farklı görünebilir. Logo vektör biçimde olmalıdır; bulanık bir logo tüm sayfanın algısını düşürür.
Hareket ve efektler
Otomatik dönen görseller ve ağır animasyonlar çoğu zaman dikkat dağıtır ve siteyi yavaşlatır. Hareketi yalnızca bir şeyi anlatmak için kullanın.
Tasarımı kim değerlendirmeli?
Tasarımı yöneticilerin zevkine göre değil, gerçek kullanıcıyla test ederek değerlendirin. Müşterilerinizden birine "fiyat teklifini nasıl istersin?" diye sorup telefonda denetin; nerede takıldığını izleyin.
Örnekler için web tasarım örnekleri yazımıza ve yaptığımız projelere bakabilirsiniz.