Web

Boş Durum Tasarımı (Empty State) Web Sitenizde Neden Önemlidir?

Talha Aslan 15 dakikalık okuma 3 görüntülenme

Kısa cevap

Boş Durum Tasarımı (Empty State) Nedir?

Boş durum tasarımı, arama sonucu, sepet, bildirim kutusu ya da filtre ekranı boş kaldığında kullanıcıya sunduğunuz ekran düzenini tanımlar. İngilizce kaynaklarda empty state olarak geçer; durumu açıklayan kısa bir metin, bir sonraki adımı öneren bir bağlantı ve markaya uygun sade bir görsel içerir.

Tüm detaylar ve örnekler için yazıya devam edin

Peki bu ekranlar neden önemlidir? Çünkü kullanıcı arama kutusuna bir terim yazdığında ya da sepetini henüz doldurmadığında karşılaştığı ilk şey bu boş alanlardır. Dolayısıyla bu alanın tasarımı, kullanıcının siteyle ilgili ilk izlenimini doğrudan şekillendirir.

Bu yazıda boş durum tasarımının hangi sayfa tiplerinde öncelik taşıdığını, hangi bileşenleri içermesi gerektiğini ve 'sonuç bulunamadı' ekranının nasıl bir fırsata çevrilebileceğini ele alıyoruz. Ayrıca sepet, bildirim ve favori sayfalarındaki boş durum mantığını da kavram düzeyinde açıklıyoruz.

Ayrıca bu konuyu ele alırken İngilizce ve Türkçe adlandırmayı yan yana kullanıyoruz; sektörde her iki terim de yaygındır. Siz de ekibinizle konuşurken hangi terimi tercih ederseniz edin, önemli olan tasarımın kendisidir.

Bu konuyu özellikle e-ticaret ve hizmet siteleri için önemli buluyoruz; çünkü her iki site türü de kullanıcıyı sürekli arama, filtreleme ve sepet akışlarına yönlendirir. Dolayısıyla bu akışların herhangi bir noktasında boş bir ekranla karşılaşmak, kullanıcının güvenini zedeler.

Arama Sonucu Bulunamadığında Ekran Neden Boş Kalmamalı?

Kullanıcı arama kutusuna bir terim yazdığında ve hiçbir sonuç çıkmadığında, ekranın tamamen boş kalması kullanıcıyı sitede kaybolmuş hissettirir. Bu an, ziyaretçinin siteden ayrılıp ayrılmayacağına karar verdiği kritik bir eşiktir. Bu yüzden ekranı yalnızca teknik bir mesajla geçmek, elinizdeki bir ziyaretçiyi sessizce kaybetmeniz anlamına gelir.

Nitelikli bir boş durum burada devreye girer. Örneğin arama teriminde bir yazım hatası olduğunu fark ettirip benzer bir terim önerebilir, popüler kategorilere veya en çok görüntülenen sayfalara bağlantı verebilirsiniz. Böylece kullanıcı siteden ayrılmak yerine aramasına başka bir yoldan devam eder.

Üstelik bu yaklaşım yalnızca tek bir ekranı değil, sitenizin genel arayüz tutarlılığını da güçlendirir. Arayüz tasarımındaki UX hatalarının satışı nasıl düşürdüğünü ele aldığımız yazımızda bu konuya daha geniş bir çerçeveden bakıyoruz.

Örneğin bir hizmet sitesinde arama kutusuna yazılan bir bölge adı sonuç vermiyorsa, kullanıcıya en yakın hizmet alanını önermek işe yarar. Bu küçük müdahale, ziyaretçinin sayfadan hemen çıkmasını önler ve aramasına devam etmesini sağlar.

Bu konuda ölçtüğünüz tek metrik arama hacmi olmamalıdır; boş sonuç oranını da düzenli olarak takip etmeniz gerekir. Çünkü yüksek bir boş sonuç oranı, ürün kataloğunuzda ya da arama mantığınızda bir sorun olduğuna işaret edebilir.

Teknik Hata Metni Göstermek Neden Yeterli Değildir?

'Sonuç bulunamadı' ya da 'Veri yok' gibi kuru bir sistem mesajı, kullanıcıya ne yapması gerektiğini söylemez. Bu tür bir metin durumu bildirir ama yön göstermez; kullanıcı bir sonraki adımı kendi başına bulmak zorunda kalır. Bu yüzden ziyaretçilerin büyük bir kısmı bu noktada geri tuşuna basar.

Nielsen Norman Group'un boş durum tasarımı üzerine yayınladığı inceleme, bu tür mesajların sistemin çalışıp çalışmadığı konusunda kafa karışıklığı yarattığını belirtir. Kurumun yayınladığı makaleye göre, mesaj doğru olmadığında ya da sonradan değişen bir içerikle çakıştığında bu durum özellikle zarar verici hale gelir.

Bu nedenle teknik bir hata metni yerine, durumu açıklayan ve bir çözüm sunan bir yaklaşım tercih etmeniz gerekir. Peki bu yaklaşım tam olarak neyi içermeli?

Bu yüzden kuru bir hata metni yerine kullanıcıyı anlayan bir ton tercih etmeniz, güven oluşturmanıza yardımcı olur. Özellikle mobil cihazlarda ekran küçük olduğundan, bu metni sade ve kısa tutmanız gerekir.

Kullanıcı deneyimi ekibiniz bu metinleri yazarken müşteri destek ekibinizden de girdi almalıdır. Destek ekibi, kullanıcıların en çok hangi boş ekranlarda takıldığını günlük olarak gözlemler ve bu gözlem, metni daha gerçekçi kurmanıza yardımcı olur.

İyi Bir Boş Durum Tasarımı Hangi Üç Bileşeni İçermeli?

İyi bir boş durum tasarımı üç bileşeni bir arada taşır: durumu açıklayan kısa bir metin, bir sonraki adımı öneren bir bağlantı veya buton ve markaya uygun sade bir görsel ya da ikon. Bu üç bileşen birlikte çalıştığında boş ekran bir çıkmaz olmaktan çıkar.

  • Durumu açıklayan metin: kullanıcıya neden bu alanın boş olduğunu kısaca anlatır.
  • Yönlendirici bağlantı veya buton: kullanıcıyı bir sonraki mantıklı adıma taşır.
  • Sade görsel veya ikon: markanın tonunu yansıtır, abartılı animasyonlardan uzak durur.

Örneğin bir favori listesi boşsa metin 'Henüz favori ürününüz yok' diyebilir, bağlantı kategorilere göz atmayı önerebilir, görsel ise basit bir yıldız ikonu olabilir. Ayrıca bu üç bileşenin tonu sitenizin genel yazı tipi seçimiyle de uyumlu olmalıdır; tipografi seçiminizle çakışan bir boş durum metni sayfanın bütünlüğünü bozar.

Bu üç bileşenin hiçbiri tek başına yeterli değildir; birlikte çalıştıklarında anlam kazanırlar. Örneğin sadece görsel eklemek, kullanıcıya hiçbir yönlendirme sunmadığı için eksik kalır.

Bu bileşenleri oluştururken ekip içinde ortak bir şablon kullanmanız, sitenizin farklı bölümlerinde tutarsız boş ekranlar ortaya çıkmasını önler. Örneğin tasarım ekibiniz bu üç bileşeni içeren tek bir şablon hazırlayıp geliştirme ekibinizle paylaşabilir.

Durumu Açıklayan Metni Nasıl Yazarsınız?

Durumu açıklayan metin kısa, dürüst ve doğrudan olmalıdır; 'hata oluştu' gibi genel ifadeler yerine durumun kendisini anlatan bir cümle kurarsınız. Örneğin 'Aradığınız terimle eşleşen ürün bulamadık' cümlesi, 'Hata: 0 sonuç' gibi bir sistem mesajından çok daha açıklayıcıdır.

Bu metni yazarken kullanıcının o anki ruh halini de göz önünde bulundurursunuz. Çünkü bir arama sonucu boşken kullanıcı hayal kırıklığına uğramış olabilir; bu yüzden metin suçlayıcı değil, yardımcı bir tonda kalmalıdır.

Metin yazımı konusunda daha ayrıntılı bir çerçeve istiyorsanız UX writing rehberimize göz atabilirsiniz; orada buton ve bağlantı metinlerinin nasıl kurulacağını da ele alıyoruz.

Bu nedenle metni yazarken kısa cümleler kurmanız ve gereksiz teknik terimlerden kaçınmanız önerilir. Peki bu metni hangi bağlantı ya da buton tamamlamalı?

