Nettside-trendene du bør vite om for 2019

Nettsider er på mange måter som moteklær, med sin egen bransje som spår årets trender og populære design. Det er ikke lenger en traust bransje hvor man føler man må følge strenge design-krav og forpliktelser, men heller har mer kreativ frihet. Og dette smitter over på kunder som også selv føler at nettsidene enklere kan bli en del av sin merkevare på en spennende måte, og forsterke denne i stedet for at nettsiden skal være en «nødvendighet». Og med enklere verktøy for å redigere og vedlikeholde nettsider ser vi også at det er enklere for kunder å arbeide med nettsidene sine selv, og uttrykke seg kreativt. Å jobbe med nettsiden er ikke lenger som å gjøre hus-oppgaver som å vaske stua eller ta oppvasken, men heller noe man ser frem til å gjøre – som en time med Netflix eller å lese en bok.

Nedenfor følger 10 trender for året som kommer som vi er spesielt begeistret over, med eksempler og tips hvordan de kan brukes. Husk at du trenger nødvendigvis ikke benytte deg av alle metodene som nevnes her – prinsippet om at «less is more» gjelder fortsatt på høyt nivå. Det viktigste er å kunne bruke disse til å forsterke ditt budskap, og bruke dem hvor de kan passe. Hold nettsiden oversiktlig, men bruk disse triksene til å friske opp hvor du føler det passer:

1) Mikro-animasjoner

Bevegelse er alltid spennende, men animasjon betyr ikke at man trenger å gjøre hele nettsiden om til en fullverdig Disney-film. Animasjon av forskjellige typer har vært en økende trend de siste årene, med effekter som Parallax Scrolling som et populært valg (hvor man bruker bilde eller film i bakgrunnen og scroller innhold over slik at det ser ut som bildet ligger dypere inn i nettsiden). I 2019 ser det ut som om mikro animasjoner blir et populært valg, hvor man benytter små bevegelser for å komplimentere innholdet.

Dette er små bevegelser som dukker opp når nettlesere gjør en bestemt handling, for eksempel scroller nedover siden. De fyller sidene dine med energi, har ikke særlig innvirkning på sidens lastetid, og distraherer dine besøkende fra banen du har tiltenkt for dem. Du kan se på dem som veiskilt som bidrar til å signalisere en besøkende om hvor de skal gå/kikke, og gir visuelle tilbakemelding når de navigerer gjennom nettstedet ditt. Hvis du for eksempel endrer knappens design – teksten eller fyllfarge – når noen holder musen over knappen, signaliserer dette til brukerne at de er på rett spor.

I tillegg til å fungere som guider på nettsiden din, kan disse livlige animasjonene brukes til å gi nettsiden din «det lille ekstra» – litt «glimt i øyet». Søk også gjerne opp «cinemagraph» på Google for å se hvordan du kan være kreativ med beskjedne effekter på bilder, som gir en mer spennende effekt enn bare en vanlig GIF (som også er bra til sine formål). Uansett hvordan du bestemmer deg for å bruke animasjoner – mikro-animasjoner kommer du til å se mye av fremover.

2) Mobile-first optimalisering

Med Googles utrulling av «mobile-first» i mars 2018 og oppdatering av mobil-hastigheten noen måneder senere, ble det laget noen nye grunnleggende regler for SEO-søkemotoren. Bot-ene til Google sjekker nå ut nettstedets mobile versjon før skrivebords-versjonen når det bestemmes hvordan nettstedet ditt rangeres i søkeresultatene. Det kan bety at mange nettsider der ute som ikke er responsive eller optimalisert for mobile skjermer etterhvert vil merke dramatiske fall i trafikk fra Google. Vel så viktig – laste-hastighet er også en faktor i hvordan de beregner rangeringen av mobile nettsteder.

Enkelt forklart: Et lynrask, fullt optimert og responsivt nettsted er nøkkelen til å forbedre søkeresultatene dine og bli funnet på Google av flere potensielle kunder og publikum.

Heldigvis er nettsidene vi lager for våre kunder i WordPress laget med et verktøy/tema som allerede optimaliserer for mobil. Flere temaer mangler dessverre fortsatt denne funksjonaliteten, og kan møte utfordringer i året som kommer om det ikke oppdateres. Det som derimot er viktig selv om temaet kommer med optimalisering er å passe på hvordan innholdet blir strukturert på mindre skjermer. Når du har strukturen, sørg for at du blir kvitt alt unødvendig innhold – da små skjermer kan bli overfylt ganske raskt. Her er hvordan Ryan Warrender, som jobbet som Mobile UX Manager hos Google, definerer riktig mobil-strategi: «En bruker bør vite hva han/hun skal gjøre og hvorfor han/hun skal bli på mobil-nettstedet ditt i løpet av ett øyeblikk.»

