23 designelementen die jouw website ouderwets maken

Webdesign verandert snel: wat vroeger modern was, kan nu verouderd zijn. Maar hoe weet je of je website nog up-to-date is of dat het zijn beste tijd heeft gehad? In dit artikel hebben we 23 signalen verzameld die aangeven dat je webdesign verouderd is en we laten je zien hoe je deze problemen kunt oplossen. Het is tijd om afscheid te nemen van dat 2012-webdesign en je website te upgraden. Lees verder om te ontdekken hoe je dat frisse, strakke en functionele design kunt creëren dat je gebruikers verwachten.

TL;DR

1. Gebruik van verouderde logo's of visuele identiteit
2. Gebruik van verouderde grafische elementen zoals bevels en schaduwen
3. Te veel felle kleuren
4. Gebruik van achtergrondmuziek of geluidseffecten
5. Clipart als afbeeldingen
6. Te veel animaties
7. Gebruik van ouderwetse lettertypes
8. Decoratieve lettertypes
9. Te veel verschillende lettertypes
10. Te veel tekst en te weinig visuals
11. Te kleine tekst
12. Tekst op complexe achtergrondafbeeldingen
13. Te weinig contrast van tekst op achtergrond
14. Te weinig witruimte
15. Geen responsive design
16. Te veel navigatiebalken
17. Te veel zijbalken met te veel inhoud en/of links
18. Slecht uitgelijnde tekst en afbeeldingen
19. Slechte navigatie en een gebrek aan duidelijke hiërarchie van de inhoud
20. Pop-ups of modale vensters
21. Geen zoekfunctie
22. Lange laadtijden
23. Splash-schermen

Meer signalen

Stijlelementen

1. Gebruik van verouderde logo's of visuele identiteit.

Het gebruik van oude of verouderde logo's en visuele identiteit op een website kan ervoor zorgen dat je website er ouderwets en niet bijgewerkt uitziet. Het is belangrijk dat je logo en visuele identiteit de uitstraling hebben die past bij de tijd en jouw professionaliteit. Door je logo en visuele identiteit regelmatig te vernieuwen of op te frissen,blijft je website er modern en professioneel uitzien. Zorg er ook voor dat de kleuren, lettertypen en afbeeldingen die je gebruikt bij je visuele identiteit passen en consistent zijn op alle pagina's van je website. Dit geeft niet alleen een uniforme uitstraling, maar helpt ook bij de herkenning en de vertrouwensfactor van jouw merk.

2. Gebruik van verouderde grafische elementen zoals bevels en schaduwen

Het web werd voorheen versierd met allemaal mooie effecten zoals schaduwen, bevels, felle kleurovergangen en drukke achtergrondafbeeldingen. Simpelweg omdat het nieuw was. Maar is het wel slim om dit nog steeds te doen? Voegen deze designelementen echt wat toe aan de communicatie en de gebruikerservaring? Rond 2011 was het populair om helemaal geen schaduwen meer toe te passen (flat design), tegenwoordig is dit alweer wat gewoner. Denk goed na hoe je decoratieve elementen toepast en wat voor effect het heeft op de gebruikerservaring.

3. Te veel felle kleuren