Metni yazarken kullanıcıya doğrudan hitap eden 'siz' dilini tercih etmeniz, metni daha kişisel hale getirir. Örneğin 'Aradığınız ürünü bulamadık' cümlesi, 'Ürün bulunamadı' gibi kişisiz bir ifadeden daha sıcak bir ton taşır.

Bir Sonraki Adımı Öneren Bağlantı veya Buton Neden Gerekli?

Durumu açıklayan metin tek başına yeterli değildir; kullanıcıya atabileceği somut bir adım da göstermeniz gerekir. Aksi halde ziyaretçi durumu anlar ama ne yapacağını bilemez ve sayfadan çıkar.

Bu bağlantı ya da buton bağlamla doğrudan ilişkili olmalıdır. Örneğin sepet boşsa buton 'Popüler ürünlere göz at' diyebilir, bildirim kutusu boşsa bağlantı bildirim ayarlarına ya da yardım sayfasına yönlenebilir. Böylece kullanıcı tek tıkla ilerleyebileceği bir yol bulur.

Nielsen Norman Group'un vurguladığı gibi, bu bağlantı kullanıcıyı ilgili işlevin tam olarak bulunduğu yere taşımalıdır; genel bir ana sayfa bağlantısı bu amaca hizmet etmez.

Örneğin bir hizmet listesi boşsa, buton doğrudan ilgili kategoriye ya da iletişim formuna yönlenebilir. Böylece kullanıcı bir sonraki adımı aramak zorunda kalmaz.

Bağlantının metni de görsel kadar önemlidir; 'buraya tıklayın' gibi genel bir ifade yerine, kullanıcıyı bekleyen işlemi açıkça belirten bir metin tercih etmeniz gerekir. Örneğin 'Popüler ürünleri gör' ifadesi, 'Tıkla' ifadesinden çok daha açıklayıcıdır.

Markaya Uygun Görsel veya İkon Ne İşe Yarar?

Basit bir görsel ya da ikon boş ekranı tamamen metinden ibaret bir uyarıya dönüştürmez; sayfaya bir nefes alanı ve marka kimliği katar. Google'ın Material Design rehberi bu görselin nötr veya markaya uygun bir tonda olması gerektiğini belirtir.

Ancak görsel abartılı animasyonlarla ya da uzun yükleme süreleriyle kullanıcıyı yormamalıdır. Çünkü amaç dikkat çekmek değil, metnin ve bağlantının anlaşılırlığını desteklemektir.

Bu görsel sitenizin genel yerleşim mantığıyla da tutarlı olmalıdır. Grid sistemi üzerine kurulu bir sayfada boş durum görseli de aynı hizalama kurallarına uymalıdır; aksi halde sayfa dağınık durur.

Bu görseli seçerken marka renklerinizi ve çizim stilinizi de göz önünde bulundurursunuz. Çünkü tutarsız bir görsel, kullanıcıya sayfanın aceleyle hazırlandığı hissini verir.

'Sonuç Bulunamadı' Ekranını Nasıl Bir Fırsata Çevirirsiniz?

'Sonuç bulunamadı' ekranını doğru kurduğunuzda, kullanıcıyı siteden koparmak yerine aramasına devam etmesini sağlayan bir fırsata çevirirsiniz. Bunun için ekranın yalnızca durumu bildirmesi yetmez; bir çözüm de önermesi gerekir.

Örneğin kullanıcı 'ayakabı' yazdığında sistem 'ayakkabı' terimini önerebilir; bu basit bir yazım düzeltmesi, kullanıcının yeniden arama yapmasını gerektirmeden sonuca ulaşmasını sağlar. Ayrıca en çok aranan terimler ya da popüler kategoriler de bu ekranda listelenebilir.

Bu sayede ziyaretçi, aramasının başarısız olduğunu fark ettiği anda bile sitede kalmaya devam eder. Peki yazım hatası önerisi tam olarak nasıl çalışır?

Bu yaklaşım özellikle sezonluk ürün satan siteler için değerlidir; stokta olmayan bir ürün aratıldığında benzer kategoriler önerilebilir. Böylece kullanıcı aramasının tamamen sonuçsuz kaldığını düşünmez.

Bu fırsatı değerlendirirken arama kayıtlarınızı düzenli olarak incelemeniz faydalıdır. Örneğin hangi terimlerin sürekli boş sonuç verdiğini görürseniz, kataloğunuzda eksik kalan bir kategoriyi fark edebilirsiniz.

