I.v.m. Coronavirus, verkorte openingstijden. Maandag en donderdag 9:00 – 14:00.

Web(design)trends voor 2020

Zo aan het eind van het jaar is het weer tijd om vooruit te blikken. Welke trends zetten door en van welke gaan we afscheid nemen? Ook dit jaar zie je weer her en der de lijstjes met web(design) trends voorbij komen. Hieronder een selectie van de meest genoemde trends.

Adaptive Design

desktop vs mobiel design van KLM

Bij adaptief design past je website zich automatisch aan het formaat van het apparaat. Met slimme CSS wordt dit geregeld. De meeste nieuwe WordPress templates hebben dit al. Maar in veel gevallen zal je handmatig moeten finetunen. Bedenk dat je op mobiel minder ruimte heb en wellicht moet versimpelen en alleen dat tonen wat belangrijk is.

Witruimte

veel ruimte om de beoogde actie – https://neilpatel.com/

Je hebt de standaard ‘witruimte’ om de elementen (tekst en beeld) maar dit gaat om extra ruimte toevoegen. Je kan dit loze witruimte vinden maar het creëert rust en kan richt de focus op belangrijke design elementen zoals een call-to-action.

Grote teksten en overlappende lagen

https://www.wagec.org.au/

Fullscreen websites met grote kleurvlakken en fonts van 80pixels. Kleurvlakken tegen elkaar, zwevende foto er onder of voor. Lagen die over elkaar heen gaan. Soms zie je een split-screen die dan weer bij elkaar word getrokken door een tekst die er in het midden over heen staat. Zelfs bewegend beeld over bewegend beeld heb ik al gezien.

Ook popups door middel van een lightbox zie je steeds meer. Tegenwoordig beeldvullend, zoals ook bij Neil Patel en zijn korte quiz van 3 minuten.

Een leuke manier om de grenzen van het 2D vlak op te zoeken. Als je de designregels (rust, structuur, leesbaarheid etc.) in acht neemt kan dit een mooie manier zijn om de aandacht van je bezoeker op te eisen.

Fullscreen formulieren

Invulformulieren op volledig scherm. Voor de zoveelste keer al je gegevens invullen kan heel vervelend zijn. Door er verder geen afleidende elementen te gebruiken kan het de gebruikerservaring verbeteren. Daarnaast is het goed om op micro niveau de bezoeker door het proces van invullen te loodsen. Bijvoorbeeld subtiel laten zien dat een veld goed of niet goed is ingevuld.

Of de feedback die je geeft nadat het formulier is verzonden, het zijn allemaal kleine details die het invullen van een formulier succesvoller doen laten verlopen.

Compositie van kleurvlakken en foto’s

afwisseling met foto’s en korte teksten – kleurbkennen.nl

Werken met kleurvlakken. Korte tekst en af te wisselen met foto’s. Zorg dat het een rustige compositie blijft met kleuren die passen in het kleurenschema van huisstijl. Hierboven een voorbeeld van een eigen ontwerp met dit principe.

Minimalistisch design

https://eessoo.co/

Het grid waar de ontwerper op werkt, de onderliggende lijnen en vlakken worden zichtbaar gemaakt door de randen een kleurtje te geven. De button heeft dan dezelfde kleur als de achtergrond of is transparante. Je moet er van houden. In sommige ontwerpen herken je de ontwerpen terug uit het begin tijdperk van de websites.

  • verdwijnende menubalk
  • weinig kleur
  • weinig grafische design (variates is font, kleur, grote)
  • weinig buttons (eerder een tekstlink)
  • zichtbare lijnen (i.p.v. een gekleurd paneel)

3D artwork in fluoriderende kleuren

https://useplink.com/en/

Deze trend is niet nieuw maar doordat de programma’s om ze te maken toegankelijker worden, komen ze meer voor. Het kan een mooie manier zijn om te aandacht op iets te vestigen.

Beweging en interactiviteit

The new sorting experience – http://garbage31.com/en/

De techniek verbeterd en wordt toegankelijker, waardoor er een explosie is aan allerhande interacties. Heel minimalistisch zoals een andere kleur van een knop als je er op klikt of bijvoorbeeld het parallax effect op een afbeelding als je scrolled. Maar ook interactieve spellen om je aandacht op een probleem te vestigen.

