Webdesign is voortdurend in ontwikkeling. Doordat de technologie steeds verbetert en ontwerpers blijven experimenteren met nieuwe stijlen, zien we elk jaar weer nieuwe coole trends in de online wereld. Aan de hand van de designs die we de afgelopen jaren hebben gezien, en van de nieuwe technologie die momenteel wordt ontwikkeld, is het mogelijk om te voorspellen wat er in de loop van 2020 gaat gebeuren.
Laten we dus snel kijken naar de ontwikkelingen op het gebied van design. We gaan de opkomende stijlen onderzoeken met als doel een idee te krijgen van wat we de komende jaren kunnen verwachten.
Waarom moet je de trends überhaupt volgen?
Niet elke rage in webdesign is serieus te nemen, zoveel is zeker. Alles heeft zijn tijd en plek en het zonder reden verbouwen van je website kan meer kwaad dan goed doen, vooral als het ten koste gaat van bruikbaarheid en UX.
Maar hoewel je je site niet zonder serieuze overweging een facelift zou moeten geven, is het zeker slim om de trends in webdesign in de gaten te houden, vooral als deze gebaseerd zijn op technologische vooruitgang.
Als je bijvoorbeeld nog niet hebt gehoord van AI-chatbots, progressieve web-apps of CSS-rasters, dan is de kans aanwezig dat je gebruikmaakt van verouderde technologie en daarmee conversies misloopt. Denk eens aan hoe revolutionair responsief design was en wat het teweegbracht op het internet; je wil de boot niet missen als er weer zo’n ontwikkeling plaatsvindt.
Zelfs als de trends puur esthetisch zijn, is het nog steeds zinvol om ze bij te houden. Een simpele, witte en eenvoudige website kan bijvoorbeeld functioneel zijn. Maar we zien ook dat avant-gardistisch webdesign een trend is van de laatste jaren, waardoor gebruikers een volledig witte site als snel saai vinden.
Zelfs kleine wijzigingen, zoals het toevoegen van meer kleur, gebroken rasters of animaties bij micro-interactie, kunnen je site up-to-date houden.
Naarmate de tak van webdesign zich ontwikkelt en zich nieuwe technologieën eigen maakt, zie je dat een deel van deze ontwikkelingen en trends zeker wat toevoegen voor zowel schoonheid als functionaliteit. Ga eens 10 of zelfs 20 jaar terug in de tijd. Herinner je nog hoe de sites er toen uitzagen? We hebben sindsdien een lange route afgelegd… en we zijn er nog lang niet.
Kom je een moderne webdesign-trend tegen die bij je merk past? Neem deze gerust op in je site, zolang het de bruikbaarheid van je site niet in de weg zit.
Samenvatting: webdesign-trends van 2018
We begeven ons inmiddels in 2020 en het jaar 2018 lijkt steeds verder weg. Maar de trends uit dat jaar komen we nog steeds tegen, zelfs bij nieuwe sites. Veel van deze trends hebben invloed op het huidige webdesign, dus het is goed om terug te kijken en te zien hoe we onszelf hebben ontwikkeld.
Webdesign heeft de laatste jaren een omslag gemaakt van minimalistische eenvoud naar stoutmoedig individualisme. 2018 was het jaar dat deze trend tot uiting kwam. Nog steeds kunnen we het effect hiervan voelen en we zijn er zeker van dat deze originele, unieke stijlen ook de komende jaren nog te zien zijn.
2D-illustraties, 3D-animatie
Illustraties zijn een goede manier om persoonlijkheid en karakter over te brengen, wat de opmars van 2D-illustraties verklaart. Ze zijn uiterst geschikt voor branding en zorgen dat je website opvalt. Een website met mooie illustraties wordt niet snel vergeten.
3D-achtergrondanimaties wonnen ook aan populariteit. Dit werd mogelijk gemaakt door technologische verbeteringen aan browsers, animatietechnologie en apparaten als computers en telefoons. We zien ze veel terug bij websites met portfolio’s en van internetbureaus. 3D-animaties trekken onmiddellijk de aandacht en zorgen voor een leuke vorm van interactie met de bezoeker.
We verwachten dat handgemaakte illustraties en animaties alleen maar in populariteit gaan toenemen. We kunnen geen betere manier bedenken om de persoonlijkheid van een merk over te dragen (en het kan zeker werken als een strategie).
Subtiel, vlak en minimalisme
Ondanks de trend naar meer originele, opvallende stijlen, bleef minimalisme het internet domineren. Er huist ongetwijfeld schoonheid in schone eenvoud. Zelfs sites die werkten met heldere kleuren of experimentele elementen koppelden dit aan een plat ontwerp.
Toch zagen we ook dat een semi-plat design, oftewel “Flat 2.0”, voet aan de grond kreeg met zijn schaduwen, gradients en andere iets complexere elementen. Zolang minimalisme populair is, vinden ontwerpers een manier om er een eigen draai aan te geven.
Ook subtiele animaties waren populair in 2018, met hun parallax- en subtiele hover-effecten. Hierdoor konden minimalistische websites hun eenvoud behouden en tegelijkertijd het algehele design mooier maken.
Geometrisch ontwerp
De meeste sites bevatten tot op zeker hoogte polygonen en geometrie, in 2018 was geometrisch ontwerp een trend die goed te zien was. Sites werden uitsluitend gebouwd rond eenvoudige vormen zoals vierkanten, rechthoeken en lijnen. Ook zagen we de geometrie terug in de details, zoals knoppen en decoratieve boxen.
Een subtrend waren organische geometrische vormen. Dit zijn vormen met een kleine mate van imperfectie of onregelmatigheid. Ze worden gekenmerkt door zachte hoeken en asymmetrie, wat ze een ongewoon en interessant uiterlijk geeft. De scherpe hoeken van polygonen en de afgeronde randen van organische geometrie werden vaak gecombineerd om tot een visueel aantrekkelijk contrast te komen.
Heldere en gewaagde kleuren
Ooit was het internet simpel, saai en wit. Een contrast met de laatste jaren waarin kleurrijke, levendige en avontuurlijke paletten steeds vaker te zien zijn. De dagen van een of tweede gedempte tinten in elk kleurenschema zijn voorbij. Ze zijn voorbijgestreefd door heldere en gewaagde paletten.
Gradients verschenen overal en zijn tot op de dag van vandaag een populaire keuze, met hun intense en levendige tinten die de bezoekers van talloze prominente sites in vervoering moeten brengen.
Naast deze levendige kleurenschema’s zagen we glitch- en vervormingseffecten, de heldere flikkerende animaties die het portfolio van menig ontwerper of ontwikkelaar vergezelden. Hoewel diens populariteit enigszins is vervaagd, kan je ze nog overal op internet tegenkomen.
Gebroken rasterdesign
De meeste ontwerpen leunen op een simpele op raster gebaseerde lay-out waarin alle elementen netjes verdeeld zijn in secties. Het gebroken rasterdesign speelt met deze verwachting. De stijl is te herkennen aan overlappende elementen en een lak aan symmetrie. Deze onconventionele lay-out is een van de meest opvallende manieren om op te vallen.
Een andere stijl die veel aandacht kreeg, was split-screen design. Een techniek die het scherm verdeelde in twee panelen, elk met hun eigen content. Over het algemeen werden lay-outs een stuk interessanter.
AI en machine learning
Chatbots zijn hot. Deze handige programma’s reageren dynamisch op klanten, waarbij het ondersteunings- of aankoopproces geheel of gedeeltelijk wordt geautomatiseerd. Machine learning stelt ze in staat om gegevens te onderzoeken. Ook leren ze hiermee om vragen en opmerkingen te beantwoorden, waardoor ze een deel van de werklast van je menselijk supportpersoneel op zich nemen.
Dit is slechts het begin. De technologie staat niet stil. De integratie van AI en machine learning met online systemen gaat in de toekomst door.
De opkomst van brutalisme
Brutalisme is niet mooi, maar zijn vreemde aantrekkingskracht heeft de harten van velen veroverd. Gekenmerkt door opzichtige kleuren, anti-UX-keuzes en all-over-the-place ontwerp, moedigt brutalisme ontwerpers aan om uit hun dak te gaan en een site te maken die verwachtingen tart. Verwacht in de toekomst meer van deze non-conformistische stijl.
Verhalen vertellen met webdesign
Visuals zijn een van de beste manieren om effectief informatie over te brengen. Je kan ze gebruiken om een verhaal te vertellen of om data op een overzichtelijk manier inzichtelijk te maken. Webdesigners vertellen hun verhaal door middel van charmante illustratie en datavisualisatie. Door de interactieve en visuele designs maken ze hun boodschap aantrekkelijker en makkelijker te begrijpen.
De grootste webdesign-trends van 2019
2019 deelde veel webontwerptrends met 2018, zoals gebroken rasterontwerp en gewaagde kleurenpaletten. Maar 2019 ging nog een stapje verder, een jaar waarin gedurfde ontwerpers volop experimenteerden.
De rode draad van dit jaar: het buigen en breken van regels. Tijd om dag te zeggen tegen wit, plat, op raster gebaseerd minimalisme. Welkom helder en gedurfde asymmetrie. Hoewel strak design en witte ruimtes altijd een rol van betekenis spelen, zijn er altijd ontwerpers te vinden die de status-quo aanvechten. En deze trend trekt zich in extremis door in 2020.
Levendigheid en kleurexperimentatie
Het internet wordt steeds kleurrijker. Gradients zijn nu overal te vinden. Websites showen vaker heldere en flitsende paletten – iets wat een aantal jaren geleden nog ondenkbaar was. De paletten zelf zijn ook extremer en breken steeds vaker met de gebruikelijke vorm van complementaire of contrasterende kleuren. Er is bijna geen pijl meer op te trekken.
Sites hebben niet meer dezelfde één of twee eenvoudige, gedempte kleuren. Zachte pasteltinten, felgekleurde tinten en paletten van elke grootte nemen het over. Scherp contrast, zachte subtiliteit en paletten boordevol persoonlijkheid komen samen en maken het internet een brouwsel van diversiteit.
Ook monochrome sites zijn een ding tegenwoordig. Deze nemen vaak de vorm aan van volledig zwart-wit of grijswaardenwebsites met een donkere esthetiek, maar je kan ook sites vinden die slechts rond één kleur zijn gemaakt.
Meer illustraties
Illustraties en andere visuals werden volop gebruikt in 2018 en deze trend trok door in 2019. Sterker nog, je kan spreken van een evolutie. Artiesten stappen vaker af van de typische, veelgebruikte, simplistische illustratiestijlen en kiezen ervoor om te experimenteren.
Een opkomende trend is excentrieke, speelse kunst die afwijkt van de normaliteit en opteert voor een meer abstracte stijl die willekeur omarmt. Deze illustraties negeren daarbij typische grenzen en deinzen er niet voor terug om te pronken met de persoonlijkheden van hun makers.
Ook 3D-illustraties genieten populariteit. Deze vorm is wellicht verwant aan de trend van veelal platte artwork, maar blaast er wel nieuw leven in. Een deel van deze kunstwerken zijn 2D en zo getekend dat ze 3D lijken, terwijl andere daadwerkelijk driedimensionaal gerenderd zijn. Hoe dan ook, ze winnen samen met 3D-webanimaties aan populariteit.
Last but not least: animaties. Geanimeerde kunst springt meteen in het oog en voegt een extra laag persoonlijkheid toe, terwijl de kunstvorm zelf al behoorlijk expressief genoemd kan worden. Zowel 2D- als 3D-animaties gaan groeien in 2020.
Gewaagd design
Je kan webdesign in 2019 samenvatten in twee woorden: groots en gewaagd. Hoe groter en experimenteler, hoe beter, vooral wanneer het eindresultaat flitsend is en aandacht onmiddellijk opeist.
Brutalistisch webontwerp is nog steeds populair. Er zijn zelfs complete websites die zich toeleggen op het verzamelen van het beste in brutalisme. De grimmige, lelijke, anti-user kunstvorm maakt zeker een statement. Webdesign beperkte zich altijd tot het leveren van een goede gebruikerservaring, maar brutalisme wil er een kunstwerk van maken. Het is niet duidelijk hoe lang brutalisme blijft bestaan, maar de trend heeft een fervente aanhang.
Het lijkt erop dat alles groter wordt, maar de grootste impact hiervan zien we binnen typografie en navigatie. Het is niet ongewoon om te zien dat tekst het hele scherm vult. Zelfs designs die uitsluitend rond typografie zijn gebouwd worden niet geschuwd, met weinig tot geen afbeeldingen.
Lettertypes worden niet overslagen als creatief middel. Helemaal in zijn kleurlettertypen. Deze lettertypen maken het makkelijker om aanpassingen te maken, waardoor het lijkt alsof ze in Photoshop zijn bewerkt. Typografie is tegenwoordig een focuspunt dat erkenning geniet in de wereld van webdesign. In deze gedetailleerde gids kunt u meer te weten komen over de best practices op het gebied van website-navigatie.
Ook navigatie breidt zich uit. Sierlijke headernavigatie en elegante dropdowns/hamburgermenu’s worden vervangen door dominante uithangborden. In extreme gevallen worden hele schermen gewijd aan navigatie waarbij wederom een rol is weggelegd voor enorme typografie.
Let ook op de levendige hero-videoheaders, geanimeerde achtergronden en een algemene trend van meer videocontent op webpagina’s. Video-elementen waren lang problematisch. Het laden duurde lang en ze deden een aanslag op mobiele data-abonnementen door hun grootte. Maar door verbeterde hardware en fallback-afbeeldingen kan je gerust overal video’s gebruiken. Die prachtige website met een full-screen geanimeerde achtergrond – ooit een zeldzaamheid – ga je dus vaker zien.
Asymmetrie
Gebroken rasterontwerp blijft erg populair. Websites kiezen er vaak voor om typische lay-outs te vermijden en te kiezen voor iets artistiekers, met veel overlappende stukken en elementen die verspreid zijn over het hele scherm. Het is een stijl waarvan de uitvoering lastig is. Lukt het toch, dan heb je een pareltje.
Maar voor websites die niet frontaal tegen de stroom in willen lopen, is asymmetrie met mate ook een acceptabel alternatief. Met name asymmetrische splitscreen-designs zijn populair, ook al houden deze sites zich nog grotendeels aan een raster.
Over rasters gesproken, CSS-raster (CSS grid) is een krachtige toevoeging aan CSS die in twee dimensies werkt, kolommen en rijen. Hiermee kan je eenvoudig nieuwe websites maken. Met CSS kan je ook een gebroken rasterlay-out maken. Alles is mogelijk. Steeds meer webontwerpers en ontwikkelaars ontdekken het CSS-raster. Mis het dus niet.
Meer effecten en animaties.
Hoewel brutalisme in sommige hoeken van het internet gemeengoed is, concentreert de rest zich op UI/UX-design: het creëren van een mooiere interface in combinatie met het verbeteren van de gebruikerservaring.
Het sleutelwoord hierbij zijn micro-interacties. Denk aan het zweven over een product in een winkel of het spelen met een interactieve, geanimeerde achtergrond. Deze kleine animaties maken het navigeren van een website leuker en zorgen voor een kleine glimlach bij interacties als klikken en zweven. Sommige sites gaan zelfs zo ver dat ze leuke minispelletjes toevoegen.
Maar het is niet alleen maar voor de lol. Micro-interacties hebben vaak hetzelfde doel als de gebruikelijke subtiele animaties: ze richten de aandacht van de gebruiker op belangrijke UI-elementen. Over-implementatie kan echter snel funest zijn. Het is daarom zaak om achter het ideale aantal animaties op je site te komen.
Scrol- en parallax-effecten zijn nog altijd populair en kunnen een dynamische gelaagde look aan een pagina toevoegen en deze een stuk interessanter maken.
Vergeet niet de aangepaste cursors. Vroeger vond je deze alleen bij obscure blogs en sites voor kinderen. Maar vandaag de dag zijn ze populair, met name voor sites die zijn gebouwd rond geanimeerde 3D-achtergronden of navigatie. Een elegante aangepaste cursor kan de esthetiek van je site verbeteren.
Witruimte
Zoals altijd is er plek voor witruimte en strakke ontwerpen. Dit gaat niet veranderen. Simpel en strak is een veilige keuze. Niet voor niets is deze stijl te vinden in nagenoeg elke moderne website.
Maar ook als je iets gedurfder zoekt, iets uniekers, dan is witruimte nog steeds iets wat opgenomen moet worden. Elke site heeft ademruimte nodig. Witruimte kan gebruikt worden om subtiel de aandacht te vestigen op afbeeldingen of andere content van je site.
Ook overdadig gebruik van witruimte kan met succes worden ingezet. Denk hierbij aan het opzettelijk leeg laten van grote delen van het scherm, zodat je andere belangrijke elementen voldoende ruimte geeft. Deze stijl, maximum white space, zien we ook de komende jaren terug.
Progressieve web-apps
De volgende trend in mobiel design? Progressieve web-apps. Deze webgebaseerde platforms zijn gebaseerd op code zoals HTML en JavaScript, maar functioneren en werken als mini-apps voor de mobiele gebruiker. Ze zijn gemaakt om de ervaring van een app te bieden zonder dat ze daadwerkelijk op mobiele technologie moeten worden gebouwd of in de app-store moeten staan.
PWA’s werken offline, kunnen meldingen versturen en worden vastgezet op het startscherm. En je hoeft niets te downloaden of te distribueren. Ze zijn lichtgewicht en laden snel en nemen weinig bandbreedte in beslag.
Zelfs Twitter maakt gebruik van PWA’s. Twitter Lite is een oplossing voor mensen met lage internetsnelheden. Momenteel zijn ze bezig het systeem te integreren in hun hoofdinterface. Dit is een bewijs van hoe goed deze technologie werkt.
Als je nog nooit van progressieve web-apps hebt gehoord, dan moet je zeker wat onderzoek doen. Met een web-app kan je de ervaring van je mobiele gebruikers een stuk soepelen maken.
Samenvatting
2018 en 2019 waren spannende jaren voor de online wereld. Ook in 2020 sijpelen de meer avontuurlijke ontwerpen al binnen. Niet-conformerende elementen zoals asymmetrie, felle kleuren, brutalisme en opvallende animaties gaan de komende jaren in populariteit toenemen.
En wie weet wat de komende jaren in petto heeft. We zijn zeker fan van de onconventionele nieuwe kunststijlen.
Als je de trein hebt gemist, is het tijd om na te denken over het design van je site en te kijken of deze trends je bevallen. Verwacht dat merken en designers zich gaan uiten. Het internet wordt alleen maar levendiger en interessanter.
Het volgende decennium van webdesign gaat in het teken staan van het nemen van risico’s en innovatie. Zorg dat je er klaar voor bent.
Laat een reactie achter