Arama Teriminde Yazım Hatası Önerisi Neden Önemli?

Kullanıcılar arama kutusuna her zaman doğru yazım kullanmaz; bir harf eksikliği ya da klavye hatası, aslında stokta olan bir ürünü 'bulunamadı' sonucuna çevirebilir. Bu nedenle arama motorunuzun basit bir yazım düzeltme mantığı taşıması, boş sonuç sayısını azaltır.

Örneğin sistem girilen terime en yakın eşleşen ürünleri 'Şunu mu demek istediniz?' şeklinde önerebilir. Bu öneri kullanıcıya tek tıkla doğru sonuca ulaşma yolu açar ve aramayı yeniden yazma zahmetinden kurtarır.

Bu öneri mekanizması site arama altyapınızın bir parçasıdır; site içi arama kutusunun genel tasarımı ile birlikte ele alındığında daha tutarlı bir sonuç verir.

Basit bir benzerlik kontrolü eklemek bile fark oluşturur. Örneğin bir ya da iki harf farkını tolere eden bir mantık, çoğu yazım hatasını yakalar.

Sepet Boşken Hangi Mantığı İzlemelisiniz?

Sepet sayfası boşken yalnızca 'Sepetiniz boş' yazıp bırakmak, kullanıcıyı alışverişe devam etmeye davet eden bir fırsatı kaçırmaktır. Bu ekranda kullanıcıyı mağazaya geri yönlendiren açık bir bağlantı bulunmalıdır.

Ayrıca bu sayfada son görüntülenen ürünler ya da popüler kategoriler kavram düzeyinde önerilebilir; bu, kullanıcının alışverişe nereden başlayacağını bulmasını kolaylaştırır. Elbette bu önerilerin hangi oranda tıklanacağı siteden siteye değişir; burada kesin bir rakam vermeyiz.

Bu konuyu sepet terk oranıyla birlikte ele almak da faydalıdır. Sepet terk oranını düşürme yazımızda, kullanıcının sepete eklediği ama tamamlamadığı alışverişlere dair adımları ayrıntılı olarak paylaşıyoruz.

Bu ekranda ayrıca kullanıcıyı ürün kategorilerine ya da kampanya sayfasına yönlendiren kısa bir açıklama da ekleyebilirsiniz. Böylece sepet boş olsa bile kullanıcı alışverişe devam etme fikrini kaybetmez.

Bu mantığı uygularken sepet sayfasının yüklenme hızını da göz önünde bulundurmanız gerekir. Çünkü öneri bloğu ağır görsellerle doluysa, sayfa yavaşlar ve kullanıcı yine sayfadan çıkabilir.

Önerilen Ürün Gösterimi Dönüşümü Nasıl Etkiler?

Boş bir sepette önerilen ürünler göstermek kullanıcıyı sıfırdan arama yapma zahmetinden kurtarır ve alışverişe devam etme olasılığını artırabilir. Ancak bu etkiyi kesin bir rakamla iddia etmeyiz; her sitenin ziyaretçi davranışı farklıdır.

Bunun yerine bu değişikliği kendi sitenizde test etmenizi öneririz. Örneğin boş sepet sayfasına öneri bloğu ekledikten önce ve sonra dönüşüm oranınızı dönüşüm oranı hesaplama aracımızla karşılaştırabilirsiniz.

Böylece varsayımlara güvenmek yerine kendi verinize dayanan bir karar alırsınız. Bu yaklaşım, uydurma bir yüzde paylaşmaktan daha sağlam bir yoldur.

Bu testi yaparken tek bir değişkeni aynı anda değiştirmeniz, sonucu daha net okumanızı sağlar. Peki bu değişikliği bildirim kutusu gibi başka alanlara da uygulayabilir misiniz?

Elde ettiğiniz veriyi yalnızca sepet sayfasıyla sınırlı tutmamanız, genel bir öğrenme fırsatına dönüştürür. Örneğin hangi ürün önerilerinin daha çok tıklandığını görmeniz, diğer sayfalardaki öneri bloklarını da geliştirmenize yardımcı olur.

Bildirim Kutusu Boşken Ne Göstermelisiniz?