Onderdeel van de designtaal van de jaren 90 (en '00) is het gebruik van vele, felle kleuren om je website te laten spreken. Dit kan echter door veel gebruikers ervaren worden als schreeuwerig, overweldigend en onsubtiel. Probeer een kleurenpalet aan te houden van maximaal 3 kleuren; een hoofdkleur, een steunkleur en een call-to-actionkleur, met daarnaast een achtergrond- en tekstkleur.

4. Gebruik van achtergrondmuziek of geluidseffecten

Onderdeel van de websites van eind jaren 90 en begin '00 waren achtergrondmuziek en geluidseffecten. Dit werd gedaan om van de website een ervaring te maken. Tegenwoordig wordt dit als zeer ongewenst ervaren, omdat het storend overkomt. Je wilt als gebruiker bijvoorbeeld niet dat een website muziek gaat afspelen terwijl je in de trein op het web aan het surfen bent.

5. Clipart als afbeeldingen

Clipart is een verzameling van voorgefabriceerde afbeeldingen, vaak met eenvoudige graphics en felle kleuren. Hoewel clipart in het verleden populair was, kan het een website er verouderd en onprofessioneel laten uitzien. Dit komt doordat clipartafbeeldingen vaak niet het niveau van detail en verfijning hebben dat moderne websites vereisen om een sterke visuele impact te hebben. Gebruik in plaats van clipart mooie, grote foto's of modernere (handgemaakte) illustraties.

6. Te veel animaties

Je kan je vast nog het sociale netwerk Hyves herinneren. Dat stond bomvol met animaties in de vorm van GIF-afbeeldingen. Te veel animaties en GIF-afbeeldingen op je website kunnen een verouderde uitstraling geven en daarnaast de laadtijd van je website vertragen. Bovendien kunnen ze de aandacht van je bezoekers afleiden van de ware inhoud. Daarom is het belangrijk om te overwegen welke animaties essentieel zijn voor de gebruikerservaring en welke niet. In plaats van veelvuldig gebruik van GIF-afbeeldingen kan je bijvoorbeeld gebruik maken van moderne web-animaties die subtiele, maar effectieve visuele feedback bieden. Op deze manier kun je een moderne, minimalistische uitstraling creëren die de gebruikerservaring verbetert en je website up-to-date houdt.

De website van Dell uit 2013De website van IBM uit 2011

Tekst en typografie

7. Gebruik van ouderwetse lettertypes

Iedereen kent wel de lettertypes Times New Roman, Comic Sans en Arial. Maar iedereen weet ook dat deze niet meer door professionele ontwerpers worden toegepast. Deze systeemlettertypes werden gebruikt om de laadtijd van de pagina te verminderen omdat het web nou eenmaal langzamer was. Tegenwoordig kun je gemakkelijk lettertypes ophalen en aan de eindgebruiker laten zien. Probeer eens te kijken naar welke lettertypes tegenwoordig populair zijn, bijvoorbeeld bij Google Fonts en Open Foundry.

8. Decoratieve lettertypes

Soms werden decoratieve lettertypes (zoals Papyrus) gebruikt om het webdesign van websites karakter te geven. Dit helpt echter niet om de site leesbaar en overzichtelijk te maken. Probeer simpele lettertypes te gebruiken en met fotografie, video en kleurgebruik je ontwerp karakter te geven. Mocht je wel een speciaal lettertype gebruiken, dan moet deze wel goed leesbaar en groot genoeg zijn.

9. Te veel verschillende lettertypes

Om elementen eruit te laten springen maakten designers voorheen gebruik van veel verschillende lettertypes op één pagina. Dit is echter zeer onleesbaar en te overweldigend. Probeer maximaal twee lettertypes toe te passen voor kop- en inhoudsteksten. Soms is het zelfs beter om voor de hele site één lettertype te gebruiken. Je kunt natuurlijk spelen met het gewicht, de grootte en de uitlijning van de tekst.

10. Te veel tekst en te weinig visuals

Een beeld zegt duizend woorden. Dat geldt ook voor het web. Maar goede afbeeldingen verzamelen kan lastig zijn. Het is veel goedkoper en makkelijker om een stukje tekst te schrijven dan een passende afbeelding te zoeken. Vroeger kostte het relatief gezien veel meer bandbreedte om afbeeldingen in te laden. Dat maakte de pagina langzamer. Tegenwoordig is dat geen enkel probleem meer. Dus, vul je pagina met prachtige beelden!

11. Te kleine tekst

Er is een trend dat lettertypes steeds groter worden op websites. Dit heeft ermee te maken dat dit toegankelijker is voor slechtziende gebruikers en omdat het de aandacht van de gebruiker trekt. Vroeger werd tekst klein getoond, zodat er meer in één keer zichtbaar was als de site geopend werd. Maar gebruikers kunnen slechts een beperkte hoeveelheid informatie opnemen voordat ze overweldigd raken. Een lettertypegrootte van 16 pixels is een mooi startpunt, maar groter kan vaak beter zijn.

12. Tekst op complexe achtergrondafbeeldingen

Op het web werden soms wel eens drukke afbeeldingen gebruikt waarop ook nog tekst stond. Deze tekst was vaak onleesbaar. Waarom? Omdat ' het kon' om drukke afbeeldingen te plaatsen en omdat het als visueel interessant werd gezien. Heeft jouw website ook een drukke, complexe achtergrond met tekst erop die nauwelijks leesbaar is? Laat die achtergrond dan zitten, en geef je teksten de witruimte en aandacht die ze verdienen!

13. Te weinig contrast van tekst op achtergrond

Tegenwoordig proberen webdesigners er rekening mee te houden dat alle tekst op een website goed leesbaar is. Onderdeel daarvan is het contrast van de tekst met de achtergrond. Dit maakt je website ook toegankelijker voor mensen met een visuele beperking.

Website van Sony uit 2010Website van TIME magazine uit 2012

Lay-out en structuur

14. Te weinig witruimte

Schermen waren vroeger kleiner. Daardoor moest de inhoud meer op elkaar geplaatst worden. Tegenwoordig nemen webdesigners veel meer de ruimte voor tekst, afbeeldingen en iconen. Probeer maar eens de witruimte op je site te verdubbelen, of zelfs te verdrievoudigen, en je zult zien dat je website in één keer moderner oogt!

15. Geen responsive design

Als je site niet even goed werkt op mobiel als op desktop, dan mis je echt de boot. Een zeer groot deel van al het bezoek vindt op smartphones plaatst, dus een gelijkwaardige gebruikerservaring op alle apparaten is tegenwoordig essentieel.

16. Te veel navigatiebalken

Webdesigners waren in de veronderstelling dat als je alle navigatie-opties aan de gebruiker toonde, de gebruiker door minder te klikken naar haar doel kan navigeren. Dit kan echter leiden tot een informatie-overload en een rommelig, niet-gefocusd webdesign. Probeer één duidelijke navigatiebalk aan te houden, en waar nodig één subnavigatie toe te passen. Dit zorgt ervoor dat de gebruiker makkelijker informatie kan vinden.

17. Te veel zijbalken met te veel inhoud en/of links

Als je nog steeds zijbalken gebruikt op je website, dan is het misschien tijd om te upgraden naar een modernere lay-out. Laten we eerlijk zijn: drukke en overbodige zijbalken zijn als de dinosaurussen van het webdesign. Tegenwoordig zijn minimalistische lay-outs populair, waarbij de nadruk ligt op witruimte en gecentreerde, gefocuste content. Overweeg om een clean en strak design te gebruiken met een goede hiërarchie en focus op de belangrijkste inhoud. Dit zorgt ervoor dat de bezoekers gemakkelijk kunnen vinden wat ze zoeken en je website er tegelijkertijd modern en professioneel uitziet.

18. Slecht uitgelijnde tekst en afbeeldingen

Een gebrek aan uitlijning kan ervoor zorgen dat je website eruitziet als een ouderwets mozaïek, en dat is allesbehalve aantrekkelijk voor je gebruikers. Het is alsof je een kamer binnenloopt waar de schilderijen allemaal scheef hangen - het is gewoon niet professioneel! Vroeger was stijlen met CSS een stuk ingewikkelder dan het nu is. Webdevelopers hebben ook meer ervaring gekregen met het correct positioneren van tekst en afbeeldingen. Dus zorg ervoor dat je afbeeldingen en tekst netjes op hun plek staan, en je website zal er meteen een stuk moderner uitzien.

19. Slechte navigatie en een gebrek aan duidelijke hiërarchie van de inhoud

Slechte navigatie en gebrek aan hiërarchie van de inhoud zorgen voor frustratie bij bezoekers van jouw website. Het kan er zelfs toe leiden dat ze jouw website verlaten zonder de inhoud te bekijken! Dit probleem komt vaak voor bij verouderde webdesigns die geen rekening hielden met gebruikerservaring. Maar er zijn oplossingen om dit te verbeteren: organiseer je inhoud logisch en gestructureerd, maak je navigatiemenu duidelijk en zichtbaar, en voeg visuele aanwijzingen toe zoals subkoppen en hover-over effecten.

20. Pop-ups of modale vensters

Pop-ups en modale vensters kunnen ervoor zorgen dat je website er ouderwets uitziet. Hoewel het gebruik van pop-ups vroeger een populaire manier was om gebruikers te informeren of te verleiden tot een bepaalde actie, zijn er nu effectievere manieren om dit te doen. Zónder de gebruikerservaring te verstoren. Overweeg bijvoorbeeld call-to-actionknoppen op strategische plaatsen. Als je toch pop-ups gebruikt, zorg er dan voor dat ze gemakkelijk te sluiten zijn en niet te vaak verschijnen, anders kan het lijken alsof je website wordt gerund door een opdringerige verkoper.

21. Geen zoekfunctie

Zoekfuncties waren vroeger moeilijk te bouwen. Maar dankzij technologieën zoals SOLR is het tegenwoordig makkelijk om zoekfunctionaliteiten in je site te bouwen, en deze snel te maken. Veel bezoekers maken gebruik van zoekfunctionaliteiten om op sites te navigeren, dus overweeg of dit een goede toevoeging is.

22. Lange laadtijden

Het web was vroeger langzaam. Niet alleen door de bandbreedte en de servers, maar ook omdat websites inefficiënt werden gebouwd. Als je website langzaam is, kan het betekenen dat deze technisch niet op orde is en aan een redesign of zelfs rebuild toe is.

23. Splash-schermen

Tijdens het flash-tijdperk van het web werd soms tijdens het laden van de site een zogenaamd 'splash screen' getoond. Hier stond meestal het logo van het bedrijf in of het bevatte een inspirerend citaat. Dit werd vaak voorafgaand aan een diepgaande, interactieve webervaring getoond. Soms werd dit opzettelijk toegevoegd om de aandacht van de gebruiker te pakken en te communiceren dat de websete echt een 'ervaring' was. Gebruikers verwachten tegenwoordig dat ze gelijk je site kunnen gebruiken en daarin kunnen navigeren. Dit heeft te maken met de snelheid waarop het internet wordt doorgesurfd. Laat dat splash screen zitten, maar communiceer je merk en merkwaarden wel goed.

Website van Star Wars uit 2010. De Force was toen zwakker, zo te zien aan het webdesign.

Meer signalen

Niet alleen een oubollig webdesign kan je website verouderd maken - er kan ook van alles mis zijn met de inhoud en de techniek. In het tweede deel van dit artikel kun je 16 signalen vinden die erop kunnen wijzen dat je site verouderd is.

Wil je meer weten over hoe het web er vroeger uitzag? Luister dan naar onze borrel special podcast over onze ervaringen van vroeger, en ontdek hoe wij toen websites ontworpen en bouwden!

Heb je je website gecontroleerd en denk je dat het tijd is voor een redesign en/of rebuild? Wij staan te springen om met je mee te denken! Neem gerust contact met ons op, we kunnen niet wachten om een (vrijblijvend) gesprek aan te gaan!

Jurrien Meyrahn

UX Webdesigner