Webdesign trends 2022

In de voorgaande jaren zagen we vooral veel trends voorbij komen gericht op de lay-out van de website. Dit jaar verwacht ik dat de focus meer richting de content verplaatst gaat worden. De meest innovatieve webdesign trends heb ik voor je op een rij gezet. Maak je webssite beter en leuker!

1- Line Art-achtergronden

Webdesigners experimenteren al jaren met verschillende achtergrondtrends voor websites. Dramatische of juist subtiel kleur gebruik, kleurverlopen/gradiënten en natuurlijk videos’ worden veel gebruikt. In 2022 verwacht ik veel van Line art. Dit is op slimme of subtiele wijze lijnen verwerken in de achtergrond van je design. Je kan hier hier denken aan cirkels zoals hieronder in afebeelding getoond wordt maar het kan ook als navigatie gebruikt worden zoals in het voorbeeld van crusta.fr. Dit voorbeeld kun je vinden onder punt 5.

Line-art kan worden gebruikt om visuele interesse te creëren, maar ook om bezoekers nuttige begeleiding te bieden. Ideaal om in je content sturing en focus aan te brengen.

De cirkels in de twee hoeken trekken op hun eigen manier de aandacht. Van nog groter belang is hoe de vormen naar binnen buigen. Daarbij leggen ze meer nadruk op het boekingsformulier in het centrum.

2 – Interactieve muis aanwijzers

Waarom zou je een saaie standaard cursor gebruiken, als je deze kan aanpassen tot een gave eyecatcher! Door je cursor te laten veranderen, grijp je de aandacht van je bezoekers. Door dit speelse effect vergroot je de kans dat bezoekers langer op je website ronddwalen.

Wat ik vooral goed vind aan deze trend  is dat het de user experience en usability ten goede komt. De bezoeker krijgt direct feedback vanuit de website.

Hier een voobeeld van Jadesheng studio

Hieronder een voorbeeld van lironmoran-interiors

Deze site gebruikt het met nog een extra element. Je krijgt niet alleen feedback door de grootte verandering maar ook door de tekst die in de muisaanwijzer cirkel te zien is. Heel cool gedaan.Videospeler

3 – Exclusieve illustraties

Afgelopen jaren zagen we de  opmars van illustraties en animaties in de lay-outs van websites, met name om onderscheidend te kunnen zijn. Bijzonder illustraties zijn een goede manier om je te onderscheiden met unieke content.

4 -Organische vormen

Organische of vloeiende vormen zijn alles zonder rechte lijnen. Denk aan de vormen die in de natuur voorkomen, zoals heuvels, de randen van een meer of rivier, en hoe ze asymmetrisch en kronkelig zijn.

Vloeiende vormen zijn een geweldige manier om delen van een website op te splitsen zonder harde lijnen of hoeken. Ze zijn ook geweldig om op de achtergrond te gebruiken en geven balans en identiteit aan je site.

5 – Animatie en 3D movement

Van alle trends verwacht ik hier wel het meeste van. Van micro-interacties tot deeltjesachtergronden, we zijn jaar na jaar getuige geweest van de stijgende populariteit van animatietrends. Door nieuwe technieken zijn er weer meer mogelijkheden gekomen. Voor het jaar 2022  worden web animaties steeds geavanceerder en steeds creativer.  Door de scheiding van pagina-elementen in voorgrond en achtergrond extremen, het creëren van een indrukwekkende parallax effecten.

Hieronder gebruikt crusta.fr video animatie als effect en heeft letterlijk een rode lijn als rode draad door de site lopen. Ook deze is geanimeerd. De onderliggende content elementen komen mooi elegant tevoorschijn wanneer je naar beneden scrollt.


https://monopo.london

Monopo gebruikt een mix van trends. De gradient achtergrond, grote fonts en muis-aanwijzer effect als binnenkomer en als je scrolt komen de elementen met veel beweging over je scherm. Voor de contact pagina wordt weer een zwart-wit layout gebruikt.

Als laatste wil ik nog webshop https://seed.com/ laten zien.

Mooie sectie overgangen als je naar beneden scrolt. Mooie fotografie. Alles helemaal in de ‘green environment look’. Heel elegant gedaan.

Vertical movement up, opactiy-changes, zoom in – out transities. Allemaal toffe technieken om je website beter te laten opvallen tussen de concurrenten.

Jezelf onderscheiden, meer betrokkenheid creeren en uiteindelijk meer conversies.

Samengevat kun je zeggen dat met de nieuwe webdesign trends van 2022 er meer mogelijkheden zijn, vooral om meer de focus op de content te verkrijgen. Met een goed plan zal dit leiden tot meer betrokkenheid en conversies. Al zin om de nieuwe trends in je eigen website (shop) terug te zien?

André den Breejen
André den Breejen

Wil je weten wat Impress voor jouw website kan betekenen?

Bel of mail mij voor een vrijblijvend gesprek.

Webdesign trends 2021

Welke trends zullen er doorbreken en zijn kansrijk voor het nieuwe jaar 2021? Wat moet er worden gewijzigd om de gebruikerservaring te verbeteren?  We hebben de meest innovatieve webdesign trends voor je op een rij gezet.

1 – Dark mode

Gaan we weg van de eeuwige witte achtergrond?Een donkere achtergrond is prettiger voor de ogen en veel telefoons kun je nu switchen tussen dark mode en je normale weergave. Dit helpt ook mee met deze trend. Een aantal jaar geleden melde ik al dat een donkere achtergrond een goede manier is je te onderscheiden in het landschap van witte achtergronden. Je website in dark mode? Een donkere achtergrond hoeft niet persé zwart te zijn.

Ik denk de witte achtergrond zal blijven maar in 2021 zullen webdesigners meer het hele scala tussen wit en zwart gaan gebruiken.

Onze werelden zijn luidruchtig, Zoom en teams vermoeidheid is een ding. In 2021 wordt webdesign weer “één taak tegelijk” om afleiding te voorkomen en interacties comfortabeler te maken. Donkere achtergronden helpen hierbij.

Voorbeeld – Youtube in dark mode

‘2 – Animaties en interactie

Van micro-interacties tot deeltjesachtergronden, we zijn jaar na jaar getuige geweest van de stijgende populariteit van webgebaseerde animatietrends. Door nieuwe technieken zijn er meer mogelijkheden gekomen. Voor het jaar 2021’s worden web animaties steeds complexer door de scheiding van pagina-elementen in voorgrond en achtergrond extremen, het creëren van een indrukwekkende parallax effecten. 

Deze trend van animaties heb ik opgedeeld in 3 subsecties.

A  . Parallax animatie

Parallax technieken komen en gaan een beetje. Het is de kunst om de juiste balans hiermee te zoeken anders vlieg je makkelijk uit de bocht. Door de nieuwe technieken kan er meer en zie de parallax weer opkomen. Als je een ‘wauw effect’ voor je website zoekt is dit zeker een goede techniek om te gebruiken.

B  . Micro animatie

Een trend die al wat langer bestaat maar naar mijn mening een blijvertje wordt zijn de micro animaties. Uit de markt is er een groeiende vraag naar meer interactie met de gebruiker. Micro aninmaties zijn perfect om meer interactie te creeren.
Meer voordelen zijn ; Je houd de aandacht langer vast. Een goede manier om de gebruikers vriendelijk en toegankelijkheid te verbeteren.

C  . Scroll animatie

Wanneer gebruikers scrollen, doen ze meer dan navigeren op de pagina: ze werken met elkaar samen. De fysieke acties die ze in het echte leven uitvoeren ( met hun vingers over de muis – veroorzaken een reactie op het scherm. Interactie is een vorm van participatie, en wanneer gebruikers betrokken zijn bij dingen die gebeuren, zijn ze meer kans om geïnteresseerd en betrokken te zijn.

3 – Big Fonts

Gedurfde typografie is trendy. Met zware, vetgedrukte lettertypen is een bezoeker zich direct bewust van je boodschap. Combineer deze grote lettertypen met sterke kleuren. Geen nieuwe trend maar wel een die aan het doorbreken is voor groter gebruik.

big fonts voor websites

4 – Vergroten van Usability

Toegankelijkheid en vereenvoudige werking van websites en webshops

Sinds de uitbraak van het coronavirus gaan steeds meer ouderen (65+) online hun aankopen doen.  Hierdoor stijgt de behoefte aan meer gebruiksvriendelijke websites.  Er is nog genoeg te verbeteren aan de leesbaarheid, het contrast tussen content en achtergrond, de grootte van lettertypes en vereenvoudiging van een aankoop proces.

5 – Overstap naar SVG (en WebP)

Afbeeldingen, logo’s en illustraties worden vaak in jpeg og png formaat getoond in websites. Het probleem is dat deze op grotere schermen onscherp kunnen worden.
Het formaat SVG (vector based) lost dit op. Voordeel is ook dat deze kleiner van formaat zijn waardor je laadsneldeid mobiel ook verbeterd. Voor dit doel voor afbeeldingen ook steeds meer in webP formaat gebruikt.
svg en webp in websites

6 – Asymmetrisch webdesign

Deze trend is zeker niet nieuw. In mijn blog van 2019 schreef in hier al over. Wat we nu wel zien is dat dit meer in opkomst komt. Men wil wat meer af van de standaard rijen en kolommen. Er mag wel wat meer fantasie en speelsheid in. 

In een kort kun je zeggen dat met de nieuwe  webdesign trends van 2021 je beter kunt onderscheiden en je gebruikersvriendelijk vergroten. Met een goed plan zal dit leiden tot meer betrokkenheid en conversies.

André den Breejen
André den Breejen

Wil je weten wat Impress voor jouw website kan betekenen?

Bel of mail mij voor een vrijblijvend gesprek.

Trends in webdesign 2019

Het goed om te weten wat gebruikers in 2019 verwachten van je website.
Webdesign ontwikkelt van statisch naar vloeibaar, van keurige rijtjes naar asymmetrisch design.
Er is behoefte aan creativiteit, maar de gebruiksvriendelijkheid blijft doorslaggevend.
Impress zet de belangrijkste trends in webdesign voor je op een rij.

Clean design

Veel witruimte is het kenmerk voor website met een clean design. Witruimte is eigenlijk de ruimte gebruiken om de elementen.  Dit is zeker niet nieuw maar je ziet dat het steeds meer en meer terugkomen in de nieuwste websites.
Voordeel van clean design is dat de elementen secties veel beter tot zijn recht komen. Zo krijgen de content elementen meer ‘breathing space’ wat meer rust geeft.
Minder afleiding , meer conversie.

Website: A1 interieurstyling (in progress)
Meer voorbeelden van clean design

Weg met de Symmetrie

Het hoeft allemaal niet meer mooi naast en onder elkaar. Variatie in breedtes en hoogtes, diagonale strepen, blokken en overlaps. Het mag allemaal.  Gebruik de fantasie en creativiteit.

Micro design

Micro design is de aandacht voor het losse elementen op de pagina. Hieronder vallen ook de micro aninmaties. Micro-animaties zijn zichtbare, maar tegelijkertijd subtiele bewegingen die duidelijk maken dat er iets verandert. Met micro design kun je slim ruimte benutten, je pagina interessanter maken en de aandacht van je bezoeker vasthouden of sturen.

Color my site!

Het minimalistische design lijkt wat te zijn doorgeslagen. Vrijwel geen kleur, wat iconen en een logo. Soms weet niet eens meer op welke site je nu bent.
Er is een tegenreactie gaande en je ziet dat felle en harde kleuren steeds vaker om de hoek komen kijken.

Een mooi voorbeeld is Soapmedia.co.uk.

André den Breejen
André den Breejen

Wil je weten wat Impress voor jouw website kan betekenen?

Bel of mail mij voor een vrijblijvend gesprek.

Trends in webdesign 2018

Webdesigners hebben de opdracht om onderscheidend te zijn in ontwerp en dit te combineren met optimaal gebruikersgemak. Zonder goede vormgeving zal zelfs de beste content een stuk minder aantrekkelijk worden. Daarom is het goed om op de hoogte te zijn van de nieuwste trends op het gebied van webdesign.Welke trends zijn er in opkomst en wat gaan we in 2018 meer zien? Impress zet de 6 belangrijkste webdesign trends voor je op een rij.

1. Uitgesproken typografie#

Big, Bold, cutouts, en het gebruik van meer verschillende fonts.
Typografie zal meer gebruikt gaan worden als ‘design-element’. Het vervangen van afbeeldingen door tekst wordt steeds meer toegepast.
Een gewaagd of uitgesproken font geeft een merk persoonlijkheid en zorgt voor de juiste sfeer. Meer dan ooit zullen merken en ontwerpers de grenzen opzoeken van de typografische mogelijkheden om websites nog aantrekkelijker te maken
Voor mobiele schermen heeft dit ook een meerwaarde, want minder afbeeldingen betekent een (nóg) snellere website!

bepatrickdavid.com

latinmedios.com

2. Minimalisme

Een minimale vormgeving is een bestaande trend, die we in 2018 nog sterker en vaker terug gaan zien. De tijd van ‘flashy’ webdesigns vol met versieringen en overvolle websites is voorbij. Dat leidt ten slotte alleen maar af.
Door teksten en elementen met veel ruimte (ook wel negatieve space genoemd) te gebruiken wordt de centrale boodschap beter benadrukt.

areatresworkplace.com

3 . Splitscreen

Nog een mooie webdesign trend als je het ons vraagt: “splitscreen” websites. Deze websites zijn zo opgebouwd dat er 50/50 van het scherm gebruik wordt gemaakt. Het linkergedeelte van het scherm contrasteert dus duidelijk van het rechter gedeelte van het scherm. Heel geschikt om bezoekersstromen te leiden en onderscheid te maken in je doelgroepen. Splitscreen kan ook goed gebruikt worden bij landingspagina’s.

Adidas.com

4. Mobiel webdesign first / Mobiel eerst

Steeds vaker browsen we op onze telefoon in plaats van een computer of laptop. Dat is geen nieuwe trend, maar we gaan nu wel merken dat er een kantelpunt is bereikt. Gezien het aandeel internetgebruikers op mobiel is het steeds logischer om dit kleine scherm als uitgangspunt te gaan nemen bij een nieuw ontwerp. En je dus niet langer als eerste te baseren op een desktopversie.

                  alautoverhuur.nl

5. Cinemagraphs en de opkomst van GIF afbeelding

Cinemagraphs bevinden zich precies tussen foto’s en video’s in. Niet zo zwaar en traag als video, maar wel opvallend en dynamisch. Het geeft niet alleen een heel cool effect, maar het is een mooie tool om een sfeer te creëren of een bepaald aspect op je website te accentueren. Zo hou je langer de aandacht van je bezoeker vast.

Subtiele bewegingen zijn al genoeg om de aandacht te trekken

GIF
De gif is weer terug. Animated GIF afbeeldingen (oftewel Graphic Interchange Format) heeft misschien een wat ouderwets imago maar wordt bij websites steeds vaker gebruikt.
Met een gif afbeelding kan bijvoorbeeld een proces of actie duidelijk worden uitgelegd.

6. Kleur Verlopen (Gradients)

Overal zijn gradiënten te vinden. Met gradients kun je goed een stijlvol effect meegeven aan een element. De typografische trends in 2018 leunen zwaar op het feit dat de letters zelf het verloop hebben in plaats van de achtergrond. Gradients worden ook steeds meer toegepast in achtergronden, al dan niet in combinatie met een afbeelding. Door het driedimensionaal effect krijg je meer diepte in de site. Hoe dan ook, verwacht in 2018 veel kleur.

André den Breejen
André den Breejen

Wil je weten wat Impress voor jouw website kan betekenen?

Bel of mail mij voor een vrijblijvend gesprek.

Top 5 Webdesign trends 2017

Wat zijn de trends in webdesign voor 2017? Hier een top 5 van de meest interessante trends.

1. Cards design

Een geweldige manier om veel informatie weer te geven. Door gebruik te maken van vlakken blijft het overzichtelijk en behapbaar. Het is ook perfect voor responsive design. Blijft overzichtelijk in elke grid.

Cards design

2. Minimalist design

Wat we tegenwoordig steeds meer zien is het zogenaamde minimalistisch design. Het ontwerp wordt ontdaan van alle afleiding. De focus komt meer op de inhoud en boodschap te liggen. Het voordeel van dit ontwerp is dat het tegelijk een stijlvolle uitstraling krijgt.

Clean en geraffineerd waarbij de boodschap sterk overkomt. Less is more.

3 . Material design hybrid / Flat 2.0

De trend was en is flat design . Gestript van schaduwen, structuren en achtergronden. Alles super strak. Flat design wordt nog veel gebruikt maar je ziet dat de stijl wat verschuift. Google is met material design gekomen. Dat brengt een beweging op gang. Nu mag er weer wat meer diepte inkomen. Flat wordt gecombineerd met lagen en subtiele schaduw effecten.

4. Dynamic Typography

Grote lettertypes. Simpel en sterk. Maar nu laat je het bewegen. Kan in hoge resolutie en blijft goed voor je pagespeed. Dynamic Typography kan een krachtig middel zijn om je brand of boodschap over te brengen.

Dynamic Typography

5. Illustrations

Een goede manier om weg te blijven van stockfoto’s en je site een eigen gezicht te geven. Illustraties zijn fun, onderscheidend en geven veel mogelijkheden.

 Illustrations
André den Breejen
André den Breejen

Wil je weten wat Impress voor jouw website kan betekenen?

Bel of mail mij voor een vrijblijvend gesprek.