Webdesign trends waar je niet omheen kunt

Geschreven door We Provide

Webdesign wordt nóg belangrijker dan het voorheen al was. Nóg belangrijker? Kan dat? Ja dat kan 😉 Webshops en websites proberen zich steeds meer te onderscheiden ten opzichte van bijvoorbeeld hun concurrenten met behulp van een spannend of creatief webdesign en maken daarbij graag gebruik van webdesign trends. Een (nieuw) slim webdesign is immers één van de middelen om je te onderscheiden van je concurrenten. Maar ook een middel waardoor jouw merk bij bezoekers blijft hangen en deze mogelijk eerder voor jou kiest.

Overweeg jij een nieuw webdesign? Of wil je alleen een beetje inspiratie opdoen voor een nieuw webdesign? Dan zit je goed! We hebben een aantal webdesign trends voor je op een rijtje gezet.

Webdesign trend #1: Asymmetrische en gebroken grid layouts

Een trend die zich eerder al heel duidelijk liet zien, is het gebroken of een asymmetrisch grid. Een grid bestaat normaliter uit 12 hulplijnen die een ontwerp gemakkelijker te bouwen maken. Zolang je binnen deze lijnen blijft, is het voor onder andere een developer gemakkelijker een webshop te bouwen. Veruit de meeste webshops en websites blijven ‘netjes binnen deze lijntjes’ van het grid in het webdesign waar zij gebruik van maken. Vaak is dit ook een kostenoverweging.

Afwijken van de standaard

Maar deze trend gaat juist over de afwijking van deze grid-standaarden. Bij deze asymmetrische trend lijkt het net of de blokken niet helemaal ‘juist’ in het grid staan. Dus niet meer strak naast elkaar of netjes geordend. Door de blokken of afbeeldingen bewust buiten het grid te plaatsen, creëer je een speels en uniek effect. Fijn effect voor marketeers is dat er meer focus op de content komt door gebruik te maken van deze trend.

Afb. 1 – Voorbeeld asymmetrisch ontwerp bij Movico

Webdesign trends waar je niet omheen kunt - gebroken grid

Asymmetrie bij Movico

In het voorbeeld op de website van Movico die we recent gebouwd hebben, zie je heel duidelijk dat de blokken niet netjes naast elkaar zijn gepositioneerd wanneer je binnen komt op deze website. Er is niet zozeer gebruik gemaakt van een ‘standaard’ grote header die je in de meeste websites verwerkt ziet. Maar er is gebruik gemaakt van verschillende ruiten. Door de speelse manier waarop de blokken gepositioneerd zijn, is een licht design gecreëerd dat ademt. Bovendien roepen de ruiten die je bij Movico terugziet op tot interactie. Achter een aantal van deze blokken bevinden zich contentpagina’s of productpagina’s die je meer informatie geven.

Webdesign trend #2: Animaties en micro interacties

Het toevoegen van micro interacties of animaties is iets dat niet altijd een heel groot effect lijkt te hebben (mirco is immers niet veel ;). Maar toch kunnen deze subtiele animaties een groot effect hebben op de gebruiksvriendelijkheid van je website of webshop.

Door gebruik te maken van interacties op bijvoorbeeld een conversieknop wordt een klant onbewust extra getriggerd op deze knop te klikken. Een goed voorbeeld van een micro interactie die zorgt voor een groot effect zijn animaties die aangeven dat een pagina aan het laden is of die aangeven dat je bestand geüpload wordt. Het liefst zelfs met percentage vermelding of statusvermelding zodat je ziet hoever het bestand al geüpload is.

Laadtijd aangeven

Het al oude zandlopertje is inmiddels herhaaldelijk opnieuw uitgevonden en heeft door de jaren heen een behoorlijke upgrade gekregen. Tegenwoordig komt je vele verschillende vormen tegen, maar vaak zie je een cirkel die langzaamaan geheel gevuld wordt. Naast deze micro interactie zijn er nog honderden andere mirco interacties ontworpen. Stiekem zie je ze dan ook terugkomen in veel webshops of websites. Zeker wanneer je er op let. Een aantal voorbeelden van micro interacties heeft de website Smashing Magazine gebundeld.

Afb. 2 – Voorbeeld animatie bij Movico

Webdesign trends waar je niet omheen kunt - mini animaties

