5 świetnych witryn, z których można ukraść pomysły na nawigację

8

Projektanci mogą łatwo przeoczyć menu nawigacyjne.

Jest kilka standardowych układów, po które sięgamy za każdym razem, mówiąc sobie: „tego właśnie oczekują użytkownicy". I prawdą jest, że trzymanie się tego, co działa, ma większy sens niż sięganie po nowość samą w sobie, i że musimy projektować z myślą o oczekiwaniach użytkowników.

Ale skoro menu nawigacyjne w nagłówkach są głównym sposobem poruszania się użytkowników po witrynie, czy nie powinniśmy spojrzeć jeszcze raz i zobaczyć, czy możemy ulepszyć nasze? Użytkownicy nie zobaczą żadnego z naszych innych gadżetów projektowych, jeśli nie będą mogli nawet wyjść ze strony głównej.

Nie jestem zwolennikiem zwykłej kradzieży jednego z nich. Ale sugeruję wzięcie od nich lekcji i oparcie się na ich pomysłach, aby stworzyć menu nagłówka, które są faktycznie lepsze niż norma.

Mając to na uwadze, oto siedem najlepszych innowacyjnych menu nagłówków, które zobaczysz dzisiaj w Internecie.

1: Reissa

Reiss to firma odzieżowa z siedzibą w Wielkiej Brytanii. Ich rozwijane menu z wieloma opcjami jest znajome, jeśli kiedykolwiek kupowałeś ubrania przez Internet.

Ale w przeciwieństwie do zdecydowanej większości firm e-commerce, Reiss używa obrazów bezpośrednio w rozwijanym menu.

Zamiast czytać opis tekstowy, klikać tylko na podstawie tego opisu i dopiero wtedy konfrontować się z obrazem produktu, który rozważasz, odwiedzający Reiss może po prostu natychmiast zobaczyć przedmioty.

Wiemy, że obrazy e-commerce mają duży wpływ na użytkowników. Są głównym czynnikiem sprzedaży. Czy zatem nie ma sensu wprowadzać ich jak najwcześniej w ścieżce klienta?

Rozczarowujące jest jednak to, że nie stosują tego innowacyjnego podejścia na swojej stronie mobilnej, gdzie menu jest standardowym menu tekstowym z hamburgera w lewym górnym rogu.

Może dlatego, że Reiss nie sprzedaje dużo na urządzeniach mobilnych – ale wiemy, że podróże kupujących w e-commerce często zaczynają się na urządzeniach mobilnych, więc jeśli myślisz o zapożyczeniu tego pomysłu na menu, spróbuj znaleźć sposób na wdrożenie go równie dobrze na małym ekranie.

2: sen

Nawigacja Ruya pasuje do agencji, która szczyci się designem. Obraz nagłówka strony głównej to mapa podróży po serwisie w postaci dużej grafiki; zamiast czytać tekst, użytkownicy mogą wybrać miejsce na mapie do odwiedzenia.

To miły akcent, ponieważ odtwarza grę – wielu użytkowników zna gry wideo z interaktywnymi mapami, takimi jak ta.

Dla ostrożnych użytkowników, którzy nie chcą próbować interaktywnego animowanego menu w nowym stylu, na górze znajduje się tradycyjne menu hamburgerów.

Ten układ menu ma kilka świetnych zalet. Jest intuicyjny, nie dlatego, że jest ogólny, ale dlatego, że pomysł jest znajomy i ma sens. Robi wrażenie: po obejrzeniu nie zapomnisz nazwy agencji. Czy ich interaktywne menu to forma content marketingu? Powiedziałbym, że tak.

Ale wiąże się to też z pewnymi problemami. To spowalnia stronę. Efekt jest mniejszy, niż można by się spodziewać, ale jeśli twój komputer lub połączenie internetowe nie jest przynajmniej dość szybkie, nie wyciągniesz z tego wiele poza frustracją. A wdrożenie go oznacza konieczność napisania znaczącego niestandardowego kodu strony głównej — to dużo pracy włożonej w pomysł na projekt, który nie wiesz, czy się opłaci.

Niestety na urządzeniach mobilnych stylowe, oryginalne menu Ruya jest zredukowane do statycznego obrazu tła.

Nadal jest widoczny i nadal wygląda dobrze. Ale to nie działa jako menu. Oceniany jako obraz nagłówka, wygląda na trochę zajęty, niechlujny i – no cóż, pod wieloma względami gorszy od innych wyborów.

Jeśli twoi klienci zwykle korzystają z superszybkiego łącza szerokopasmowego i możesz zaoszczędzić godziny programistyczne, a także wysiłek projektowy, aby stworzyć coś takiego, może to być rzecz, która pozwoli ci wyprzedzić konkurencję. Ale znowu, biorąc pod uwagę, że telefon komórkowy jest teraz pierwszym ekranem, czy nie powinieneś upewnić się, że większość odwiedzających faktycznie zobaczy Twoją kreatywność?

3: Mieszalny

Menu Giganto są popularne wśród witryn skoncentrowanych na treści. Powód jest oczywisty: witryny takie jak ta mają po prostu więcej stron. (Mashable.com ma 256 000 stron. Naprawdę!) A użytkownicy naturalnie chcą najnowszych rzeczy, skategoryzowanych. W epoce, w której funkcje gazety i czasopisma zostały przejęte przez kanały informacyjne oparte na algorytmach, bogate w zdjęcia, reklamy i filmy, witryna czasopisma naprawdę potrzebuje czegoś więcej niż tylko suchego spisu treści.

