Kazanan Bir Gezinme Menüsü Tasarlama Fikirler ve İlhamlar
Bir web sitesindeki gezinti menüsü, bir caddede yol işareti veya bir alışveriş merkezinde bir seviye dizini gibidir. İlk önce nerede olduğunuzu bilmeden hedefinize ulaşamazsınız.. Gerçek hayatta olduğu gibi, web tasarımında gezinti çok önemlidir ve bir web sitesinin kullanılabilirliğinin yanı sıra kullanıcı deneyiminde de büyük rol oynar.
Günümüzde ilginç, yaratıcı ve sıradışı tasarımlara sahip birçok farklı navigasyon menüsü görebilirsiniz. Ancak bir web sitesinde etkili gezinmeye ne dersiniz, nasıl görünürdü; nasıl görünmeli?
Bugün navigasyonun web tasarımındaki önemi hakkındaki gözlem ve bilgilerimi paylaşmak istiyorum. Web sitenizin gezinmesini ve kullanılabilirliğini geliştirmek için kullanabileceğiniz birkaç basit ipucunu açıklayacağım. Ayrıca, bir sonraki tasarımınızı nasıl planlayacağınız konusunda fikir vermek için etkili navigasyon menülerinden örnekler de verilecek..
Bilgi Mimarisi
Gezinme planlaması bilgi mimarisi ile başlamalıdır. Oturmak çok önemlidir ve bir web sitesinin bilgi mimarisi hakkında beyin fırtınası. Web sitesinin ne tür özellikler sunduğunu, neyin en önemli olduğunu ve bilgi hiyerarşisinde daha düşük seviyelere ne yerleştirilebileceğini bulmak zorundasınız..
Bilgi mimarisi içerir özellikler, kullanıcı ihtiyaçları, site haritası, test ve tel kafesler. Bilgi mimarisi hakkında daha fazla bilgiyi Cameron Chapman'ın Bilgi Mimarisi 101: Teknikler ve En İyi Uygulamalar bölümünden okuyabilirsiniz..
Kullanıcının kullandığı teknolojileri kullanma
Gezinme çubuğunuzun oluşturulmasında Flash, JavaScript, jQuery veya web sitenizin gezinmesini engelleme riski taşıyan herhangi bir şey kullanmaktan kaçının veya en azından incelikle bozabileceklerinden emin olun.
Hakkında daha fazla referans için javascript’in zarif bozulması, Bu yazı 10 CSS ve Javascript için Faydalı Fallback Yöntemleri göz atın.
Basit, Kullanıcı dostu terimler kullanın
Kullanmak daha iyidir basit, anlaşılır ve anlaşılması kolay terimler navigasyon menünüzün sadece endüstri şartlarına uymamak için. Kullanıcıları bir ya da iki saniyeden daha uzun süren bağlantıların kullanılması muhtemelen uygun değildir..
Bir kullanıcının, bağlantının neye yol açtığını bulmak için bir bağlantıyı tıklaması gerekirse, bu, ziyaretçileriniz için kötü bir kullanıcı deneyimine katkıda bulunacaktır..
Örnekler
Larissa Ness'in web sitesinin gezinti menüsündeki terimlerin anlaşılması ve yeterince yaygın olması kolaydır. Kullanıcılar kafa karıştırıcı bulmazlar çünkü zaten böyle menülerle deneyimleri vardır.
İşte csupport'ta sık kullanılan terimleri içeren temiz ve anlaşılır bir web sitesi gezinme menüsünün bir başka güzel örneği..
Yaratıcı ajans Eighty8Four, ziyaretçiler için kafa karıştırıcı olabilecek "showroom" terimini kullanıyor. Bu terim, portföy veya iş anlamına gelebilir ancak net değildir ve ziyaretçilerin kontrol etmek için tıklamaktan başka seçeneği yoktur.
Navigasyon tasarımını standartlaştırın
Aynı navigasyon modelini kullanın tüm sayfalarınızda. Çok önemlidir, çünkü tutarlı bir tasarım olmadan, bir kullanıcı aslında başka bir web sitesinde olduğunu düşünebilir. Aynı gezinti modelini kullandığınızdan emin olun, böylece kullanıcılar web sitenizi kaybolmadan kolayca dolaşabilirler.
Bluegg, Aşağıda gösterilen, tüm alt sayfalarda aynı kalan basit ve temiz bir gezinme tasarımı kullanır. Tek fark, ziyaretçinin o anda bulunduğu sayfayı gösteren renk göstergesidir..
Nerede olduğunu belirtin
Kullanıcının her zaman nerede olduğunu bilmesi çok önemlidir. Bunu yapabilirsin bağlantının arka planını, sayfa adının rengini değiştirme veya metni kalınlaştır navigasyon menüsünde diğerlerinden farklı kılmak için.
Austin Eastciders Kullanıcının açık olduğu sayfayı belirtmek için farklı bir renk ve arka plan kullanır. Bu gösterge aynı zamanda ince bir tasarım değişikliği olarak da çalışabilir. farklı gezinme arka planı Diğer menü öğelerinin derin olduğu hissi yaratır.
Medya Cerrahisi açılan bir alt sayfa için gösterge olarak daha koyu bir renk kullanır. Basit ama etkili.
Web sözleşmelerini kullanın
Her şey kullanımı kolay ve sezgisel web sitesinde gezinme ile ilgilidir. Web kuralları, tasarımcıların tasarımları etrafında çalışmasını kolaylaştırır. Çoğu kullanıcı, ana sayfaya geri dönmek için web sitesi logosuna tıklar, böylece logonuzu tasarlarsınız..
Eğer yapmazsan, yeni bir şeyler öğrenmek için zamanlarını harcıyorsun veya bazı durumlarda, genellikle gezinti normları olarak kabul edilmesini beklediklerini sağlamayarak onları rahatsız eder.
Burada web kuralları hakkında daha fazla bilgi edinebilirsiniz:
- 10 Web Tasarım Kuralları
- Web Tasarım Çarkını Yeniden Keşfedin
- Web Sözleşmeli Tasarım
Enjekte Tasarım logoyu bugün en çok kullanılan web anlaşmalarından birine uyan sol üst köşeye yerleştirir.
Adams Yaratılış en yaygın web anlaşmalarından birini kullanır - logo web sitesinin sol üst köşesine yerleştirilir ve ana sayfaya bağlanır..
Test et: 3. bir partiyi dahil et
Navigasyon tasarımınızı her zaman İnternet'i daha önce kullanan kişilerle test edin. Test etmek için tasarım süreci ile ilgili olmayan insanları getirmek isteyebilirsiniz.. Gezinirken tercihlerini gözlemleyin siteniz aracılığıyla ve aradıkları sayfaları bulmalarının ne kadar zaman aldığını analiz edin..
Daha iyi doğruluk için, daha fazla insanı dahil et, verileri topla, analiz et ve özetle daha iyi bir uyum için. Gerekirse bir test sonrası anket yapın. Bu test çalıştırması olmadan başka türlü algılanamayacak bazı beklenmeyen fikirler ve girdiler alabilirsiniz..
Bağlamı sağlamak
İçeriğiniz ve navigasyonunuzla tutarlı olmak, web sitesi kullanıcılarının ihtiyaç duydukları şeyleri hızlı bir şekilde bulmalarına yönelik bir bağlam sağlar. Sayfanın ne hakkında olduğuna genel bir bakış vermek için linklediğiniz içerikle ilgili küçük simgeler veya kısa açıklamalar ekleyebilirsiniz..
Kendi bisikletim Kullanıcılara belirli alt sayfalarda bulabilecekleri bilgiler hakkında daha fazla bilgi vermek için basit simgeler kullanır.
Sarah Parmenter Ana navigasyonun bağlantı verdiği alt sayfalar hakkında bazı bilgiler sağlamak için ana navigasyon altındaki kısa ve hoş başlıkları kullanır..
SEO amaçlı
Google tutarlı gezinmeyi sever. Yalnızca kullanıcıların web sitenizde nasıl gezineceklerini anlamaları ve fikirlerini almaları için değil aynı zamanda arama motorlarının web sitenizi dizine eklemesini sağlamak için tutarlı bir navigasyona sahip olmak iyidir..
Arama motoru robotları, web sitenizi dizine eklemek ve bağlantıları arama motoru sonuç sayfasına koymak için web sitenizi tarar. Görünür olmak istiyorsanız, iyi navigasyon tasarımına dikkat edin ve daha fazla trafik alın.
Ücretsiz gezinme komut dosyaları (CSS ve jQuery)
Projeleriniz için yararlı bulabileceğiniz en son navigasyon menülerinin kısa bir listesi. Bu komut dosyaları, bazı güzel özellikler ekleyerek ve onu kullanmaktan zevk alarak ürününüzün kullanıcı deneyimini daha da iyi hale getirir.
HTML ve jQuery kullanarak XML odaklı Dikey Haber Kaydı Komut Dosyası: vScroller
Filtrify
Sayfa Kaydırıcı
Zaman Çizelgesi Portföyü
HorizontalNav
CSS3 Minimalist Gezinme Menüsü
CSS3 ile Çember Gezinme Etkisi
JQuery ile Grid Navigasyon Etkileri
Ascensor
Zarif bir CSS3 Navigasyon Menüsü Oluşturun
Güzel yatay gezinme vitrin
Ve son fakat en az bazı ilham verici yatay navigasyon menüleri. Projeleriniz için yeni fikirler bulmak için bu şaşırtıcı web sitelerini ve gezinme menüsü çözümlerini kontrol edin..
Ch3mical
Bloom Arama Pazarlama A.Ş..
Alex Perez
Libor Zezulka
Hauska!
Altın Adalar
Neil Carpenter
Marc Thomas
3B Polistirenler
Liechtenecker
Macera Dünyası
Kocayemiş fotoğrafçılığı
OMDRL
4 Pines Bira
Avcılar Şarapları
Umarım bu makaleyi yararlı ve bilgilendirici bulacaksınız. Herhangi bir düşünceniz varsa veya katılmıyorsanız, lütfen yorumlar bölümünde görüşünüzü paylaşın.
