Nawigacja na stronie internetowej – jak uczynić ją efektywną i przejrzystą

Nawigacja i jej elementy

W idealnym świecie każdy użytkownik zaczynałby na stronie głównej i podążał zaplanowaną ścieżką do konwersji.

Rzeczywistość jest jednak zupełnie inna. Strona główna rzadko jest tą najczęściej odwiedzaną. Gdybyśmy spojrzeli na rozkład całkowitego (100%) ruchu w sklepie internetowym, to tylko około 30% wizyt byłoby na samej stronie głównej, a pozostałe 70% wizyt na innych stronach (kategorie, produkty, kontakty itp.). Sprawnie zaprojektowana nawigacja i wszystkie jej elementy odgrywają główną rolę w podróży użytkownika po stronie internetowej lub sklepie internetowym. Dlatego konieczne jest zrozumienie związku nawigacji i jej elementów z doświadczeniem użytkownika.

Efektywne elementy nawigacji powinny:

• być widoczne,
• informować o aktualnej pozycji użytkownika na stronie,
• być w stanie ukierunkować użytkownika,
• być łatwe w użyciu.

Podstawowe elementy nawigacji

Menu nawigacyjne

Użytkownicy zazwyczaj wyobrażają sobie główną nawigację na stronie internetowej lub sklepie internetowym jako poziome menu na górze strony – w nagłówku. Podstawową zaletą tego typu nawigacji jest to, że jest ona zgodna z tym, jak użytkownicy skanują stronę – od góry do dołu, od lewej do prawej. Jest to dobre rozwiązanie dla menu nawigacyjnego lub nawigacji w ogóle, np. usług lub podstawowych kategorii produktów.

💡 Praktyczne porady:
Jeszcze lepszą wersją standardowego przyklejonego nagłówka jest ten półprzyklejony, który (ponownie) pojawia się na górze strony dopiero wtedy, gdy użytkownik zaczyna przewijać w górę. Zapewnia on więcej miejsca na przeglądanie treści (zwłaszcza na urządzeniach mobilnych) i łatwo pokazuje potrzebne narzędzia, gdy użytkownicy ich potrzebują.

Strona główna i logo

Jedną z niewielu rzeczy, na których użytkownicy mogą polegać, jest to, że każda strona internetowa ma stronę główną (startową), która jest postrzegana jako główny punkt startowy, który dostarcza informacji i wprowadzenie do tego, co użytkownik znajdzie na stronie. Znalezienie tych informacji jest szczególnie istotne dla odwiedzających, którzy wchodzą na stronę z wyszukiwania organicznego lub reklamy i przechodzą bezpośrednio do innych stron na niższym poziomie. Wtedy zazwyczaj chcą odwiedzić stronę główną, aby dowiedzieć się, co mogą zobaczyć w witrynie i jakie typy stron się tam znajdują. Jeśli zaczniesz śledzić zachowania użytkowników, okaże się, że często wracają na stronę główną, gdy się zgubią, skończyli przeglądać witrynę lub są zainteresowani większą ilością informacji o sklepie.

💡 Praktyczna porada:
Śledząc zachowania użytkowników w sklepie internetowym (np. poprzez śledzenie ruchów myszy), prawdopodobnie zauważyłbyś, że użytkownicy mają tendencję do korzystania ze strzałki wstecz w przeglądarce, zamiast po prostu wrócić do kategorii nadrzędnej.

Możesz wykorzystać tę wiedzę i umieścić własną strzałkę wstecz w pasku bocznym z podkategoriami, aby ułatwić klientom przeglądanie Twojej strony.

Stopka strony

Dolna część każdej strony internetowej lub sklepu internetowego nazywana jest stopką. W zależności od rodzaju treści, mają one zazwyczaj różne formy. Jednak ta przydatna przestrzeń jest często niedoceniana już podczas planowania projektu strony. Wychodzimy z założenia, że użytkownicy nie zwracają większej uwagi na dół strony. Prawda jest jednak taka, że faktycznie to robią. Element ten, zatem często nie spełnia swojego potencjału. Jeśli użytkownik dotarł do końca Twojej strony, to prawdopodobnie jest zainteresowany Twoją treścią.

Przykładowo, użytkownicy zazwyczaj albo odwiedzają stopkę strony, gdy kończą wizytę (czytają artykuł lub szukają kolejnych treści), albo celowo przewijają do stopki, bo oczekują jakiejś konkretnej informacji, np. danych kontaktowych.

💡 Praktyczne porady:
Breadcrumb informuje nas dokładnie gdzie i jak głęboko jesteśmy w strukturze strony. Poszczególne elementy w nawigacji breadcrumb muszą być zawsze klikalne i dawać możliwość podążania za hierarchią strony. Jeśli chcesz poprawić doświadczenia użytkowników, pozwól im na przeglądanie innych kategorii na tym samym poziomie hierarchii. Daje im to więcej możliwości odkrywania nowych treści.

Przyciski i linki

Przyciski i hiperłącza to powszechne elementy nawigacyjne, z którymi użytkownik spotyka się wszędzie. Pozostaje jednak pytanie, czy wiemy, których z nich używać i kiedy je stosować. Przyciski zazwyczaj określają jasne akcje, które przenoszą użytkownika po stronie lub prowadzą go do osiągnięcia konkretnego celu (konwersji).

Przyciski definiują akcje, które w jakiś sposób wpływają na samą stronę lub sklep internetowy. Przykładowo: Założenie konta użytkownika, wysłanie zamówienia, potwierdzenie transakcji itp. Natomiast linki służą do mniej istotnych akcji, które nie wpływają na zachowanie strony, a przede wszystkim realizują zadanie nawigacyjne.

