W artykule:
Użyteczność witryny powinna być jednym z najważniejszych czynników podczas budowania lub utrzymywania witryny. Jeśli Twoja strona jest trudna w użyciu, ludzie będą zniechęcani do korzystania z niej—lub do powrotu. Ponadto w wielu przypadkach dobra użyteczność przekłada się bezpośrednio na lepsze wyniki, jeśli chodzi o SEO.
Niektóre z cech dobrej użyteczności witryny to:
- Responsywność mobilna: Coraz więcej osób korzysta z Internetu za pośrednictwem telefonów komórkowych (a Google dekretuje to jako ważne dla rankingu w wyszukiwarce w ramach inicjatywy mobile-first).
- Prędkość ładowania strony: Kolejny ważny sygnał rankingowy od Google, dzięki korelacji z tym, jak ludzie wchodzą w interakcję ze stronami internetowymi. Według Kissmetrics, 47% konsumentów oczekuje, że strona internetowa załaduje się w ciągu 2 sekund lub mniej!
- Nawigacja strony: Według Orbit Media Studios, jeśli Twoja strona jest łatwa w użyciu, a treść łatwa do znalezienia, pozytywnie wpływa to na ruch w witrynie z wyszukiwarek. Gerry McGovern przeprowadził badanie, w którym Wyniki wykazały, że 70% osób polegało na nawigacji, a nie wyszukiwaniu, ponieważ łatwiej i szybciej można klikać linki do określonych stron w witrynie.
Na potrzeby tego artykułu skupimy się na użyteczności w zakresie projektowania menu witryny, najlepszych praktyk i inspiracji do projektowania menu.
Nawigacja Strony
Nawigacja w sieci jest ogólnym terminem odnoszącym się do wewnętrznej architektury linków witryny. Przede wszystkim jego głównym celem jest pomoc użytkownikom w łatwym znalezieniu odpowiednich treści w Twojej witrynie. Struktura nawigacyjna stanowi również podstawę mapy witryny, która pomaga Gigantom wyszukiwarek, takim jak Google, odpowiednio indeksować witrynę.
Z pewnością istnieje kilka aspektów, które składają się na skuteczną nawigację w witrynie, ale na razie skupimy się szczególnie na menu ponieważ jest to zwykle element pierwszej strony, z którym użytkownicy wchodzą w interakcję, gdy lądują na nowej stronie internetowej.
Nawigacja Menu
Menu nawigacyjne zazwyczaj znajdują się z przodu i na środku strony internetowej (w przenośni—wyśrodkowane menu byłoby interesujące). W przypadku witryn z różnymi kategoriami funkcja rozwijana jest opcją oszczędzania miejsca i zaspokajania potrzeby kategoryzacji.
W dzisiejszych czasach, w pokazie minimalizmu (i mobilnej użyteczności), wiele stron internetowych przyjęło projekt menu hamburgera (zasadniczo, kwadrat z trzema krótkimi poziomymi liniami, wskazując, że menu, które można rozwinąć za pomocą kliknięcia).
Motyw witryny sklepowej Woocommerce stanowi przydatny przykład w prawym górnym rogu:
Źródło Obrazu
Projektowanie menu witryny Hamburger jest najbardziej rozpowszechnione, jeśli chodzi o projektowanie stron mobilnych, ponieważ programiści mają za zadanie tworzenie użytecznej nawigacji w bardzo małych przestrzeniach. Z pewnością stworzenie użytecznego menu rozwijanego na stronach mobilnych może być trudne!
Wszystko to powiedział, wielu projektantów gardzić menu hamburgerowe, które doprowadziło do nowego ruchu w poszukiwaniu kreatywnych sposobów, aby nawigacja po witrynie była przyjemna i funkcjonalna. Mając to na uwadze, wspólny heurystyczny projekt menu strony internetowej obejmuje umieszczenie nawigacji menu jako stałego elementu u góry każdej strony internetowej, dzięki czemu użytkownik może łatwo znaleźć drogę powrotną „do domu” lub odszukać następną stronę, którą jest zainteresowany.
Najlepsze praktyki w projektowaniu menu strony internetowej Nawigacja
Większość motywów WordPress ma wstępnie zdefiniowany projekt menu witryny. Niezależnie od tego, czy chcesz uzasadnić zachowanie go takim, jakim jest, czy też planujesz całkowicie go przerobić, Oto najlepsze praktyki projektowania nawigacji po menu z myślą o użyteczności i SEO:
- Jeśli to możliwe, unikaj rozwijanych menu. Wiele stron internetowych korzysta z rozwijanych menu, ponieważ oszczędzają miejsce, ale nie są zalecane, zwłaszcza jeśli chodzi o techniczne SEO. Testy użyteczności z Grupy NN wykazały, że większość ludzi nie lubi rozwijanych menu. Dzieje się tak dlatego, że ludzkie oko działa szybciej niż ręka, więc ludzie uważają to za denerwujące, gdy już zdecydowali, na co kliknąć, A coś innego spada—co prowadzi do zmniejszenia odwiedzin na niektórych stronach. Wszystko to powiedziawszy, menu „mega rozwijane” jest nieco bardziej akceptowalne, jeśli strona, którą projektujesz, ma tak dużo treści, że nie możesz obejść się bez rozwijanego menu.
- Bądź opisowy. Pozbądź się ogólnych słów, takich jak „usługi” lub „produkty”. Zamiast tego określ, jakie są Twoje produkty lub usługi are, ponieważ nikt tak naprawdę nie szuka ogólnych słów „produkty” lub „usługi”. Jeszcze lepiej, przed podjęciem decyzji o dokładnych nazwach pozycji menu, uzasadnij inkluzje badaniem słów kluczowych SEO. Orbit Media poleca używanie etykiet opisowych, ponieważ ta praktyka przynosi korzyści zarówno użytkownikom, jak i tobie, gdy Wyszukiwarki indeksują witrynę. Nawigacja pojawia się na każdej stronie, więc jeśli używasz terminu związanego z Twoją branżą, ostrzegasz Google, że naprawdę zależy ci na tym temacie. Nie zapominaj, że każda pojedyncza strona może być pozycjonowana tak długo, jak jest skupiona na jednym, konkretnym temacie.
- Dodatkowo Orbit Media odradza nawigacja oparta na formacie, jak układanie stron według treści-takich jak wszystkie filmy, wszystkie infografiki i tak dalej. Dzieje się tak dlatego, że ludzie szukają według tematu, a nie formatu.
- Znaczenie ma pozycjonowanie (lub rozmieszczenie) pozycji w menu nawigacyjnym. Istnieje ogólna sugerowana lista stron, które należy mieć w witrynie, takich jak Strona „o stronie”, Strona „Kontakt” itp.—są to strony najczęściej wyszukiwane przez odwiedzających witrynę. Te widoczne strony, które często mają duży ruch (ponieważ są wyświetlane w widocznym miejscu), często mają niski współczynnik zaangażowania. Użyj Google Analytics, aby określić najważniejsze strony i znaleźć możliwości optymalizacji. Wyświetl najważniejsze elementy nawigacji są pierwsze (lub na górze, w zależności od orientacji paska menu).
- Zachowaj pozycje menu do maksymalnie 7. Badania wykazały, że ludzie mogą zapamiętać lub przyjąć maksymalnie siedem informacji naraz. Posiadanie zbyt wielu kategorii pozycji menu może potencjalnie wpłynąć na Twoją zdolność do pozycjonowania w wyszukiwarce, ponieważ Google może interpretować zbyt wiele pozornie niepowiązanych kategorii jako znak, że Twoja witryna nie osiedliła się w określonej niszy. Jeśli wiesz, że będziesz potrzebować więcej niż 7 pozycji menu, Podziel je dalej na podkategorie.
Jeśli chodzi o wspomniany punkt, projektowanie menu strony internetowej United jest zbyt skomplikowane—jest zbyt wiele opcji, przez które użytkownicy mogą przejrzeć:
Źródło Obrazu
Odwrotnie, Cafebond.com stanowi dobrze zorganizowany przykład w odniesieniu do prostej kategoryzacji:
- Sprawdź swoje menu od czasu do czasu. Usuń linki, które są rzadko klikane. Zmień nazwy etykiet generycznych, aby były bardziej opisowe dla użytkowników i pająków wyszukiwarek.
Inspiracja dla kreatywnych projektów menu strony
Wielki Statek Kosmiczny
Ignorując typową heurystykę projektowania menu strony internetowej (na górze lub z boku zawartości strony głównej), przycisk Menu Big Spaceship znajduje się z przodu i na środku strony głównej.
Po kliknięciu użytkownicy są kierowani do nowej strony z zaledwie czterema opcjami menu.
Po wybraniu miejsca, w którym chcesz się udać, otrzymasz dodatkowe opcje. Każda strona oferuje te nowe opcje podmenu na różne atrakcyjne i kreatywne sposoby. Na przykład link „praca” prowadzi do klikalnych zdjęć, podczas gdy strona „Kariera” oferuje inny rodzaj nawigacji w menu, wymieniając otwarte pozycje ze strzałkami, które po kliknięciu rozwijają się, aby wyświetlić opisy dla każdego elementu.
Użytkownicy mogą łatwo powrócić do nawigacji w menu głównym, klikając przycisk „menu” (który zamienia się w menu hamburgerowe) na dole strony.
Equus Design
Ta agencja brandingu i komunikacji z Singapuru pokazuje, że minimalistyczny projekt menu strony internetowej nie jest nudny.
Istnieje stałe menu na górze strony głównej witryny, ale po kliknięciu jednego z najlepszych linków, każda strona prezentuje swój własny unikalny styl nawigacji. Na przykład na stronie „Informacje” odwiedzający są prezentowani z jednostronicowym projektem w obrębie istniejący projekt nawigacji menu, który zapewnia intrygujące wrażenia użytkownika.
Podobnie jak w przypadku wyżej wspomnianego projektu menu witryny Big Spaceship, główne pozycje menu są powiązane ze stronami o strukturze z różnymi układami wewnętrznymi.
NKI Studio
KNI Studio ma swoje menu w niekonwencjonalnym miejscu: wyśrodkowane na dole strony. Dodatkowo możesz kliknąć”+”, aby uzyskać odpowiednie linki społecznościowe.
Trendy Nawigacyjne 2018
Według ImpactBnd wielu projektantów szuka alternatyw dla minimalistycznego mobilnego menu hamburgera. W rzeczywistości Spotify usunęło menu hamburgerowe na rzecz menu z zakładkami, co doprowadziło do 30% wzrostu kliknięć w menu nawigacyjnym. Jak na ironię, hamburger menu design nadal łaska lubi wiele artykułów o trendach projektowania menu!
Dodatkowo korzystanie z mega rozwijanego i stałego górnego menu (oba trendy w projektowaniu menu z 2017 roku) nadal jest gorącymi tematami przenoszącymi się do 2018 roku. Niektóre stałe menu lub mega menu zaczynają zawierać elementy wizualne, takie jak ikony, zdjęcia, a nawet Mapa.
Strona internetowa Kellogga stanowi ładny przykład wielowymiarowego mega rozwijanego menu:
Nawigacja uniwersalna to kolejny trend projektowania menu strony internetowej, który został zaobserwowany przez wielu w ostatnim czasie. Na górze strony głównej witryny znajduje się link do strony głównej. Jest to przydatne dla firm posiadających wiele spółek zależnych lub franczyzowych, takich jak Disney.
Zobacz ten koncept w akcji na podstronie Disney Frozen:
Linki narożne All-caps to kolejny ciekawy, kreatywny trend projektowania menu. Dzięki temu strona internetowa jest profesjonalna, intuicyjna i symetryczna.
Strony internetowe, które wykorzystują ten trend projektowania menu, takie jak Sprout Social, mają wiele informacji do udostępnienia, ale robią to w sposób, który nie przytłacza:
Jasne odcienie, czcionki Bezszeryfowe i dodatkowe odstępy sprawiają, że ten trend projektowania menu działa.
Kreatywne projekty Menu stron internetowych i najlepsze praktyki
Kreatywne myślenie o elementach nawigacji w witrynie może sprawić, że Twoja witryna stanie się bardziej niezapomniana. Ale podczas projektowania nie zapomnij o prawdziwym celu nawigacji w witrynie: aby ułatwić użytkownikom wyszukiwanie i dostęp do treści. Wszystkie dzwonki i gwizdki na świecie nie mogą nadrobić nawigacji w witrynie, która jest bezużyteczna lub działa przeciwko innym wysiłkom SEO.
Tagi:
