De 7 basis regels van goed webdesign
Je bent al weken, of misschien maanden bezig geweest om je nieuwe website te perfectioneren. En aan het eind van het verhaal eindig je met een "mwah" website. Tuurlijk, er staan wel een aantal dingen op die je graag wilde, maar het geheel ziet er echt niet zo goed uit als het template waar je mee begonnen bent. Waarom ziet het er een beetje rommelig en onprofessioneel uit terwijl je zo'n goede start heb gemaakt?

Je bent al weken, of misschien maanden bezig geweest om je nieuwe website te perfectioneren. En aan het eind van het verhaal eindig je met een “mwah” website. Tuurlijk, er staan wel een aantal dingen op die je graag wilde, maar het geheel ziet er echt niet zo goed uit als het template waar je mee begonnen bent.

Je vraagt jezelf af: Waarom heeft mijn website geen wow-factor?

Waarom ziet het er een beetje rommelig en onprofessioneel uit terwijl ik zo’n goede start heb gemaakt?

Als je geen professionele grafisch of webdesigner bent kan het bijna onmogelijk zijn om de vinger op de zere plek te leggen en om erachter te komen wat er nou niet lekker werkt.

En dus raak je een beetje in paniek. Dit is toch niet wat je voor ogen had? Hoe gaat dit nou nog mooi worden?

No worries, de meeste mensen hebben dit, zeker als ze voor het eerst hun website ontwerpen.

Als je geen vertrouwen hebt in je eigen design skills (en dat is ook heel lastig als je zelf geen designer bent) dan hou je vaak de kopie van de homepage van je template over. je voegt je logo toe en past het lettertype aan. Eigenlijk laat je het template bepalen hoe je website is opgebouwd en eruit komt zien, in plaats van dat je dat zelf bepaald.

Misschien ben je ook wel even gaan rondkijken. Mooie website gezien (van een concurrent of iemand die je bewonderd) en dan denk je: YEs, ik wil mijn website net zo!

Dus je neemt de kleuren over, het font en je bouwt je website net zo op als deze favoriet. En vaak hou je dan ook echt wel wat moois over. Alleen het komt niet vanuit jezelf. Het klopt niet bij wie JIJ bent en waar je bedrijf voor staat.

Hoe doe je dit dan wel? Op welke manier kan je een prachtige site maken die helemaal bij je past en waar je gewoon een beetje verliefd op wordt? Hiervoor hanteer ik 7 basis design regels. Benieuwd welke dat zijn? Je vind ze in mijn laatste blogpost via #linkinbio of op smitclub.nl!

1. Gebruik je Homepage als basis

Deze pagina bepaald hoe de rest van je website eruit komt te zien. Alle fonts, kleuren en design elementen die je op gehele website gaat gebruiken moet je hier kunnen zien.

Zo komen er geen ‘verrassingen’ als mensen de rest van je website bezoeken. Ineens een andere kleur of font zorgt ervoor dat je bezoekers zijn aandacht daar naar verlegd, in plaats van op de inhoud van je website. En je wil ze natuurlijk niet afleiden als ze net lekker aan het lezen of kopen zijn ๐Ÿ˜€.

Als je ze toch wil verrassen: doe dat dan met je teksten en de afbeeldingen die je kiest. Niet met nieuwe kleuren, fonts of design elementen.

Mijn advies zou zijn om altijd te beginnen met branding (in mijn Smit Club cursus wijden we er niet voor niks een hele module aan). Begin eens met een Pinterest board waar je de sfeer die je wilt laten zien gaat bepalen. Focus hierbij op kleuren, fonts en vormen of patronen. Hiermee ga je dan later aan de slag op je homepage.

2. Geef je andere pagina’s dezelfde liefde als je homepage

Je wilt niet weten hoe vaak ik dit tegenkom. Prachtig ontworpen homepages maar hoe meer je doorklikt, hoe minder aandacht er lijkt te zijn voor de onderliggende pagina’s. En dus vormt je website geen geheel. Er is geen samenhang en dat maakadat het voor je bezoeker een verwarrende ervaring kan zijn.

3. Vertel een verhaal. En vertel dat in stukjes.

Je bent enthousiast begonnen met een template maar je merkt dat jij eigenlijk veel meer tekst hebt dan past in het ontwerp dat je gekozen hebt. Dat resulteert dan in vreemde, lange blokken tekst die ongelijk over de pagina verdeeld zijn.

En er is een ding waar alle webdesigners het over eens zijn: Niemand leest lange stukken tekst.

Het is zonde van je tijd en energie. Heb je toch meer te vertellen dan dat er in het ontwerp past? Deel je tekst dan op in verschillende stukjes. Gebruik secties met verschillende kleuren. Vervang een stuk tekst door een quote op je pagina. Voeg beeld en design elementen toe en hou het spannend maar overzichtelijk.

4. Witruimte is je beste vriend.

Dit is een van de makkelijkste manier om je website mooi te maken. Klinkt gek maar is echt waar. Geef je beeld en tekst de ruimte om te ademen. Doe je dat niet, dan krijg je een rommelig geheel. Het is zelfs zo dat design studies aangetoond hebben dat websites met meer witruimte als professioneler worden gezien en een lagere bounce rate hebben. En wie wil dat nou niet?

5. Gebruik een simpel lettertype

Kleuren en lettertypes uitzoeken voor je website is een van de leukste dingen die er is. Maar ga hier niet teveel mee “los”. Kies maximaal drie fonts voor op je website – en dat is inclusief het font dat je in je logo gebruikt!

Je hebt een font nodig voor:
– je kopteksten
– je subkopjes
– je bodytekst (je alinea’s)

Hou hierbij in gedachte dat het “bovenste” font (die van je kopteksten dus) bepaald hoe de andere fonts eruit zien. En weet dat je met de verschillende zwaartes van een font (dun, bold, italic ect) ook al heel veel variatie kan creรซren zonder dat het een rommeltje wordt.

6. Weet hoe je bezoeker je website gebruikt

Designers noemen dit met een fancy woord ook wel UX (user experience). Daarmee wordt bedoeld hoe een bezoeker zich voelt als hij/zij zich beweegt op je website.

Het is heel makkelijk om hier aannames over te doen. “Ze zullen vast wel eerst hier op klikken, dat is toch een hele duidelijke knop?”. Maar vergis je niet, dit kan in realiteit heel anders zijn. Misschien is je navigatie niet duidelijk genoeg. Misschien heb je niet genoeg “call to action” knoppen. De enige manier om erachter te komen hoe mensen zich op je website gedragen is door hun gedrag te volgen. Ik gebruik hier altijd Google Analytics voor. Soms aangevuld door Hotjar – een programma dat echt korte schermopnames maakt van hoe mensen je website gebruiken.

7. Zorg dat alles werkt

DUH. het klinkt zo logisch maar in het proces van designen kan je nog wel eens vergeten te checken of alle knoppen inderdaad werken en doorlinken naar de plekken zoals je het in je hoofd had.

Ik hou zelf altijd het volgende lijstje erbij:

  • Test alle contactformulieren uitvoerig & regelmatig
  • Is je font groot genoeg en goed leesbaar
  • Is je navigatie simpel en duidelijk
  • Controleer of alle knoppen werken

Zo. nu heb je een shitload aan informatie waarmee je aan de slag kan met je website! En wil je meer van dit alles? Kijk dan eens naar mijn cursus waarin we alles hierboven – en nog veel meer – uitgebreid gaan doorlopen!