Bildirim ya da mesaj kutusu boşken sadece bir simge göstermek, kullanıcıya bu alanın ne işe yaradığını anlatmaz. Kısa bir açıklama bu alanda hangi tür bildirimlerin görüneceğini netleştirir.

Örneğin 'Henüz bildiriminiz yok; sipariş durumu ve kampanya güncellemeleri burada görünecek' şeklinde bir metin, kullanıcının bu alanı neden takip etmesi gerektiğini anlamasına yardımcı olur. Ayrıca kullanıcıyı bildirim ayarlarına yönlendiren bir bağlantı eklenebilir.

Bu tutarlılık sitenizin diğer bölümleriyle de uyumlu olmalıdır. Footer tasarımınızda yer alan destek bağlantılarıyla aynı dili kullanan bir bildirim kutusu, kullanıcıya bütünlük hissi verir.

Bu açıklama, kullanıcının bildirim özelliğini kapatıp kapatmayacağına karar vermesine de yardımcı olur. Çünkü ne göreceğini bilmeyen bir kullanıcı, genellikle özelliği tamamen görmezden gelir.

Favoriler Listesi Boşken Kullanıcıyı Nasıl Yönlendirmeli?

Favoriler listesi boşken kullanıcıya favori eklemenin ne işe yaradığını hatırlatmak gerekir; aksi halde bu özellik fark edilmeden kalabilir. Kısa bir açıklama ve kategorilere göz atma bağlantısı burada yeterlidir.

Örneğin 'Beğendiğiniz ürünleri favorilere ekleyin, buradan hızlıca erişin' şeklinde bir metin kullanıcıya özelliğin amacını anlatır. Böylece kullanıcı favori özelliğini keşfedip daha sık kullanabilir.

Bu ekranda abartılı bir illüstrasyon yerine sade bir yıldız ya da kalp ikonu genellikle yeterlidir. Çünkü amaç dikkat dağıtmak değil, işlevi netleştirmektir.

Bu ekranı tasarlarken favori listesini nasıl kullanabileceğine dair kısa bir ipucu eklemeniz de faydalıdır. Örneğin 'Favorilerinizi istediğiniz zaman karşılaştırabilirsiniz' gibi bir not, özelliğin değerini anlatır.

Bu ekranı oluştururken favori özelliğinin nerede bulunduğunu da hatırlatmanız faydalıdır. Örneğin ürün sayfasındaki kalp ikonuna kısa bir göz atma önerisi, kullanıcının özelliği yeniden keşfetmesini kolaylaştırır.

Filtreleme Sonucu Hiç Ürün Kalmadığında Ne Yapmalısınız?

Kullanıcı birden fazla filtre uyguladığında ve hiçbir ürün kalmadığında, ekranın yapması gereken ilk iş hangi filtrelerin sonucu sıfırladığını göstermektir. Bu, kullanıcının filtreleri tek tek kapatıp denemesine gerek kalmadan sorunu çözmesini sağlar.

Ayrıca bazı filtreleri tek tıkla kaldırma seçeneği eklemek kullanıcının tekrar baştan arama yapmasını önler. Ürün filtrelemenin satışları nasıl etkilediğini ele aldığımız yazımızda bu konuyu daha ayrıntılı işliyoruz.

Bu tür bir boş durum kullanıcıyı filtre öncesine döndürmek yerine, filtreyi hafifçe gevşeterek yoluna devam etmesini sağlar. Böylece arama süreci tamamen kesintiye uğramaz.

Bu yaklaşımı uygularken hangi filtrenin sonucu en çok etkilediğini küçük bir notla belirtmeniz de yardımcı olur. Böylece kullanıcı hangi seçimi gevşetmesi gerektiğini hızlıca görür.

Kullanıcıya filtreleri sıfırlayan tek bir buton sunmanız da pratik bir çözümdür. Böylece kullanıcı tek tıkla baştaki geniş sonuç listesine döner ve aramasına yeniden başlayabilir.

Hangi Sayfa Tipleri Boş Durum Tasarımına Öncelik Vermeli?

Her sayfa boş durum tasarımına aynı aciliyetle ihtiyaç duymaz; bazı sayfa tipleri bu konuda önceliklidir. Arama sonucu, filtreleme ekranı, bildirim kutusu ve favoriler listesi bu önceliğin en üst sırasında yer alır.

  • Arama sonucu sayfaları: ziyaretçinin siteyi terk etme riskinin en yüksek olduğu nokta.
  • Filtreleme ekranları: kullanıcının kendi seçimleriyle kendini çıkmaza soktuğu durum.
  • Bildirim ve mesaj kutuları: kullanıcı bağlılığını ve tekrar ziyareti etkileyen alan.
  • Favoriler ve istek listeleri: özelliğin keşfedilmesini sağlayan ilk temas noktası.

Bu dört sayfa tipi dışında kalan alanlar da boş durum tasarımından fayda sağlar; ancak kaynaklarınız sınırlıysa önceliği bu listeye vermeniz daha mantıklıdır.

Bu öncelik sırası, sitenizin türüne göre biraz değişebilir. Örneğin bir hizmet sitesinde bildirim kutusu daha az kritikken, bir e-ticaret sitesinde sepet ve filtre ekranları öne çıkar.

Boş Durum ile 404 Sayfası Arasındaki Fark Nedir?

Boş durum, sitenin çalışan bir sayfasında içerik bulunmaması durumunu ifade eder; 404 sayfası ise ziyaretçinin hiç var olmamış ya da sonradan silinen bir adrese ulaşmasını ifade eder. İkisi de yönlendirici olmalıdır ama tetikleyen durum farklıdır.

404 sayfasının nasıl tasarlanması gerektiğini ilgili yazımızda ayrıntılı olarak ele alıyoruz; orada da benzer bir mantık geçerlidir: durumu açıklayın ve bir sonraki adımı gösterin.

Bu yüzden iki durumu da aynı tasarım prensibiyle, yani açıklama ve yönlendirme ile ele almanız tutarlı bir kullanıcı deneyimi yaratır.

Bu ayrımı netleştirmek, geliştirme ekibinizle konuşurken de işinizi kolaylaştırır. Çünkü her iki durum da farklı bir teknik çözüm gerektirir.

Bu iki ekranı aynı ekip aynı anda tasarlarsa, sitenizin genel tonu daha tutarlı kalır. Çünkü aynı ton, kullanıcıya hangi sayfada olursa olsun aynı markayla konuştuğu hissini verir.

Boş Durum Tasarımı Kullanıcı Deneyimini Nasıl Etkiler?

Boş durum tasarımı kullanıcının siteyle etkileşiminin kesintiye uğradığı anlarda devreye girer ve bu anların kullanıcı deneyimine olan etkisini doğrudan belirler. İyi kurduğunuz bir boş durum, kesintiyi fark edilmeyecek kadar küçültür.

Nielsen Norman Group'un belirttiği gibi, bu tasarım sistemin öğrenilebilirliğini artırır ve kullanıcının temel görevleri hızlıca tamamlamasına yardımcı olur. Dolayısıyla boş durum yalnızca estetik bir detay değil, kullanılabilirliğin bir parçasıdır.

Bu etkiyi doğrudan bir sıralama faktörü olarak sunmayız; ancak kullanıcının sitede daha uzun kalması ve geri dönmemesi, dolaylı olarak kullanıcı deneyimi sinyallerine katkı sağlar.

Bu nedenle boş durum tasarımını sitenizin diğer kullanılabilirlik çalışmalarıyla birlikte planlamanız tutarlı bir sonuç verir. Örneğin bir kullanılabilirlik denetimi yaparken boş ekranları da listeye eklemeniz iyi bir başlangıçtır.

Bu konuda uzun vadeli bir bakış açısı taşımanız önemlidir; boş durum tasarımı tek seferlik bir proje değil, sitenizin büyümesiyle birlikte güncellenen bir çalışmadır. Yeni bir özellik eklediğinizde, o özelliğin boş durumunu da aynı titizlikle tasarlamanız gerekir ve bu alışkanlığı tasarım sürecinizin kalıcı bir adımı haline getirmeniz gerekir.

Sık Yapılan Boş Durum Tasarım Hataları Nelerdir?

Bu alanda en sık görülen hata, ekranı tamamen boş bırakmak ya da yalnızca teknik bir hata kodu göstermektir. İkinci sık hata, bağlantı veya buton eklemeden sadece açıklayıcı bir metinle yetinmektir.

  • Ekranı tamamen boş bırakmak: kullanıcıya sistemin çalışıp çalışmadığını belli etmemek.
  • Yalnızca teknik hata kodu göstermek: kullanıcıya bir sonraki adımı söylememek.
  • Abartılı illüstrasyon kullanmak: markadan uzak, yükleme süresini uzatan görseller eklemek.
  • Yanlış zamanlı mesaj göstermek: içerik hâlâ yüklenirken 'sonuç yok' yazmak.