Ook voor de website van Movico hebben we gebruik gemaakt van animaties en micro interacties. Zo is ervoor gekozen het menu (dat achter een hamburgerknopje zit aan de rechterbovenzijde) met behulp van een animatie aan te roepen. Met dit effect is een simpele actie als het openen van een menu ‘bijzonder’ geworden. Een ander, iets subtieler effect dat is toegevoegd, is het oplichten van CTA buttons wanneer je daar overheen hoovert. Dit subtiele effect is een micro interactie die je moet overhalen eerder op deze knop te klikken. Het triggert je onbewust en zorgt ervoor dat je eerder geneigd bent te klikken op deze knop.

Webdesign trend #3: Focus op typografie

“Big, bold typography” is ook een webdesign trend die je veel gaat zien. Hoe trek je namelijk op een eenvoudige en toch originele manier de aandacht naar de inhoud van de tekst? Nou, door gebruik te maken van verschillende typografieën. Zeker wanneer je grotere hoeveelheden tekstuele content verwerkt in je website of webshop, is het aan te raden gebruik te maken van verschillende soorten en/of grootte typografieën.

Afb. 3 – Voorbeeld typografie bij Movico

Webdesign trends waar je niet omheen kunt - typografie

Wanneer je bovendien een gedurfde typografie combineert met een afwijkend grid en daar ook nog een animatie aan toevoegt, combineer je niet alleen de 3 webdesign trends die wij hiervoor genoemd hebben, ook creëer je een speels effect op je website of webshop dat bezoekers laat interacteren met je content. Je boodschap komt niet alleen beter over, ook is de kans dat bezoekers doorklikken en daadwerkelijk je content consumeren groter.

Webdesign trend #4: Kleurgebruik

Kleuren en dan specifiek populaire kleuren online veranderen regelmatig. Waar het een aantal jaren geleden heel normaal was dat je pasteltinten gebruikte, kiezen we nu massaal voor uitgesproken, felle kleuren die knallen.

Verschuiving in kleuren

Een verschuiving die je misschien al wel eerder hebt gezien. Een tijdje geleden kozen we voor kleuren die eigenlijk niemand als lievelingskleur heeft: oud roze, baby blauw of licht groen. Maar dit is niet langer het geval. Nu kiezen we massaal voor felle kleuren die opvallen. Kleuren die van je scherm af knallen en die je helpen bij het overbrengen van je content. Een knop moet niet langer een zachte kleur hebben en opgaan in je ontwerp, maar heeft eerder een neonachtige kleur zodat deze opvalt. Misschien zelfs een beetje vloeken met je design.

Afb. 4 – Voorbeeld kleurgebruik bij Movico

Webdesign trends waar je niet omheen kunt - kleurgebruik site

Ook bij Movico is gekozen voor een wat meer sprekend kleurenpalet inherent aan hun huisstijl. Het geel, in combinatie met zwart, knalt van je scherm. Met deze huisstijl maakt Movico gebruik van een felle, neonachtige kleur als hoofdkleur die spreekt. Geheel in lijn met deze trend dus.

Conversiegericht webdesign

Naast deze webdesign trends zien wij ook dat het rendement van een goed webdesign meer aandacht krijgt. Meer en meer zien webshop of website eigenaren in dat een goed webdesign bijdraagt aan het succes van een shop of site.

Invloeden vanuit conversieoptimalisatie en gebruiksvriendelijkheid worden steeds belangrijker. Vanuit development of online marketing worden daarnaast steeds meer eisen aan een webdesign gesteld. Zo kan de positionering van een conversieknop op de juiste locatie van deze knop in een webshop, het verschil maken tussen een succesvol of een niet-succesvol ontwerp. Al blijft webdesign natuurlijk een eeuwig compromis tussen een esthetisch verantwoord design en deze commercie invloeden. Een compromis waarin de balans juist moet zijn.

Ondersteuning bij een (nieuw) webdesign

Bij We Provide zijn wij supersterk in het bouwen van websites en webshops. Met onze ruime ervaring op het gebied van webdesign en development kijken wij dan ook graag met je mee naar een gebruiksvriendelijk, esthetisch verantwoord webdesign voor jouw webshop of website. Benieuwd naar de mogelijkheden? Neem dan eens contact op.

Op onze webdesign pagina kun je overigens meer informatie vinden over onze webdesigns. Hoe een nieuw webdesign tot stand komt en wat daar allemaal bij komt kijken.

Benieuwd naar wat wij voor jou kunnen betekenen?

  • Supersterk in websites, webshops èn apps
  • Ruim 10 jaar online ervaring
  • In-house development, design & marketing
  • Volledige ondersteuning
of+31 (0)88 6000 700