Webbdesign trender 2017
3 Feb 2017
Trender i Webbdesign 2017
Det här är vad vi tror kommer att trenda i webbdesign under 2017. Vilka är de hetaste trenderna just nu, vad är fortfarande populärt från 2016 och vilka trender håller på att mattas av?
Först och främst, några trender som är här just nu, och som vi tror kommer att öka under 2017:
Det allra, allra senaste
Sluttande plan
De stora herobilderna och bildspelen på landnings- och splashsidor har blivit så vanliga att de måste hottas upp för att till fullo fånga uppmärksamheten hos dagens webbesökare.
Det vanligast sättet verkar vara att använda en lätt vinklad, sluttande linje även om andra former för att bryta upp raka, horisontella designelement också förekommer.
Trenden med sluttande linjer påverkar förutom herobilder även andra element. Till exempel använder både Stripe och Microsoft email service Outlook sluttande designelement genomgående på sina webbsidor för att visuellt dela upp dem i olika sektioner.
För utvecklare som ska implementera den här trenden kan dessa två artiklar vara till nytta: Ultimate Guide to Non-Rectangular Headers (Part 1) and Sloped edges with consistent angle in CSS
Mobil navigation kommer till desktop
Eftersom användare i allt större utsträckning surfar via mobilen och tillbringar mer och mer tid i mobilappar, är det naturligt att designmönster som främst förekommer på sidor och appar på mobiler överförs även till större skärmar.
Popout menyer som inkluderar designmönstret med en stor ikon och en mindre, centrerad text kommer att bli allt vanligare även på datorer.
Vi tror att det här är en trend som kommer att öka rejält det här året, dels på grund av att den har plockats upp i Linkedins nya design, men också för att den återfinns i redesignen av Smashing magazines nya webbsida. Smashing magazine betraktas av många som den ledande publikationen inom webbindustrin, och redesignen i sig har designats och implementerats av inga andra än Andy Clarke och Sara Soueidan.
Andra typiska exempel på detta designmönster återfinns i redesignen av Jinx (säljer kläder och prylar inspirerade av dataspel), och 2016 års version av 24 ways, som är en adventskalender för professionella inom webbranschen.
Som alltid tenderar folk att följa trendsetters, så när stora organisationer eller ledande personer i branschen verkar luta åt den här typen av navigation, tror vi att fler menyer av denna typ kommer att dyka upp.
Gradienter
Den platta designtrenden har varit här ganska länge nu, och designers har därför börjat letar efter nya vägar att göra platta element lite mer spännande. Att lägga till gradienter till element är ett sätt att få det att sticka ut, samtidigt som man behåller den platta stilen. Tekniken används både i Pokémon Go appen, på Spotify och i projektledningsverktyget Asana.
Kommande trender
Dessa är inte riktigt här, men vi tror att de kommer att utvecklas under året.
Visa innehåll på nya sätt
Några exempel på att använda ny teknik för att visa innehåll på nya sätt är VR design och webbdesign med okonventionella och kreativa layouts.
VR glasögon utsågs till 2016 års julklapp. Även om VR teknik inte är tillgänglig för andra än de priviligierade delarna av jordens befolkning, är en hel del av dessa utvecklare vars intresse och entusiasm för tekniken sprider sig genom webbindustrin.
CSS Grid Layout är en ny feature för programmeringsspråket CSS, som används för att bestämma utseende, placering och struktur för element på en webbsida. CSS Grid Layout kommer att lanseras i de senaste versionerna av utvalda browsers under våren 2017, och kommer att göra det lättare att skapa olika typer av layouts på webbsidor.
Jordnära färgtoner
Pantones färg för året heter Greenery, och kan vara en ledtråd till varför ryktet säger att jordnära färger kommer att börja dyka upp i webbdesigns i år, som en kontrast till de skarpa, ibland till och med neonlysande färger som varit moderna under 2016.
Trender från 2016
som är här för att stanna:
Parallax effekter
Parallax effekter* kommer fortfarande att vara populära, även om implementationerna eventuellt kommer att vara mer genomtänkta och ta med performance och användarvänlighet i beräkningen.
*Parallax effekter innebär webbsidor som skapar en känsla av djup genom att flytta bilder på webbsidan vid olika tidpunker och hastigheter, ofta i samband med att användaren scrollar ner på sidan. Se ett typiskt exempel här: www.firewatchgame.com
Djärv typografi
Stor och djärv typografi kommer också att stanna. Typografi kommer att bli ännu viktigare när nya layouter öppnar möjligheter att leka med texter på ett sätt som tidigare ofta bara setts i tryckta medier.
Animationer
Både större och mindre animationer kommer att fortsätta vara viktiga delar av användarinteraktioner. Att bara lägga till rörelse till en webbsite kommer dock inte att räcka längre. Mer arbete med detaljer och större ansträngningar kommer att göras för att försäkra sig om att animationerna uppfyller webbsidans/appens syfte och mål, samt är i linje med organisationens övergripande varumärke och brand.
Stora bakgrundsbilder och video
Vi kommer att fortsätta se mycket webbsidor med stora videos eller bilder i bakgrunden.
På tillbakagång
Hexagoner
Hexagonen eller femuddingen var väldigt popular ett tag, vilket kan ha resulterat till en överanvändning av den och andra geometriska former inom webbdesign.
Överdrivet platt design
Den superplatta designtrenden är på tillbakagång, till förmån för strukturer, gradienter och gradvisa skuggor.
Fejkat innehåll
Det ställs högre krav på att det som publiceras på webben är trovärdigt, eftersom besökare har blivit bättre på att upptäcka sådant som är falskt.
När alla använder samma typ av snygga och glada modeller i en politiskt korrekt blandning av olika kön och etnicitet på företagets webbsida, slutar både webbsidan och företaget att vara trovärdigt.
Kom Ihåg
Webbindustrin utvecklas i en svindlande fart, vilket påverkar livslängden på trender inom branschen. När det kommer till att designa och bygga en webbsida bör det huvudsakliga fokus ligga på att uppfylla projektets mål och hantera dess utmaningar, inte på vad som råkar vara trendigt just nu.