En god måte å finne ut hva som er nødvendig og ikke på mobil nettside er å sette deg selv i besøkenes sko: Noen har nettopp landet på siden din. Er dette elementet virkelig nødvendig for dem å ta den ønskede handlingen? Hvis svaret er «nei», kan du velge å skjule det fra mobilversjonen (dette er et enkelt valg med våre verktøy). 

3) Geometriske former

2019 er året hvor man være litt «crazy». Alt trenger ikke være rette linjer og faste former. Endelig inviterer vi litt kaos i nettside-verden. Eller, kontrollert kaos som vi liker å kalle det. Det er viktig å passe på at det er en tanke og struktur bak designet, og at dett ikke blir, vel, bare kaos. Gjort på rett måte kan former og fasonger av alle slag hjelpe å skape en uvanlig og «fresh» balanse og stil på nettsiden din. 

De rene linjene i klassiske trekanter, sirkler – eller til og med en rhombus eller sekskant hvis du føler deg frekk – kan gi en estetisk tiltalende fordeling på siden din, slik at du enkelt kan oppfylle design-prinsippene for balanse. Det er tre veier til denne følelsen av «likevekt»: symmetrisk, asymmetrisk, og radial balanse. Her er en rask oversikt over hva som innebærer:

Symmetrisk balanse: I denne klassiske tilnærmingen reflekteres elementene på den ene halvdelen av komposisjonen perfekt i andre halvdel.

Asymmetrisk balanse: Selv om de to halvdelene av siden ikke er matchende, har de begge en like «kraftig visuell vekt». Dette oppnås ved å spille på farger, teksturer, former og posisjoner av elementene som vises.

Radial balanse: Denne stilen plasserer også alle elementene i et design rundt et sentralt punkt, slik at de utstråler utover. Se gjerne for deg hvordan et fargehjul ser ut.

Vi digger at 2019 er et år vi kan få sjansen til å leke med litt asymmetri. Den lekne stilen er et symbol på modernisme og vitalitet, to spennende kvaliteter som er et velkomment syn i webdesign. Som vi nevnte ovenfor, er bruk av former en måte du kan oppnå et «kontrollert kaotisk» utseende på sidene dine. La oss si at høyre side av en side har masse tekst. En løsning for å stabilisere vekten er å bruke et spenstig design med rektangler til venstre. Når det er geometriske figurer du bruker, betyr det at stilen og ryddigheten føles intakt. Brukt riktig kan du ha et kreativt design på siden og fortsatt holde besøkende fokusert på det de skal fokusere på. Bland gjerne dette med mikro-animasjoner for en enda spenstigere effekt, men husk å ikke gå helt bananas… 

4) Lek med farger

Farger har vært, og vil alltid være et av de kanskje viktigste virkemidlene for å skape følelser, uttrykke meninger, og fange oppmerksomhet på et visuelt plan. Det betyr ikke nødvendigvis at man skal finne den mest «knallske» fargen og dekorere nettsiden for det den er verdt – men vær gjerne oppmerksom på de psykologiske effektene og tilknytningene bak en farge, og baser fargebruken din på følelsene du ønsker å formidle, hva som er standard for industrien og bransjen din, eller hvilken melding du ønsker å få fremheve. Når du har kartlagt fargen(e) for din nettside kan du begynne å planlegge hvordan du kan utnytte fargene til din fordel, og hvordan du skal bruke farger til å guide besøkende i riktig retning.

 Det er mange måter man kan bruke farge for å skape ønsket effekt, som for eksempel å fargelegge store områder av nettsidens topp-område på forsiden (kalles «above the fold» på fagspråket) for å utheve uttrykket og umiddelbart gjøre et inntrykk på besøkende. Dersom man liker å holde seg til trender, kan en for eksempel bruke årets farge for 2019 – Pantone forutser hvert år fargen som kommer til å bli en trend. Ønsker man litt mer diskré metoder å bruke farge på kan man f.eks bruke profilfargen på viktige knapper, linker, eller mindre elementer som skillelinjer, skygger osv. 