Ten ruch jest bardziej przyszłościowy, niż mogłoby się wydawać. Kiedy magazyny techniczne, takie jak Wired, po raz pierwszy pojawiły się w Internecie, trzymały się harmonogramu wydawania czasopism, zmieniając witrynę co tydzień, jak nowy numer. Kiedy zdali sobie sprawę, że użytkownicy odwiedzali witrynę tylko wtedy, gdy mieli nowe treści, przełączyli się na publikację ciągłą.

Problemem był wówczas harmonogram wydawniczy zbudowany dla magazynu papierowego. W sieci możesz publikować stopniowo i wszyscy to robią. Ale w przypadku witryn z czasopismami menu nagłówków nie muszą naśladować stron z treścią rzeczywistych czasopism. Nieograniczone atramentem i papierem, menu nagłówków mogą być dynamiczne, kolorowe, intrygujące i bogate w informacje – zaleta sama w sobie, a mimo to pomagają znaleźć to, czego szukasz.

Niestety, podobnie jak wiele innych na tej liście, menu mobilne Mashable jest znacznie mniej interesujące. Wypełniające ekran menu meba w witrynie na komputery staje się stosem kafelków na urządzeniach mobilnych:

4: Monopo

Monopo idzie o krok dalej, niż większość marek odważyłaby się umieścić swoje menu w centrum uwagi. Początkowo ich strona główna ma standardowe menu nagłówka. Kliknij jednak element, a zostaniesz przeniesiony do menu wypełniającego ekran. Istnieją obrazy pozycji menu z animacjami, które przyciągają uwagę i przyciągają widza. Wybierz podkategorię, a ilustrowane menu będzie można przewijać, co pozwoli Ci przejść w dół strony i zobaczyć więcej bez konieczności klikania. To menu jako doświadczenie, jako funkcja, a nie niechętna refleksja.

Na urządzeniach mobilnych menu wygląda znacznie bardziej zwyczajnie. Jest klasyczny hamburger w prawym górnym rogu, z przodu i pośrodku skrzynka na listy, a następnie użytkownik przewija ekran w dół obok klikalnych obrazów.

To układ bardziej znany z blogów niż z głównej części strony internetowej, ale wciąż nie tak nowy i intrygujący jak menu na pulpicie. To, co ma w sobie, to to, że jest bardzo wizualne, intuicyjne w obsłudze, a nawet w wersji mobilnej starannie dobrane obrazy oddają poczucie podejścia agencji.

To, czego nie oferuje, to innowacyjne menu mobilne. Obrazy są świetne, ale to wciąż tylko stos kafelków.

5: Telewizja papierowa

Przyjrzeliśmy się witrynom, które umieszczają swoje menu w miejscu, w którym użytkownicy nie mogą ich przegapić, skupiając się na stworzeniu doświadczenia użytkownika, które pozwala odwiedzającym przejąć kontrolę nad tym, jak poruszają się po witrynie od samego początku.

Ale Paper Television jest jedną z coraz większej liczby witryn, które przyjmują odwrotne podejście i wybierają globalnie ukryte menu. Menu Paper Television to hamburger w górnym rogu. Czy to nie powstrzymuje użytkowników przed znalezieniem drogi?

Teoretycznie dobrze jest mieć menu, którego nie można przegapić, w standardowej, rozpoznawalnej lokalizacji. Ale dla wielu użytkowników mobilnych hamburger jest standardem i rozpoznawalny. Dodajmy do tego fakt, że ruch w Paper Television trafia głównie na stronę główną:

I weź pod uwagę fakt, że strony docelowe konwertują znacznie lepiej, gdy elementy menu są usunięte – czasem nawet o 100% lepiej. Jeśli ich strona główna jest zasadniczo stroną docelową, czy Paper Television nie powinna usunąć widocznej nawigacji w jak największym stopniu, zachowując jednocześnie możliwość poruszania się po witrynie dla tych, którzy naprawdę tego chcą?

Co więcej, ich strona główna jest prawie identyczna na urządzeniach mobilnych – tylko nieco inne wymiary.

Doświadczenie, które naprawdę stawia na urządzenia mobilne, powinno wykraczać poza samo projektowanie pod kątem wyświetlaczy mobilnych i uwzględniać oczekiwania i nawyki użytkowników mobilnych.

Zawsze ukryte menu, będące konsekwencją ograniczonej przestrzeni na ekranie telefonu komórkowego, ma w tym kontekście doskonały sens, więc być może zobaczymy ich więcej w przyszłości!

Wniosek

Dostępnych jest tutaj wiele różnych stylów menu, od menu, które przejmują witrynę i wypełniają ekran, po menu, które się ukrywają. Najważniejszą rzeczą we wszystkich tych menu jest to, że zaczynają się od próby dania użytkownikowi czegoś świeżego i innego – starają się wziąć niektóre z najcenniejszych nieruchomości na stronie internetowej i przekształcić je w coś więcej niż tylko rząd od pięciu do siedmiu klikalnych opcji.

Tam, gdzie wiele z nich upada, jest na urządzeniach mobilnych, gdzie ciekawe, stylowe kreacje, które ich projektanci umieszczają na swoich stronach na komputery, zwykle ustępują miejsca tym samym starym, tym samym starym przewijanym kartom. Co możemy z tym zrobić? Daj nam znać w komentarzach poniżej – i przygotuj niesamowite menu!

Comments are closed, but trackbacks and pingbacks are open.

Ta strona korzysta z plików cookie, aby poprawić Twoje wrażenia. Zakładamy, że nie masz nic przeciwko, ale możesz zrezygnować, jeśli chcesz. Akceptuję Więcej szczegółów