Bu son hata özellikle önemlidir. Nielsen Norman Group, içerik hâlâ işlenirken erken gösterilen bir 'kayıt yok' mesajının kullanıcı güvenini özellikle zayıflattığını belirtir; bu yüzden mesajı göstermeden önce yükleme durumunun bittiğinden emin olmanız gerekir.

Bu hatalardan kaçınmak için sitenizdeki her boş ekranı tek tek gözden geçirmeniz gerekir. Çünkü bir sayfada doğru uygulanan mantık, başka bir sayfada gözden kaçmış olabilir.

Boş Bırakılan Ekran ile Tasarladığınız Boş Durum Karşılaştırması

Aşağıdaki tablo, ekranı boş bırakmanın ve onu bilinçli olarak tasarlamanın temel farklarını özetler.

Ekran türüBoş bırakılan ekranTasarlanan boş durum
Arama sonucuYalnızca "0 sonuç" yazarYazım önerisi ve popüler kategoriler sunar
Sepet"Sepetiniz boş" yazıp bırakırMağazaya dönüş bağlantısı ve öneri sunar
Bildirim kutusuBoş simge gösterirBildirim türlerini açıklar, ayarlara yönlendirir
FavorilerBoş liste simgesi gösterirÖzelliğin amacını açıklar, kategoriye yönlendirir
Filtre sonucu"Ürün bulunamadı" yazarHangi filtrenin sonucu sıfırladığını gösterir

Tablodaki fark çoğunlukla birkaç satır metin ve bir bağlantıdan ibarettir; bu da boş durum tasarımının büyük bir geliştirme yükü gerektirmediğini gösterir. Üstelik bu küçük müdahaleler sitenizin genel tutarlılığını da güçlendirir.

Bu karşılaştırmayı kendi sitenize uygularken, önce en çok ziyaret edilen boş ekranları önceliklendirmeniz pratik bir başlangıç noktasıdır.

Bu tabloyu ekibinizle düzenli olarak paylaşmanız, tasarım ve geliştirme ekipleri arasındaki beklentileri de daha baştan netleştirir. Her iki taraf da hangi ekranın hangi bileşeni içermesi gerektiğini aynı kaynaktan okur ve tartışmaya daha az zaman harcar.

Boş Durum Tasarımı İçin Hazırlık Adımları Nelerdir?

Boş durum tasarımına başlarken önce sitenizdeki hangi ekranların boş kalabileceğini listelersiniz. Ardından her biri için durumu açıklayan bir metin, bir yönlendirme ve sade bir görsel belirlersiniz.

  1. Sitenizdeki arama, sepet, bildirim, favoriler ve filtre ekranlarını tek tek listeleyin.
  2. Her ekran için durumu açıklayan kısa ve dürüst bir metin yazın.
  3. Kullanıcıyı bir sonraki adıma taşıyan bağlantı veya buton ekleyin.
  4. Markanıza uygun, sade bir görsel veya ikon seçin.
  5. İçerik yüklenirken erken mesaj göstermediğinizden emin olun.

Bu adımları kendi başınıza uygulayabilir ya da sitenizin tasarımını bir bütün olarak gözden geçirmek isterseniz web tasarım hizmetimizden destek alabilirsiniz. Biz bu süreçte boş durumları da genel tasarım sisteminin bir parçası olarak ele alıyoruz.

Sonuç olarak boş durum tasarımı küçük ama etkisi kümülatif olan bir detaydır. Bu detayı ihmal etmek yerine, az sayıda ekranla başlayıp zamanla tüm siteye yaymanız yeterlidir.

Bu listeyi uyguladıktan sonra sonuçları belirli aralıklarla tekrar gözden geçirmeniz, tasarımın güncel kalmasını sağlar. Böylece siteniz büyüdükçe yeni boş ekranlar da aynı mantıkla ele alınır.

