Gezinme menünüz, web sitenizin UX'sini yapar ya da koparır; bu, öncelikle her zaman için tasarlamanız gereken şeydir. Müşterilerinize bir tasarımcı olarak sunabileceğiniz daha iyi bir hizmet yoktur, onlar için oluşturduğunuz sitelerin çarpıcı ve son derece işlevsel bir kullanıcı deneyimi olmasını sağlar.

Muhteşem bir UX, müşterilerinizin sitelerinin daha fazla müşteri adayı, ziyaretçi ve okuyucu aldığını garanti eder. Bir site oluşturmanın en önemli kısmıdır ve sitenizin gezinme menüsünü nasıl tasarladığınıza bağlı olarak üzerinde büyük bir kontrole sahip olursunuz.

Ne yazık ki, tüm tasarımcılar müşterilere ve ziyaretçilere zarar veren mükemmel navigasyon için tasarım konusunda yüksek bir öneme sahip değildir.

Tasarımcı olarak çok itibarlı bir üne sahip olmak için - ve talep sahibi bir tasarımcı olmak için - web tasarımının en temel yönlerinden birine hakim olmanız gerekir. Müşterilerinizin siteleri için harika bir navigasyon yaratıyor.

İşte nasıl.

Yapışkan navigasyon

Yapışkan navigasyon Kullanıcıların menüye anında erişmesini ve sitenizde ne istediklerini kolayca bulmasını sağladığından, gezinmenin önemli bir bileşenidir. Kullanıcılar bir sayfayı aşağı kaydırdıkça, yapışkan gezinme yerinde kalır. Özellikle uzun süren sayfalar söz konusu olduğunda, sitenin başka bir sayfasına gitmek için tekrar yukarı kaydırmak zorunda kalmamaktan daha fazla rahatsız edici bir şey yoktur.

Web'de, hızın her şeyin (sayfaların yüklenmesi, istenen içeriğin bulunması, vb.) Olması, kullanıcıların navigasyon menüsüne daha hızlı bir şekilde erişebilmelerini sağlamak için en iyi uygulama olduğunu unutmayın.

Yapışkan bir gezinme çubuğu ekleyerek, navigasyon seçeneklerini sürekli olarak önlerine koyarak, kullanıcılarınızdaki bilişsel yükü azaltmaya da yardımcı oluyorsunuz.

Alternatif Pres Yapışkan gezinmeyi sayfalarınıza nasıl dahil edeceğinize iyi bir örnek. Sayfada ne kadar ilerlediğinize bakılmaksızın, gezinme çubuğunda, en önemli bölümlerin etkili renk kontrastı ile kolayca erişilebilir ve tanımlanabilir olduğunu unutmayın.

Alternatif-Basın-Screen-Shot

Açık hipermetin

Hypertext, sayfalarınızda, kullanıcıların aynı sitede veya site dışında olsun, genellikle başka bir sayfada ek bilgi almak için tıklayabilecekleri herhangi bir metin referansıdır. Köprüler, muhtemelen en belirgin hipermetin örneğidir.

Hiper metin, daha fazla bilgi sağlayarak kullanıcı deneyimine yardımcı olacak bilgiler içerdiğinden, yalnızca bu yararlı referansların çok dikkat çekici hale getirilmesinin gerekçesidir. Genel olarak, bu, oluşturduğunuz sitenin gezinebilirliğine katkıda bulunur.

İki, basit, tasarım özellikleriyle hipermetin belirginleştirilmesini öneririm:

  • Alt çizgili
  • Rengi değiştirme

Sayfa içeriğinizdeki herhangi bir kelimeyi vurguladığınızda, bunun müşterinizle ilgili sayfasının bir köprüsünün olduğunu söyleyin. Bu, site ziyaretçilerinin dikkatini çeker ve bu da önemli bilgilere kolayca ulaşmalarına yardımcı olur.

Benzer şekilde, köprünün rengini sayfalarınızın metninden ve arka planından farklı yaptığınızda, tekrar sayfanın üzerinde durmasını sağlayın, böylece kullanıcılar kolayca tanımlayabilir ve tıklayabilir.

Pazarlama sitesi Günlük Yumurta Hiper metin için hem alt çizgi hem de farklı renkler kullanır ve kullanıcıların bağlantıları tanımlamasını çok kolaylaştırır.

-Günlük-Yumurta-Screen-Shot

Mega menüler

Mega menüler Özellikle müşteriniz için tasarladığınız sitenin çok sayıda içerik ve kategori içeriyorsa, gezinme için harika bir fikirdir. e-Ticaret mağazaları akla geliyor. Bunlar, kullanıcılarınızın özel olarak istedikleri şeyi daha hızlı bulmasına yardımcı olmak için ek gezinme katmanlarını açan büyük, açılır panellerdir.