En annen fargetrend som er populær for tiden er å bruke komplementær-farger, altså farger som er det komplett motsatte av hverandre – som f.eks rødt og grønt. Ved å bruke komplementærfarger får man enda større kontraster enn om man bare bruker en farge alene, og kan på den måten fremheve budskapet enda tydeligere. Riktig bruk av farger er noe av det viktigste for å fremstå som en profesjonell nettside. Det anbefales å ikke bruke for mye farger, farger som er for like, eller farger som ikke passer sammen – da vil nettsiden fort se lite gjennomtenkt ut. 

5) Spennende fontbruk

Det er endelig på tide å bevege seg ut av (tekst)boksen og utforske andre fonter enn Arial, Times New Roman, Calibri. Det finnes en hel verden av tilgjengelige fonter der ute, og det er på tide å være litt modig og tøff – vær litt utradisjonell! Nei, vi snakker ikke om å bruke Comic Sans heller, den fonten har dessverre aldri vært noe særlig fin… Google fonts er et åpent font-bibliotek som brukes stadig vekk av webdesignere, og er en svær samling av fonter av alle mulige stiler. Verktøyet vi bruker for å lage nettsider har disse fontene lett tilgjengelige i modulene, så her er ingen unnskyldning for å være tradisjonell!

En økende trend for nettsider er å bruke skrift som viktige designelementer for å fange oppmerksomhet og utheve viktige ord eller uttrykk. Vi ser at skrift ofte brukes i alle fasonger – store bokstaver, unike fonter, opp/ned, vertikalt – det finnes lite grenser på hvilke virkemidler som brukes. Husk derimot at en grei tommelfinger regel er å ikke bruke mer enn 3 forskjellige fontstiler på en flate – så tenk gjennom hvilke font-par som forsterker merkevaren din før du setter i gang.

Ved å bruke fonter på riktig måte vil du kunne forsterke merkevaren, og tilegne visse fonter til visse formål slik at det hele oppleves som gjennomført og uttenkt. Ved å forholde seg til et visst fontbruk både på nettsider og trykte medier vil man skape en rød tråd slik at kunder/publikum kjenner igjen merkevaren din.

6) Video i topp av nettside

Bruk av video er ikke akkurat en nyhet innen webdesign trender, da video stort sett har vært på trendlistene de siste 5 årene. Grunnen til at video stadig dukker opp på trend-listene er at video utvikler seg, og man finner stadig nye spennende metoder å bruke video på. Video går kanskje litt i mot retningslinjene for å holde størrelsen på innholdet på en nettside lavt slik at det ikke går for hardt utover lastetid eller skader nettsidens SEO – men brukt riktig vil video veie kraftig opp mot disse «risikoene». Video er nemlig et av de virkemidlene som skaper størst engasjement hos besøkende til nettsiden, de fanger oppmerksomheten og gjør at folk er lenger inne på nettsiden – noe som igjen er veldig «tommel opp» fra Google. 

Det vi ser nå er at det er veldig mange som ser nytten i en video-banner på toppen av forsiden. Her kan man enten ha en fullverdig video som demonstrerer noe viktig en vil formidle, eller blande videoen med overlegg av tekst, former, farge osv slik at det hele blir litt mer «artsy». Videoer brukt på bannere før derimot ikke være større enn 10mb toppen, og helst ikke vare lengre enn 5-10 sekunder – men heller loopes (slik at de starter på nytt). Gjennom våre verktøy i WordPress er det enkelt å være kreativ med video-bakgrunner, og man kan få til mye spennende.

7) Runde hjørner og myke linjer

Man trenger ikke alltid være så firkantet. 2019 er året hvor formene blir rundere og mer abstrakte, og linjene mykere og villere. Vi beveger oss vekk fra de skarpe og harde linjene mot et mer koselig og mykt uttrykk. Tenk på det som forskjellen mellom en hard og myk madrass. En hard madrass føles seriøst og konservativt, mens en myk madrass kjennes god og koselig. Slike forskjeller i stil kan bety mye for hvordan dine kunder eller ditt publikum oppfatter deg. Er du en stiv og rett type, eller er du en myk og litt tilbakelent person? 

Det er mange måter man kan benytte seg av denne trenden på, og verktøyene vi bruker gjør det særdeles enkelt å lage former, gjøre kanter rundere, og myke opp harde linjer. Man kan også lage kreative figurer av bilder eller videoer. Kun fantasien setter grenser. 

