7 tips die jouw webdesign laten knallen

8,25 seconden. Dat is de gemiddelde aandachtsspanne van een bezoeker. Zoveel tijd heb je dus om een websitebezoeker te overtuigen. Dat is gek genoeg korter dan de aandachtsspanne van een vlieg (9-12 seconden) of goudvis (9 seconden). Wanneer iemand aan het rondsurfen is, is dat omdat deze een specifiek doel voor ogen heeft. Ze zijn op zoek naar info en willen deze info natuurlijk graag zo snel mogelijk vinden. Wist je bijvoorbeeld dat kleuren onbewust een negatieve emotie kunnen oproepen? Of dat de verkeerde keuze van lettertypes maakt dat mensen sneller je website verlaten?

Neem je website onder handen

7 kenmerken van goed webdesign

#1 Kleurgebruik

Kleuren spelen een grote rol in ons gedrag. De juiste kleuren kunnen een bezoeker actie laten ondernemen. Groen staat bijvoorbeeld voor rust. Dit linken mensen automatisch aan natuurgerelateerde bedrijven.

Tip: contrasterende kleuren trekken sneller de aandacht dan neutrale tinten. Een felle knop op een rustige pagina valt meteen op en zet aan tot actie. Contrast verbetert ook de leesbaarheid en presenteert informatie gestructureerder.

#2 Typografie

Je zou verbaasd zijn hoe snel een webdesign kan breken door een slecht lettertype. Een lettertype vertelt net zoveel over jouw bedrijf als de kleuren die je gebruikt. Mensen zullen je bedrijf niet serieus nemen als je Comic Sans gebruikt. Een font dat past bij jouw bedrijf is een belangrijke start.

Tip: kies maximaal drie verschillende lettertypen voor je website en gebruik ze consequent.

#3 Opvallende call-to-actions

Knoppen zoals ‘contacteer ons’, ‘meld je aan’ of ‘bestel hier’ moeten aanzetten tot actie. Ze heten niet voor niets call-to-actions. Hoe je dat doet? Geef deze knoppen een contrasterende kleur, zodat ze meteen opvallen. Je kan zelf de test doen door met half toegeknepen ogen door een website te scrollen. De CTA’s moeten er zo uitspringen.

Tip: wees creatief in je tekst, maar zorg dat het duidelijk blijft. Vertel je bezoeker precies wat je wilt dat ze doen. Een goede CTA bevat minstens één werkwoord. Daarnaast moet het voor de bezoeker ook duidelijk zijn wat de knop doet. ‘Schrijf je in’ is goed, maar ‘schrijf je in op onze nieuwsbrief’ is beter.

#4 Witruimte

Als we het hebben over witruimte, bedoelen we de lege ruimte tussen elementen op het scherm. Witruimte is dus niet letterlijk wit, maar de lege ruimte tussen tekst, afbeeldingen en elementen. Genoeg witruimte in je webdesign helpt bij de leesbaarheid. Je ziet het effect steeds meer terugkomen bij nieuwere websites. Het geeft een rustig gevoel en laat de aandacht automatisch naar de belangrijkste elementen gaan.

#5 Eenvoud wint

Als bezoekers niet weten waar ze eerst moeten kijken, is de kans groter dat ze je website verlaten. Vermijd dat ze overladen worden met info. Wees zuinig met de tekst. Verspreid de tekst liever over verschillende pagina’s dan alle informatie samen op een onepager.

#6 Kwalitatieve content

Goede content is de kern van je hele website. Denk bijvoorbeeld aan:

• Relevante tekst
• Nuttige content zoals blogs, nieuwsberichten, updates, …
• Professionele video’s en foto’s
• Link naar social media accounts
• Beoordelingen van klanten
• …

Zorg dat de inhoud van je site afgestemd is op wat je bezoekers zoeken. Een goede tekst is helder, beknopt en geschreven in een taal die je doelgroep begrijpt. Gebruik sterke koppen en een logische structuur.

Onderstaande website van PuurM zorgt met zijn kwalitatieve content, sterke foto’s en dynamisch ontwerp voor meer betrokkenheid van de bezoeker.

#7 Duidelijke navigatie

Een bezoeker moet meteen begrijpen waar hij op moet klikken voor de juiste informatie. Veel bezoekers scannen een webpagina eerst voor ze eventueel verder lezen. We delen teksten in op basis van verschillende layoutelementen, zoals:

• Formaat
• Kleur
• Uitlijning
• Fontsoort

Tip: een goede manier om dit toe te passen, is aan de hand van een titelstructuur. Bezoekers gebruiken titels om je teksten te scannen. Zoekmachines zoals Google ook, trouwens. Zo word je beter gevonden tijdens het surfen. Goede titels zijn kernachtige zinnen die samenvatten waarover de tekst gaat en die aanzetten om verder te lezen. In je titelstructuur staat je unieke H1 bovenaan, gevolgd door een H2, eventueel gevolgd door één of meerdere H3’s. Daarna kan opnieuw een H2 staan met daaronder H3’s, en zo verder.

Bonus: een goede website is meer dan het design

Een website mag er mooi uitzien, maar moet ook gebruiksvriendelijk zijn. UX (of User Experience) gaat over hoe een website werkt en hoe deze aanvoelt voor de gebruiker. Steve Jobs zei ooit:

“Design is not just what it looks like and feels like. Design is how it works.”

Denk bijvoorbeeld aan het gemak waarmee je door pagina’s navigeert, hoe snel je kan vinden wat je zoekt en hoe logisch de opbouw is. UX en UI (User Interface, dus wat je ziet) versterken elkaar. Je kan het in zekere zin vergelijken met een mooie auto. Het exterieur (UI) trekt de aandacht, maar het rijcomfort (UX) bepaalt of je ermee blijft rijden.

Wij geven je hieronder nog 3 bonustips om het allerbeste uit jouw website te halen. Met deze tips zorg je voor meer websiteverkeer, maar ook voor trouwere bezoekers en positieve ervaringen.

#Bonustip 1: responsief ontwerp

Gemiddeld bezoekt 60% het internet op smartphone, 38% op desktop en maar een kleine 2% op de tablet. Een website moet daarom ook goed werken op mobiel. Een website is responsive wanneer die zich automatisch aanpast aan een kleiner (of groter) scherm. Hierdoor blijft de inhoud goed leesbaar zonder te moeten inzoomen. Je layout is als het ware flexibel en past zich aan, zodat het netjes op elke schermgrootte past.

Een veelgebruikte term is ‘mobile first’. Dat wil zeggen dat eerst de mobiele versie van een website wordt ontwikkeld en dan pas de desktopversie. Dat hangt vooral af van wie je doelgroep is en van waar het grootste verkeer komt.

Interesse in een responsive-check door ons? Neem contact met ons op voor gratis advies.

Neem contact op

#Bonustip 2: zo weinig mogelijk kliks

Niets vervelender dan tien keer doorklikken op een website om eindelijk tot de info te komen die je zocht. Mensen willen dingen liefst zo eenvoudig mogelijk terugvinden. Elk onderwerp moet daarom binnen enkele klikken terug te vinden zijn.

Protip: gebruik breadcrumbs. Geen letterlijke broodkruimels, maar een hulpmiddel tijdens het navigeren op een website. Je hebt breadcrumbs vast al eens gebruikt. Bij een kledingshop bijvoorbeeld:

Homepagina > Categorie kleding > Herenmode

Dit pad van digitale ‘kruimels’ volgen bezoekers om bij bepaalde info te komen. Het maakt het gemakkelijker om te zien waar je je ergens op de website bevindt. En met één klik op de homepagina ga je terug vanwaar je vandaan komt. Daar kunnen Hans en Grietje nog iets van leren…

#Bonustip 3: snelle laadtijd

De kans bestaat dat je zelf al eens naar een website surfte die maar niet wilde laden. Een bezoeker verliest al snel zijn aandacht (na 8 seconden, weet je nog?) en zal dan waarschijnlijk jouw website verlaten. Dat wil je natuurlijk liefst zoveel mogelijk vermijden. Websites met snellere laadtijden worden beter gerangschikt door zoekmachines, en dat verhoogt op zijn beurt de zichtbaarheid.

Protip: websites kan je eenvoudig sneller laten laden door afbeeldingen te comprimeren. Hoe groter (hoe zwaarder) de afbeeldingen, hoe langer je website nodig heeft om te laden. Bij elke website die we maken, comprimeren we de afbeeldingen zo licht mogelijk zonder dat de kwaliteit verloren gaat.

De onderstaande website van interieurbouwer Herman Interieur heeft veel kwalitatieve foto’s, die snel moeten laden voor een fijne website ervaring.