Ikona hamburgera - trzy małe paski wskazujące na link do menu - to jedna z najbardziej kontrowersyjnych technik w sieci. Projektanci, jak nam powiedziano, wszyscy go nienawidzą; klienci, mówimy wszystkim, też ich nienawidzą. Dlaczego więc jest wszędzie?

Ikona hamburgera jest łatwo skalowalna i pasuje czysto do siatki pikseli. Pierwotnie była to ikona listy, która została naciśnięta w bieżącej roli, ale ponieważ menu jest po prostu listą opcji, to semantycznie poprawne jest używanie elementu listy w ten sposób.

Było dużo dyskusji, testów A / B, rantów blogów i badań użytkowników przeprowadzonych na ten temat, ale te badania prawie zawsze koncentrują się na projektowaniu aplikacji. Kiedy ikona hamburgera jest używana w projektowaniu stron internetowych, wskazuje na znacznie poważniejszy problem.

Problem z ikoną hamburgera

Jest wielu projektantów, którzy kwestionują wartość samej ikony hamburgera. Często jest postrzegana jako ikona stylu iOS, mimo że była używana w ten sposób, zanim Apple ją zaadaptowało.

szwajcarski
hugeinc

W rzeczywistości istnieje wiele sprzecznych dowodów na to, czy ikona hamburgera jest użyteczna jako wskazanie menu. Niektórzy projektanci twierdzą, że ikona jest łatwo rozpoznawalna przez młodszą demografię, inni sugerują, że starsza grupa demograficzna rozpoznaje ją, jeśli jest w sieci. Jedyny wniosek, jaki możemy wyciągnąć z tych dowodów, to fakt, że testy użyteczności okazały się niejednoznaczne, a testy równoległe często zwracają sprzeczne wyniki.

Powszechnie akceptowane jest to, że użytkownicy nie rozpoznają ikony hamburgera jako pojedynczego łącza - prawdopodobnie dlatego, że zaprojektowano ją tak, aby wyglądała jak grupa łączy, a nie pojedyncza. Coś, co jest obsługiwane, to otaczanie ikony hamburgera z ramką lub nadawanie jej tła, dzięki czemu wygląda bardziej jak przycisk - odważę się powiedzieć, że bardziej skeuomorficzny - spowoduje więcej kliknięć.

futureinsights

Więcej problemów z ikoną hamburgera

Oprócz samego wyglądu ikony, podejście do używania ikony hamburgera napawa wieloma problemami.

Po pierwsze, a może przede wszystkim ikona hamburgera dodaje dodatkową akcję do nawigacji; kiedy wystarczy jedno kliknięcie, aby dotrzeć do konkretnej strony, zajmie to dwa. Praktyczna zasada dla projektantów stron internetowych zawsze była maksymalnie trzema kliknięciami (w miarę możliwości), tak daleko od rozwiązania problemu nawigacyjnego, technika ikony hamburgera po prostu wymienia jeden problem na inny. Oczywiście, nie jest to tylko kwestia ikony hamburgera, jest to problem dla każdej nawigacji ułożonej w ten sposób. Możesz użyć słowa "Menu" zamiast ikony hamburgera i będziesz miał tę samą przeszkodę, różnica polega na tym, że ikony hamburgera nie można używać w żaden inny sposób.

hobbit
jam3

Technika hamburgera ukrywa również jej zawartość. Z punktu widzenia UX użytkownicy nie powinni podejmować działań, aby dowiedzieć się, jakie działania mogą podjąć. Zbyt łatwo jest zapomnieć o "udostępnianiu na Twitterze" lub "idź do kasy", gdy te opcje nie są bezpośrednio przed tobą. Użytkownicy po prostu nie szukają łącza, którego nie znają.

W końcu technika ikony hamburgera ukrywa aktualny stan Twojej witryny i pozycję użytkownika w niej. Down stany w menu dostarczają użytkownikowi informacji kontekstowych, które zaciemnia technika ikony hamburgera.

Londyn-se

Co robi ikona hamburgera?

Biorąc pod uwagę, że ikona hamburgera jest powszechnie znienawidzona i powoduje szereg problemów, dlaczego jest używana wszędzie?

Z mojego doświadczenia wynika, że ​​z pewnością wśród niektórych danych demograficznych ikona hamburgera osiągnęła ostatnio poziom łatwości rozpoznania. Studia, które obalają, które wydają się być rokiem lub starszym i rokiem, to długi czas w interweb.

