Nawigacja – ważny element strony WWW

Formy nawigacji
Już na samym początku projektowania strony WWW należy dokładnie przemyśleć, z jakiej formy menu nawigacyjnego chcemy skorzystać. To, który układ nawigacji wybierzemy projektując naszą stronę WWW, zależy od kilku czynników. Poniżej spróbuję wyszczególnić najważniejsze mocne i słabe strony poszczególnych układów menu.
Menu poziome
Menu poziome (w formie zakładek) to najczęściej wykorzystywany format, gdyż jest wygodny w komunikacji. Z rozwiązania tego warto skorzystać w przypadku, gdy planujemy mieć małą ilość kategorii lub gdy zajdzie potrzeba stworzenia dwóch bloków nawigacji, co jest często spotykane w przypadku sklepów internetowych. Menu poziome ma te zalety, iż zajmuje mało miejsca i po wejściu na stronę od razu jest widoczne dla użytkownika. Słabą strona takiego rozwiązania jest ograniczenie liczby pozycji w menu, a nazwy poszczególnych zakładek musza być stosunkowo krótkie, idealnie jeśli są to pojedyncze słowa.

menu_boczne

Przykład menu poziomego oraz menu bocznego na stronie vita-centrum.pl

Menu poziome z podmenu
Tego typu układ nawigacji posiada wszelkie cechy menu poziomego i stosuj się je w przypadku większej ilości kategorii i podkategorii, dzięki czemu w prosty i intuicyjny sposób możemy zaznaczyć miejsce, w którym znajduje się obecnie użytkownik. Wadą takiego rozwiązania jest fakt, iż podmenu zajmuje większa powierzchnię, przez co główna zawartość strony ulega obniżeniu. Przy większej ilości pozycji menu nawigacja może stać się nieczytelna, zwłaszcza, jeśli zajdzie konieczność utworzenia kolejnego rzędu podkategorii, a użytkownik może przez to czuć się zdezorientowany. Tego typu rozwiązania stosuje się w przypadku dwupoziomowej struktury nawigacji (gdzie drugi poziom staje się mniej zauważalny).
Menu boczne – poziome
Jest niezwykle wygodne w przypadku nawigacji posiadającej większa liczbę kategorii, a także wówczas, gdy nawigacja posiada wiele poziomów i istotne jest oznaczenie relacji między nimi. Zaletą tego rozwiązania jest możliwość tworzenia dłuższych nazw linków.
Wada tego typu rozwiązania jest fakt, iż zajmuje ono stosunkowo duży obszar strony, może być również mniej zauważalne dla użytkowników. Ponadto istnieje również zagrożenie, iż część menu znajdzie się poniżej linii przewijania strony (tzw. „złamania”), przez co stanie się niewidoczne dla użytkowników.
Zastosowanie menu bocznego poziomego sprawdza się w przypadku dużej liczby działów lub kategorii oraz gdy nawigacja ma głęboką strukturę, jak również wówczas, gdy w przyszłości planujemy rozbudować menu o nowe pozycje . Menu tego typu często stosowane jest jako podmenu do menu głównego, poziomego.
Menu kaskadowe
Ten rodzaj menu spotkał się z największa liczbą głosów krytycznych. Zarówno projektanci, jak i sami użytkownicy dostrzegają wiele wad tego rozwiązania , jednak w niektórych przypadkach może ono okazać się całkiem niezłym rozwiązaniem . W menu kaskadowym stosuje zakładki, które rozsuwają się pod wpływem kliknięcia lub najechania kursorem myszy. Zaleta tego typu rozwiązania jest możliwość pomieszczenia dużej ilości informacji , jednak wadą jest brak podglądu całości dostępnych opcji w menu. Menu kaskadowe stosowane jest często aplikacjach desktopowych, a w przypadku stron WWW pełnią ono funkcję nawigacji skrótowej do struktury serwisu niższego rzędu.

menu

 

 

 

 

 

 

 Przykład menu kaskadowego na stronie www.foodparty.pl

Projektując nawigację na stronie WWW warto kierować się nie tylko względami estetycznymi, ale przede wszystkim potrzebami i oczekiwaniami naszych użytkowników, z uwzględnieniem ich przyzwyczajeń w sieci. Wówczas nasza strona będzie intuicyjna i wygodna w obsłudze, a użytkownik szybko i bez problemu odnajdzie to, czego szuka.

 

Bookmark the permalink.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

Możesz użyć następujących tagów oraz atrybutów HTML-a: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>