Bu tür menüler, aşağıdaki gibi faydaları dahil ederek kullanıcı deneyimini geliştirir:

  • kaydırmanın ortadan kaldırılması;
  • ipuçları;
  • İçeriğin simgeler, düzen veya tipografi ile düzenli olarak yapılandırılması.

Tüm bu özellikler, navigasyon menüsünü kullanmanın çok daha kolay olduğunu söyledi.

Mega menüden sağlam bir örnek için Gıda ağı Sitesi. Açılış menüsünün sitenin en çok aranan içerik parçalarından birini (tarifler), kullanıcıların daha fazla seçenek için kaydırma veya sayfalandırma yerine gitmek istedikleri yeri seçebilmelerini sağlayan kolay görülebilen bir biçimde görüntülediğine dikkat edin.

Gıda-Ağ-Screen-Shot

Desen ve dil ilişkileri

Kalıp kalıcılığı, site ziyaretçilerinin çoğunluğunun sitenizin ana sayfasını temsil etmek için bir ev simgesi gibi anında anlayacağı geleneksel bir sembol kullanıyor. Bir dilin karşılanması, “ana sayfa” gibi bir kelimenin açık bir şekilde kullanılmasıdır, bu sekmeye tıklamak, kullanıcıları sitenin ana sayfasına getirecektir.

Uygunluklar, kullanıcılara tasarımınızdaki öğelerle nasıl etkileşimde bulunabileceklerini anlatır. Bu kesinlikle Tasarım Temelleri 101 olmakla birlikte, bugün Internet'in ilk günlerinde olduğu gibi bugün de pratik yapmak kadar önemlidir.

Fonksiyonel navigasyon menüsü, ev sembolüne veya soldaki ilk navigasyon sekmesine konumlandırılan “home” kelimesine sahip olmalıdır. Bazı tasarımcılar bunun yerine “home” simgesi veya düğmesi olarak bir şirket logosunu dahil etmeyi tercih edebilir, ancak bu kullanıcı hatası için hala çok fazla yer bırakır.

eTailer Çerçeve depo bu tasarım prensibini “ev” kullanımıyla birlikte bir sekmeye kadar gösterir.

Çerçeve-Depo-Screen-Shot

Hızlı yükleme süresi

Hız = harika kullanıcı deneyimi. Tüm çizgilerin tasarımcıları, bunu yapamayacakları ve reddetmemeleri gereken en önemli tasarım kurallarından biri olarak düşünmelidir. Wired Magazine'e göre Alışveriş yapanların neredeyse% 50'si, ortalama sayfanın iki saniye veya daha kısa sürede yüklenmesini istiyor! Başka bir deyişle, müşterileriniz için tasarladığınız sayfaların yüklenmesi iki saniyeden uzun sürüyorsa, müşterilerinizin sitelerini bırakacakları ve asla geri dönmeyecekleri ve böylece ciddi dönüşüm kabuslarına yol açabilecekleri için çok iyi bir şansınız olur.

Bu emin olmak için endişe verici bir istatistik, ancak tasarımcıların müşterilerine yüksek kaliteli sayfa performansı sağladıklarından emin olmak için bu konuda yapabileceği bir şey var. Sadece tasarladığınız sayfaların sayfa hızını test edin. Sayfa yükleme sürelerini belirlemenize yardımcı olacak birçok güvenilir araç vardır:

Çok hızlı bir sayfa yükleme süresine örnek olarak Enchanted Learning’ın Balina Nedir? sayfa. Tasarım, bazı çalışmaları kullanabilir, ancak Alexa Analytics araç çubuğuna göre sayfa bir saniyeden daha uzun bir sürede yüklenir.

Büyülü-Öğrenme-Screen-Shot

Harika navigasyon harika UX

Harika bir kullanıcı deneyiminin büyük bir kısmı sitenizin navigasyonudur. Gerçekten düşündüğünüzde, tüm kullanıcı deneyiminin üzerinde durduğu temeldir. Kullanıcılarınız, müşterinizin bulunduğu sitenin etrafındaki yerlerini kolaylıkla bulamıyorsa, o zaman onlar için can sıkıcı olur ve onlara acele etmelerine neden olur. Böylece, mükemmel navigasyon, insanların oluşturduğunuz herhangi bir siteyi kullanmasını kolaylaştırmalıdır; Bu, iyi bir kullanıcı deneyiminin ölçütüdür.

Gezinme aşamasına tasarım aşamasında kısa bir mesafe katmak cazip gelse de - her zaman ortaya çıkan yeni tasarım eğilimleri nedeniyle - bu tavsiye edilmez. Kullanıcılarınız, müşterileriniz gibi fark edeceklerdir. Müşterilerinizi memnun etmek için, kullanıcılarını memnun etmelisiniz. Bunu yalnızca, harika bir kullanıcı deneyimi için ilk ve en önemli şekilde tasarlarken yapabilirsiniz;