W rzeczywistości ikona linku jest znacznie bardziej rozpoznawalna niż ikona linku lub ikona udostępniania , której ostateczne formy jeszcze się nie pojawiły. Ikona hamburgera jest spójna dla dowolnej liczby różnych wzorów.

igrzyska olimpijskie

Najważniejsze, że ikona hamburgera robi to, co chce: oszczędza nam to mnóstwo ekranu nieruchomości. Jeśli klient przedstawi ci listę przedmiotów gagillion, które muszą zostać dodane do menu, to przeniesienie ich poza ekran i połączenie z nimi jest prostym, ale skutecznym sposobem na zrobienie miejsca dla zawartości, której chce również klient.

Chciałbym powiedzieć, że ikona hamburgera rozwiązuje problem lepiej niż inne rozwiązania, ale to nieprawda. Zamiast tego powiem, że ikona hamburgera rozwiązuje problem w mniejszym stopniu niż inne rozwiązania.

Źródło problemu

Ikona hamburgera jest zwykle stosowana, ponieważ projektanci - lub częściej klienci - nie są w pełni zaangażowani w podejście mobilne. Chcą "regularnej" strony, ale wciskają się na telefon wnuczki.

Przeciwnicy ikony hamburgera mają tendencję do zastępowania go słowem "Menu" - w ten sposób całkowicie tracą punkt widzenia. Ikona hamburgera nabrała znaczenia lub nie, ale użytkownicy rozumiejący, do czego służy ten przycisk, nie rozwiązują największego problemu, który polega na tym, że ukrywanie naszej nawigacji, ukrywanie opcji naszych użytkowników, jest okropnym aktem jaźni. -sabotaż.

Krótko mówiąc, ikona hamburgera jest symptomem naszej zbiorowej porażki z pełnym przyjęciem wszystkich aspektów podejścia mobilnego.

Pono
mccollcenter

Lepsze rozwiązanie

Aby rozwiązać problem z hamburgerami, musimy zaakceptować fakt, że sieć, którą znamy, nie działa. Wzrost mobilnej sieci oznacza znacznie więcej niż zmniejszenie liczby używanych przez nas kolumn i upuszczenie niektórych z cięższych plików graficznych.

Sieć mobilna jest wykorzystywana w inny sposób niż stare sieci. Sieć mobilna istnieje w kontekście dedykowanych aplikacji, a użytkownicy oczekują, że sieć będzie doświadczana w podobny sposób.

Aplikacja Facebooka wymieniła swoją ikonę hamburgera na pasku kart, w wyniku czego uzyskano lepsze konwersje. Ale Facebook zrobił coś znacznie ważniejszego niż zamiany w menu. Niedawno wydali swoją aplikację Messenger, a wielka sprawa polega na tym, że mieli już doskonale funkcjonalną i popularną aplikację, z którą mogli zintegrować wiadomości. Facebook podzielił ich funkcje, koncentrując się na roli każdej aplikacji, do której dotarły w dwóch prostych aplikacjach, zamiast jednej złożonej. Zmniejszona funkcjonalność powoduje zmniejszenie zestawu opcji menu i zmniejsza zapotrzebowanie na menu hamburgerów.

Dobre aplikacje są bardzo skoncentrowane i ewoluowały w ten sposób dzięki znacznie bardziej rygorystycznym testom przeprowadzanym przez użytkowników niż Internet. Aby stworzyć styl aplikacji, musimy uprościć nasze witryny, uprościć je, a następnie uprościć nieco więcej. Jeśli to konieczne, przełam swoją architekturę w poręczne kawałki wielkości, mikrowitryny prawie. Gdy przedstawiamy naszym użytkownikom prosty zestaw opcji, problem złożonego menu nigdy nie powstaje.

Używanie ikony hamburgera przypomina uderzanie bandaża o kontuzję: łata go, ale pod spodem coś jest zepsute.

Tylko jeśli w pełni zastosujemy podejście mobilne i zastosujemy je nie tylko do naszego projektu, ale do naszej zawartości i naszej architektury informacji, przekażemy menu hamburgerów do historii.

Wyróżniony obraz / miniatura, używa Obraz Hamburger przez Mononc 'Paul