Nawigacja w witrynie powinna minimalizować potrzebę interakcji, czyli wysiłek, jaki muszą podjąć użytkownicy podczas interakcji z witryną. Istnieją dwa dobre powody, aby ograniczyć liczbę elementów najwyższego poziomu w nawigacji:

• Pozwoli to użytkownikom lepiej zrozumieć interfejs nawigacyjny. Im więcej masz elementów nawigacyjnych, tym trudniej jest zapamiętać i przetworzyć informacje dla użytkowników.
• Prosta i przejrzysta nawigacja z mniejszą ilością elementów ma pozytywny wpływ na optymalizację pod kątem wyszukiwarek.

💡 Praktyczne porady:
Projektując nawigację i wybierając jej elementy najwyższego poziomu, należy wziąć pod uwagę przyzwyczajenia i potrzeby użytkowników strony. Na przykład umożliwienie im przejścia na stronę główną z dowolnej części witryny poprzez kliknięcie w logo.

Jednak, nie każdy użytkownik oczekuje, że po kliknięciu w logo trafi na stronę główną, dlatego warto dodać do głównej nawigacji pozycję o nazwie “Strona główna”. Informacje kontaktowe to kolejny niezbędny element nawigacji, który często jest jedną z najczęściej odwiedzanych stron.

Odwiedzający zwykle używają jej, aby zweryfikować wiarygodność firmy lub przedsiębiorstwa, dowiedzieć się, gdzie ma siedzibę, czy istnieją sklepy stacjonarne i czy są np. w pobliżu.

Dbaj o zwięzłość struktury

Kluczowa jest nie tylko liczba elementów w nawigacji, ale także ich kolejność. Przy projektowaniu nawigacji sensowne jest sortowanie elementów według ważności. Idź od najwyższego do najniższego priorytetu. Weź jednak pod uwagę również efekt Serial-position, zgodnie z którym najbardziej efektywne są elementy znajdujące się na początku i końcu (nasz mózg radzi sobie z nimi lepiej niż z elementami w środku nawigacji). Dlatego pozycje na początku i końcu nawigacji stają się bardziej znaczące dla użytkowników.

Nie zapominaj o wyszukiwaniu

Wyszukiwanie jest jednym z najważniejszych elementów nawigacji. Użytkownicy oczekują, że będzie się ona znajdować tuż przy głównej nawigacji, gdzie pełni rolę pomocniczego elementu nawigacyjnego. Jeśli ukryjesz lub umieścisz wyszukiwanie w niewygodny sposób, możesz stracić znaczną część przychodów. Nawet 40% odwiedzających korzysta z wyszukiwania na stronie głównej, a są to w większości użytkownicy, którzy wiedzą czego chcą i są zdecydowani na zakup.

Taki układ pozwala również na efektywniejsze wykorzystanie przestrzeni, np. do ekspozycji produktów lub reklam, a także poprawia user experience (więcej miejsca na elementy, przejrzysta struktura i hierarchia).

Jak zaprojektować efektywną nawigację główną

Ważne jest, aby zrozumieć, że można rozpocząć projektowanie nawigacji dopiero po stworzeniu przejrzystej architektury informacji. Stanowi ona podstawę dla wszystkich elementów nawigacyjnych i nawigacyjnych na stronie internetowej lub w sklepie internetowym. Wszystko, na czym musisz się skupić, to uczynienie jej jak najbardziej użyteczną.

Interakcję użytkowników z nawigacją można sprawnie ocenić za pomocą takich narzędzi jak Hotjar, Smartlook czy Clarity. Narzędzia te pozwalają na zbieranie zarówno danych ilościowych (kliknięcia na stronie, ruchy myszką czy przewijanie), jak i jakościowych (nagrania wideo). Na podstawie tych narzędzi i metodologii możesz skutecznie pomóc w poprawieniu aktualnego stanu nawigacji i jej struktury oraz podjąć dalsze kroki w celu jej ulepszenia. Na przykład zmienić kolejność elementów na poziomie głównym, edytować ich nazwy itp.

W przypadku każdej analizy dobrze jest użyć więcej metod i nie polegać na wyjściach z tylko jednego źródła. Żadna z nich nie może być tak dokładna, jak byś oczekiwał i żadna nie powie Ci, dlaczego użytkownicy zachowują się tak, jak się zachowują (możesz poznać skutki, ale nie przyczyny).

Nie optymalizuj menu tylko w oparciu o stronę główną

Domyślnie strona główna stanowi około 30% wszystkich wizyt na stronie internetowej lub w sklepie internetowym. Pozostałe 70% ruchu stanowią inne strony, na które użytkownicy trafiają, np. z wyszukiwania organicznego, reklam, sieci społecznościowych itp. Dlatego ważne jest, aby nawigacja była intuicyjna na każdej podstronie. Najprostszym sposobem na osiągnięcie tego celu jest zidentyfikowanie najpopularniejszych podstron, np. za pomocą Google Analytics i optymalizacja nawigacji pod kątem zachowań użytkowników na nich.

Typowym elementem nawigacji mobilnej, który stanowi uzupełnienie burger menu, jest dolny pasek nawigacyjny.

Pasek ten pojawia się na dole ekranu i zawiera kluczowe elementy nawigacyjne lub przyciski. W sklepach internetowych może to być koszyk, ulubione produkty i inne.