Bu çalışmayı tek seferde bitirmek zorunda değilsiniz; önce en çok ziyaret edilen iki ya da üç ekrandan başlayıp sonucu gözlemleyebilirsiniz. Ardından aynı mantığı sitenizin kalan bölümlerine de kademeli olarak, adım adım yayabilirsiniz ve her adımda kullanıcı tepkisini not alabilirsiniz.

Sıkça Sorulan Sorular

Boş durum tasarımı dönüşüm oranını kesin olarak yükseltir mi?
Hayır, kesin bir garanti vermeyiz. Boş durum tasarımı kullanıcıya bir sonraki adımı gösterdiği için siteden ayrılma olasılığını azaltan bir fırsat sunar. Ancak gerçek etki siteden siteye değişir; bu yüzden değişikliği kendi sitenizde dönüşüm oranı hesaplama aracıyla karşılaştırarak gözlemlemeniz en sağlam yoldur, uydurma bir yüzde paylaşmayız ve her site kendi verisine göre karar almalıdır.
Arama sonucu bulunamadı ekranında ne yazılmalı?
Durumu açıkça anlatan kısa bir cümle yazmanız yeterlidir; örneğin aradığınız terimle eşleşen ürün bulunamadığını belirtip, yazım hatası olasılığını veya popüler kategorileri önerebilirsiniz. Genel bir hata kodu yerine kullanıcıyı bir sonraki adıma yönlendiren somut bir öneri eklemeniz, ekranın fırsata dönüşmesini sağlar ve ziyaretçiyi sitede tutar.
E-ticaret sitesinde sepet boşken ürün önermek doğru mu?
Evet, kavram düzeyinde doğru bir yaklaşımdır; boş sepet sayfasında son görüntülenen ya da popüler ürünleri göstermek kullanıcıyı mağazaya geri yönlendirir. Ancak bu önerinin kesin bir dönüşüm artışı sağlayacağını iddia etmeyiz; etkisini kendi site verinizle test etmeniz, sağlıklı bir karar vermenizi kolaylaştırır.
Bildirim kutusu boşken kullanıcıya ne gösterilmeli?
Bu alanda hangi tür bildirimlerin göründüğünü açıklayan kısa bir metin yeterlidir; örneğin sipariş durumu veya kampanya güncellemelerinin burada çıkacağını belirtebilirsiniz. Kullanıcıyı bildirim ayarlarına yönlendiren bir bağlantı eklemek, özelliğin keşfedilmesini de kolaylaştırır ve kullanıcı bağlılığını güçlendirir. Ayrıca bu metni sitenizin genel tonuyla uyumlu tutmanız, kullanıcıya bütünlük hissi verir.
Boş durum tasarımı kullanıcı deneyimini nasıl etkiler?
Bu tasarım, kullanıcının siteyle etkileşiminin kesintiye uğradığı anları yönlendirici bir ana çevirir ve sistemin öğrenilebilirliğini artırır. Dolayısıyla kullanıcı hem durumu anlar hem de bir sonraki adımı bulur; bu da sitede kalma süresini ve tekrar ziyareti dolaylı olarak destekler. Bu nedenle boş durum tasarımını genel kullanılabilirlik çalışmalarınızın doğal bir parçası olarak ele almanız tutarlı bir sonuç verir.
Boş durum ile 404 sayfası aynı şey mi?
Hayır, aynı şey değildir. Boş durum, sitenin çalışan bir sayfasında içerik bulunmaması durumunu ifade ederken, 404 sayfası ziyaretçinin hiç var olmamış ya da sonradan silinen bir adrese ulaşmasını ifade eder. İkisi de açıklama ve yönlendirme içermelidir ama tetikleyen durum farklıdır ve çözümü de farklı kurulur.
  • boş durum tasarımı
  • empty state
  • ux tasarımı
  • web tasarım
  • e-ticaret ux
  • kullanıcı deneyimi
Paylaş:
Talha Aslan

Google Partner dijital pazarlama uzmanı. 2012’den beri SEO, Google Ads, web tasarım ve e-ticaret projelerinde sahada; bu blogda gördüğünüz her yazı o deneyimden çıkar.

Sıradaki proje

Projeniz için teklif alın.

Talebiniz doğrudan Talha Aslan ve ekibine ulaşır: stratejiyi Talha kurar, uygulamayı deneyimli ekip yürütür. Aynı gün dönüş yapar, kapsamı, takvimi ve tutarı yazılı teklifle 1 iş günü içinde göndeririz.