3 viktiga navigationsutvecklingar för 2015
Gott nytt år till alla våra läsare! Idag ska vi titta på tre viktiga navigeringstrender som dominerar 2015.
Man kan tro att vi har undersökt alla möjliga variationer av navigering på webben, och ändå ser vi fortsatt utforskning inuti denna mycket specifika nisch. Det är verkligen fantastiskt hur många varianter av design som kan tillämpas på en ödmjuk länklista.
Här vill jag överväga 3 populära trender inom navigationsområdet: Först hur användningen av navicon (eller hamburgareikonet) ändras, för det andra ett nytt tillvägagångssätt med hjälp av helskärmsmenyer och äntligen vad jag anser vara perfekt för mega-rullgardinsmenyn. Låt oss dyka in och se dessa tillvägagångssätt på jobbet.
Lång liv / död till, navicon!
Facebook ges kredit för att popularisera användningen av navicons för att dölja navigeringsalternativen utanför skärmen eller av duk. Med födseln av lyhörd webbdesign var webbdesignsgemenskapen desperat för en lösning på navigering. Paketerar allt till en navigeringspanel som sätter av duk och rör sig när du väljer navicon var en attraktiv lösning. Det verkar som om samhället låses på det som en något lätt lösning som tycktes göra livet mycket enklare för formgivaren och utvecklaren. Som ett resultat har navicon blivit ett go-to alternativ för mobilappar och webbplatser.
Nyligen har dock navicon kommit under attack. I många av dessa debatter verkar det som att en viktig detalj utelämnas. Mobilappsindustrin går enkelt bort från skärmnavigering till förmån för alternativen på skärmen. Detta kommer som trenden är mot fokuserade, enstaka appar. Detta gör förändringen mer rimlig. Däremot kan även en liten webbplats packas med dussintals, om inte hundratals länkar i navigeringen. Ta till exempel en webbplats som sony.com, eller ens den här webbplatsen. Dessa platser har navigeringsbehov som går långt utöver vad som är möjligt med en enkel flikremsa. Av den anledningen anser jag att navikoner och skärmmenyer är här för att stanna. Vi måste helt enkelt vara medvetna om deras begränsningar, potentiella problem och så vidare. Och tänk alltid på användningen: är det en mobilapp eller en mobil / mottaglig webbplats. Eftersom de inte är samma.
Webbplatsen för designbyrån Long Story Short är ett härligt exempel på hur man kan utnyttja navicon på ett meningsfullt och begränsat sätt. Den här webbplatsen använder sig av navicon för att gömma bort hela spektret av navigationsalternativ. Det gör det på både mobila och stationära versioner av webbplatsen. Användningen av navicons på skrivbordet är faktiskt en hel del trend här. Vad som gör den här webbplatsen till ett utmärkt exempel på tillvägagångssättet är att de mest kritiska navigeringselementen visas utanför menyn . Hemsidan är en portal till de tre viktigaste delarna av webbplatsen. På så sätt är den dolda menyn inte den primära navigeringen, utan snarare en sekundär som fyller i ämnena.
Squarespace-webbplatsen är ett annat bra exempel på hur man effektivt använder dolda menyer. På denna sida är turen och inloggningsalternativen alltid synliga. Medan totalt 23 menyalternativ finns i bildrutan. Uppriktigt sagt är användningen av dolda menyer för att möjliggöra de viktigaste navigeringsalternativen att gå i centrum är inte så briljant. Jag gick igenom en fas där jag verkligen var nere på användningen av navicons på skrivbordet; det verkade som en miss användning av tekniken. Men efter att ha sett hur webbplatser använder det för att driva användare mot de mest kritiska elementen kan jag inte låta bli att älska det.
Slutligen, om du får sorg över användningen av navicons, eller dolda menyer tar inte någons ord för det. I stället gör dina egna användbarhetsprov för att se om det fungerar för din webbplats. En stor tumregel är att undvika debatt, och testa istället.
Helskärmsnavigering
Den andra trenden jag skulle vilja titta på är användningen av helskärmsnavigationsmenyer. Dessa menyer aktiveras vanligen med en knapp eller länk av någon typ; ganska ofta en navicon. Skillnaden här är att istället för en liten panel som glider ut tar navigeringen över hela skärmen. På mobilen känns det normalt, men på skrivbordet är det faktiskt ett nytt och intressant tillvägagångssätt.
Navigationen på den här webbplatsen är väldigt intressant, eftersom navigationsöverlägget packar mycket stans i menyn. Här har de de förväntade menyalternativen, men eftersom de är fullskärmade har de också plats för en fullständig kontaktformulär, kontaktuppgifter, sociala medier, ett nytt blogginlägg och ett framträdande tillvägagångssätt.
Det är intressant att överväga att en användare som startar en meny när som helst letar efter riktning. Detta gör det till ett utmärkt tillfälle att styra dem mot vad du vill att de ska göra. I det här fallet vill de att användaren ska komma i kontakt eller besöka sin projektplanerare.
I det här exemplet ser vi också mönstret på jobbet, men på ett mycket mer minimalistiskt sätt. I stället för att packa i extra alternativ valde de att helt enkelt presentera en mycket kortfattad lista över navigeringsalternativ. Plus de får bonuspoäng för att animera navicon till en "x" för att stänga menyn.
Perfektion av den stora menyn
Slutligen vill jag överväga superstorlek eller mega-rullgardinsmenyn. Användningen av superstora menysystem är inget nytt. Vad jag tycker är intressant är innehållet placerat inuti dem. I min bedömning av saker har designers verkligen lagt ner det här nya utrymmet på kraftfulla sätt.
Lowes hemsida visar perfekt vad jag har i åtanke. Här ser du att menysystemet har blivit en plats för innehåll. Detta innehåll kan användas för att styra flödet av användare via webbplatsen. Viktigast kan det driva dem mot det viktigaste innehållet. Frågan blir, vad är det viktigaste innehållet? Kanske är det det mest lönsamma objektet i din butik. På så sätt fungerar navigeringen som en säljare som driver de mest lönsamma produkterna. Eller kanske är det vanligt att vägleda användarna till de mest populära föremålen.
En annan webbplats som använder detta alternativ på ett annorlunda sätt är webbplatsen New Balance. Här är de tre första dropdownerna stora i naturen, men är i huvudsak listor över länkar. Det sista alternativet för att skapa anpassade skor ger dock den nedrullning som visas ovan. Det här menyalternativet är en enda länk. Jag älskar att de utnyttjade möjligheten att göra det här enskilda objektet till en riktigt övertygande intro till innehållet bakom länken.
Slutsats
Dessa tre trender, även om vi kan diskutera dem separat, har många egenskaper gemensamt. Primärt bland dessa är hur navigeringen har förändrats under åren. Dropdown-meny brukade vara generellt en organiserad lista över länkar. För det mesta var de något neutrala eftersom alla saker presenterades lika. Nu finner vi att navigationssystem är en viktig väg att hjälpa användarna att riktas mot önskvärda mål.
För mig är utmaningen tydlig. Att vi ska höja vårt tänkande på navigering och verkligen omfamna det inflytande det har på erfarenheten av att använda de webbplatser vi skapar. Alltför ofta tycker jag att navigering är lite eftertanke. När det i själva verket borde det vara bland de mest kritiskt övervägande och raffinerade elementen i designen.