8) Todelt skjerm (split-screen)

En relativt ny trend i web-verden er todelte design, eller split-screens, hvor man deler skjermen horisontalt og presenterer to forskjellige ting på hver side for å skape en interessant kontrast. Man kan enten skape balanse ved å bruke to fremtredende farger/elementer på hver side, eller man kan gå for en mer asymmetrisk versjon og ha et bilde på den ene siden og tekst på den andre siden. Alt etter hvordan man bruker denne effekten vil man kunne skape en spennende balanse mellom elementer, eller separere på en uvanlig måte. Allikevel skaper det hele en viss ro og pusterom på nettsiden om det blir brukt riktig, og man kan i tillegg introdusere et tredje element (som for eksempel tekst) som beveger seg over/på tvers av disse to elementene for å utfordre sansene litt. 

Ved å bruke split-screens skaper man en viss harmoni på nettsiden, og viser at alt trenger ikke nødvendigvis plasseres over hverandre slik man tradisjonelt gjør det. På denne måten kan man presentere to forskjellige elementer på en gang, og allikevel gi publikum pusterom til å ta inn begge sidene av skjermen. 

9) Beveg deg bort fra det tradisjonelle rutenettet  

Webdesignere skyr ingen midler for å vekke oppmerksomhet hos sitt publikum. Hvordan skal man skille seg ut fra de utallige nettsidene folk besøker hver dag? Det at man har under 2 sekunder på å fange oppmerksomheten til en som besøker nettsiden din gjør det ikke akkurat mer oppløftende. Heldigvis finnes det flere metoder å skille seg ut på, slik at besøkende stopper opp og tenker «hmm, dette var noe annet» – og flere slike hjelpemidler har vi gått gjennom på listen her allerede. Denne trenden blander litt fra de andre trender, og skaper et herlig organisert kaos – om man kan kalle det for det… 

Å overraske besøkende på nettsiden din med asymmetrisk design og uventede oppsett kan gi et inntrykk av at dette er noe de må kikke litt ekstra nøye på, ettersom det bryter med de forventede formene som man kanskje har når man besøker en nettside. Dersom en klarer å gjøre dette designet riktig, vil man kunne skape en nettside som er visuelt slående samtidig som den virker leken og tilfeldig. 

Tenk hvordan vanlige nettsider presenterer informasjon, og gjør så komplett motsatt. Gi de besøkende en grunn til å ville bla videre på nettsiden for å utforske mer av denne spennende nettsiden de har kommet over. Men pass på at det ikke gå «over-board» – alt design må ha en funksjonalitet, så ikke lag kaos bare for å lage kaos – men ha en plan på det hele. 

10) Omfavne minimalismen 

Nå har de aller fleste av trendene vi har diskutert over her vært nokså vågale i sin tilnærming til design og oppsett. Da føler vi det er viktig å avslutte med en trend som aldri går av moten – nemlig minimalismen. Fancy animasjoner og asymmetriske former hjelper lite om budskapet på nettsiden blir misforstått, eller om de besøkende går seg vill fordi du laget designet og «veibanen» for handling alt for kreativt (les: avansert). Det det hele handler om er å kunne lese målgruppen, og basere designet på nettsiden etter hva man ønsker å oppnå. Finn et design som forsterker merkevaren og budskapet ditt, og som målgruppen din forstår og kjenner seg igjen i. 

Riktig brukeropplevelse på nett er et stort tema og en trend i seg selv, og har fått begrepet UX/UI design, hvor UX står for user experience (eller UI for User Interface). UX handler om å finne riktig måte å kommunisere med publikum på digitale flater, og i tillegg øke konverteringer. Ved å fokusere på å engasjere publikum på digitale flater (spesielt nettsider), vil man bli oppfattet av søkemotorer som nettsider med innhold av kvalitet og derfor belønnet med høyere rangeringer i søkeresultater. Å holde publikum på nettsidene dine lenger er alfa omega for positivt utslag i SEO. 

Uansett hvilke metoder og trender du ender opp å benytte deg av, så ønsker vi lykke til med webdesignet og året som kommer! 

Er du klar til å teste ut dine design-ferdigheter med et enkelt og brukervennlig verktøy for å bygge nettsider, ta kontakt med oss for å snakke om ditt neste nettsideprosjekt!

Artikkelen er inspirert av denne artikkelen fra wix.com, som er en flott artikkel som beskriver trendene vi har diskutert over.