11 praktische tips om je webdesign te verbeteren

Of je nu leuk vindt of niet, soms moet je iets ontwerpen. Er kan van alles aan de hand zijn: je bent een ontwerper met te weinig tijd, je werkt in je eentje aan een project, bij je bedrijf werkt geen designer of misschien wil je je onderscheiden met een niet-standaard ontwerp.

Wij hebben wellicht een oplossing voor je: 11 praktische tips om je webdesign te verbeteren zonder het heel ingewikkeld is.

1. Kopteksten dikgedrukt maar dezelfde lettergrootte. (Maak de font-weight zwaarder en houd de font-size gelijk aan de tekst).

2. Vermijd grijze tekst op een gekleurde achtergrond, gebruik in plaats daarvan alleen wit of zwart of maak de tekst een klein beetje doorzichtig (met opacity).

3. Afbeeldingen: match de kleuren van je tekst met de kleuren in de afbeelding. Probeer bijvoorbeeld eens dit tooltje op canva.com, of dit tooltje op coolors.co.

4. Kleurgebruik: neem maximaal twee of drie kleuren, waarbij je de eerste kleur 80% van de tijd gebruikt en de andere kleuren echt alleen om de aandacht te trekken.

5. Schaduwen: laat een schaduw iets naar beneden verspringen zodat de lichtbron bovenaan je scherm lijkt te zitten. Dit creëert een natuurlijk geheel.

6. Meer witruimte: wees niet bang om grotere witruimten te creëeren (met paddings en margins): whitespace is gratis!

7. Randen: vermijd het gebruik van een rand om content van elkaar te scheiden, pas dit alleen toe als het echt niet anders kan of als je er een specifiek doel mee hebt. Als je elementen van elkaar wilt scheiden, gebruik dan eerst:

   1. Schaduwen,
   2. Subtiel kleurverschil,
   3. Meer whitespace.

8. Iconen: als je een groot icon-pack zoals Font Awesome gebruikt hebben we een paar vuistregels voor je:

   1. Een icon mag niet groter zijn dan de tekst (20px),
   2. De volgorde is eigenlijk altijd: icon - tekst en niet tekst-icon,
   3. Als je een icon als afbeelding bij de tekst wilt gebruiken, ga dan op zoek naar een icon-pack met meer gedetailleerde icons.

En nog een paar punten om te controleren:

9. Huisstijl doorvoeren kan een hele klus zijn, maar met een technisch bureau kan snel wat voor je regelen: geef een bijvoorbeeld een card een border-top van ongeveer 4px. Maak de border-color de kleur van de huisstijl. Klaar.
10. Controleer je consistentie. Consistent zijn is vaak een grote uitdaging maar zeer belangrijk voor een prettig design. Neem bijvoorbeeld verschillen in ruimte tussen elementen. Dit moet altijd gelijk zijn, bijvoorbeeld: 2px, 4px, 6px, 10px, 20px, 100px. Verder niets. Dit principe geldt ook voor de grootte van buttons, kleurtinten, teksten, enzovoort. Hoe minder verschillende varianten hoe beter.
11. En de laatste tip is er eentje om eens in te duiken: zorg voor duidelijke hierarchie in de informatie.