Deze techniek kan goed ingezet worden voor publiek met een korte aandachtspanne. Het gebruik komt heel nauw, want het kan juist ook ontzettend afleiden van de eigenlijke boodschap.

Waarom niet een verhaal vertellen in een animated gif van 5 seconden. Heb je meer tijd nodig, gebruik dan video. Maak korte video’s van max. 5 minuten, relevant voor de pagina waarop je het plaatst. Houd het bij 1 onderwerp, simpel, gebruik eventueel ondersteundende tekst.

Op maat gemaakte illustraties.

Beelden zijn allang niet meer een aanvulling op de tekst maar geven steeds vaker het verhaal zelf weer.

Je kan op zoek gaan op een vectorstock website, maar weet dat op maat gemaakte illustraties het beste gaan passen bij jouw merk. Handgetekende illustraties zeggen meer over je karakter dan een mooi geschoten foto. Keuze te over:

Pushberichten

Steeds vaker kom ik op een website die vraagt of ze me pushberichten mogen sturen. Zelf klik ik ze altijd weg omdat ik dan helemaal uit mijn flow zou raken, maar het zou maar zo voor jou kunnen werken. Het gaat sneller dan aanmelden voor een nieuwsbrief en je kan makkelijk een bericht sturen om aandacht te vragen voor een nieuw blog bijvoorbeeld. Meer weten?

Trends die gaan verdwijnen

  1. Werken met Parrallax afbeeldingen (Beeld verschuift zodra jij begint te scrolled) omdat dit de laadtijd van een pagina vergroot.
  2. Complexe designs – bezoeker heeft geen tijd om alles te bekijken en wil vlug de informatie.

Toekomstige trend

In de toekomst zodra het betaalbaar word en er verder op doorontwikkeld wordt, zullen we 3D of VR gaan gebruiken. Maar zo ver is het nog niet.

Audio gebruik zoals je nu met Amazone Alexa en de Google Home en Siri op de Mac al gewend bent zal toegepast worden binnen websites.

Doe jij mee met de trends?

Wellicht zit er tussen de trends ook een aantal die jou aanspreken. Wil je die gaan toepassen houd dan voor ogen dat het trends zijn. Sommige houden gelukkig wel wat langer aan zodat je design niet gelijk achterhaald is.

Zorg dat het webdesign in balans is en je niet helemaal doorslaat in de wow factor. Het uiteindelijke doel van jouw website is een goed beeld van jouw bedrijf neerzetten. Vertrouwen kweken en en verkopen van je product en/of dienst.


Studio Sandra Gortemaker

Studio Sandra Gortemaker richt zich op vrouwelijk ondernemers die graag ondersteuning willen in hun online marketing. Ik help je bij het opzetten van je WordPress website, landingspagina en/of salespagina en je MailChimp campagnes. Ik ben hierin jouw sparringpartner en coach.

Is er nog iets onduidelijk of heb je een andere vraag? Laat het me weten door een reactie achter te laten.

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

Contactgegevens

Btw-ID NL001413297B10
KVK 53368959

Let op: alle genoemde prijzen op deze website zijn excl. 21% btw

Post- en vestigingsadres

Timmermeesterslaan 44 8014 EM Zwolle

Bezoekadres / Kantoor

Esdoornstraat 3 8021 WB Zwolle

%d bloggers liken dit:

Alle (cookie)scripts worden geblokkeerd totdat je klikt op accepteren. meer info

Onderaan in de footer vind je een link naar mijn privacy- en cookiebeleid. Hieronder een korte samenvatting:

Alle gegevens die worden verzameld via Google Analytics zijn anoniem. Ik hoef hier geen toestemming voor te vragen, maar het is wel fijn om te weten dat ik dit gebruik.
Maak je gebruik van formulieren of de reactiemogelijkheid op deze website. Dan maak je automatisch de keuze voor het plaatsen van cookies. Het is niet mogelijk deze opties te gebruiken zonder het plaatsen van cookies. Uiteraard bewaar ik je mail of aanvraag niet langer dan nodig. Reacties en aanvragen via een formulier op worden opgeslagen op mijn website en in mijn Gmail.
Meld je je aan voor een MailChimp nieuwsbrief dan worden deze gegevens opgeslagen in mijn MailChimp account, totdat je jezelf weer afmeld.

Sluit venster