Webdesign trends i 2016

Hvad rører sig derude

Hjemmesideejere har for alvor fået øjnene op at hjemmesider ses mere og mere på telefoner. Det præger udviklingen af webdesign at designere og andre fagfolk nu endelig kan fokusere på telefonen som primær enhed. Men det er ikke bare fryd og gammen – der er mange ting der skal prøves af. Det betyder at nogle teknikker vil fejle fælt, mens andre vil blive toneangivende.

Det er egentlig beskrevet lige på kornet i denne kommentar til et indlæg på reddit.com:
“The web is experiencing what I would consider to be it’s ‘80s. So many new options and capabilities are available and everyone is going crazy finding ways to add it all to their site. So now we have a bunch of shit that we all think looks great but is extremely unusable.”

Men hvilke teknikker er så de mest lovende?
Næsten alle er enige om at responsive design er i fokus. Men brugervenlighed (usability) og loadtid er – igen – blevet vigtige faktorer. Allerede nu er der mange hjemmesider der ikke load’er med det samme, men har en lille ‘vente-animation’ kørende i nogle sekunder. Der har også været tendens til at forvirre brugernes adfærd men meget ’støjende’ designs og funktioner.

For et par år siden begyndte et helt fladt design (Flat design) at dukke op. Nogle kalder det også disney-design fordi det ligner noget fra en tegnefilm. Det flade design har flere fordele. Det er, i modsætning til fotos, hurtigt at hente på alle forbindelser og det er meget udtryksfuldt.
Google har lanceret et designsprog, Material Design (design.google.com), som er Flat design henvendt til egentlige mobil-hjemmesider. Men nogle er begyndt at bruge det som gennemgående design til almindelig sider også.
Se eksempler med en Google billedsøgning på: web design flat design

Flat design hænger sammen med en anden trend som mange også hilser velkommen, nemlig stærke farver. Denne trend håber jeg tager til. For så kan jeg støve min elskede farvepsykologi af, og holde lange taler for alle der gider lytte.

Det visuelle indtryk (grafik og fotos) får ubetinget størst opmærksomhed, når designere snakker om fremtidens design. Måske fordi designere sjældent fokuserer på content marketing. Men det nye i dén dialog er at man er på vej væk fra enorme fotos og videoer, der gør siden langsom, og hen imod flere små animationer.
Det kan være alt lige fra gif-billeder og hover-effekter på billeder til det klassiske slideshow. En under-trend er Micro Interactions, der er ‘ting som bevæger sig’ eller reagerer på brugernes handlinger på siden. Et eksempel: klik i søgefeltet på http://searchenginewatch.com og læg mærke til luppen. Det er en lille ubetydelig bevægelse, men den gør en ellers tam side lidt mere dynamisk og levende. Tænk hvis alle handlinger (klik, scroll, formularer, billedevisninger, mouse over) blev akkompagneret af en lille animation.

Hvad er HELDIGVIS på vej ud?
Af en eller anden grund har Pop ups haft en renæssance – noget som alle (alle!) var blevet enige om var rigtig træls på en hjemmeside. Jeg tror det er startet med den mere de afdæmpede slide ups, der kommer frem nede i det ene hjørne af hjemmesiden, og opfordrer til at skrive sig op til nyhedsbrev eller købe noget.
Men som det tit sker, har det taget overhånd, og nu er de rykket op midt på skærmen igen. Men heldigvis er brugevenlighed igen blevet et buzzword. Og dermed er irriterende ‘opråb’ på vej ud.

Jeg har altid været stor fan af simple designs, og derfor er det glædeligt at store ikke-brugervenlige fotos er på vej væk igen. De fylder hele skærmen, tager lang tid at load’e og de forstyrrer budskabet. Jeg mener ikke at man kan/skal sælge kurser med et billede af en bjergtop. Men så er vi på vej over i en anden snak.

** NØRD ALARM **

Siden Google Fonts kom til er vi endelig på vej væk fra de evindelige fem valgmuligheder. Det åbner for en noget mere spændende fremstilling af teksten, der kan gøre indhold både søgevenligt og brugervenligt. Jeg kan allerede spotte en tendens til at overgøre det med kryptisk og ulæselige fonts (Typisk! #RullerMedØjnene). Det gamle paradigme om at fonts til indhold skal være UDEN føder på en skærm gælder stadig.

For hver opdatering af diverse browsere bliver CSS3 mere og mere anvendeligt. Det er næsten som at finde Tutankhamun grav hver gang en ny declaration bliver standard.
Sidebemærkning: Farvel, IE. Jeg kommer IKKE til at savne dig! (husk at fjerne den)
CSS3 åbner for en masse animerede visninger af billeder og elements, som gør siden spændende og dynamisk uden at koste dyrebar loadtid. Se mere på http://caniuse.com/#cats=CSS

Cinemagraph er forholdsvis nyt, men (sammen med gif’s genfødsel) må betegnes som det nye sort. Det passer perfekt ind i alle de ovenstående trends. Samtidig er det en meget æstetisk måde at give dynamik til en hjemmeside – hvis det bliver brugt rigtigt.
Se eksempler her: http://www.quertime.com/article/arn-2011-11-22-1-top-40-stunning-and-impressive-cinemagraphs-photography-in-motion/
Her er en guide: http://blog.spoongraphics.co.uk/tutorials/how-to-make-a-cool-cinemagraph-image-in-photoshop

Kilder
Ud over utallige søgninger, blogindlæg, nyhedsbreve og samtaler med kunder er der brugt disse kilder til dette blogindlæg:
awwwards.com, creativebloq.com, itworld.com, grayboxpdx.com, caniuse.com, searchenginewatch.com, w3schools.com, reddit.com, google.com, forbes.com, themeforest.net

Internettet er vejen frem. Vil du med?

Sammen kan vi gøre det!

Jeg deler ud af alt der kan hjælpe dig videre med din hjemmeside - lige her:

Din hjemmeside er som en håndværkers bil

På de fem sekunder afgør den besøgende om du har styr på dit shit! Ved du overhovedet hvad du laver?

Læs mere

WooCommerce 3.0

Læs mere

Gratis e-bog: 12 automatiske mails

Læs mere