How to; Een goede website ontwerpen

Een goede website ontwerpen is iets waar ik veel over geleerd heb de afgelopen jaren. Onder andere tijdens mijn stage bij een internet bureau. Veel mensen denken dat ze een giga flashy website moeten hebben om erbij te horen. Echter ligt daar niet de kern van succes. Het aller belangrijkste aan een website is dat hij voor de bezoeker duidelijk is. Dat je makkelijk kunt navigeren, kunt vinden wat je zoekt en je een duidelijk overzicht hebt van wat het bedrijf je aanbiedt. In deze blogpost geef ik een aantal tips die je kunt toepassen op je website om ervoor te zorgen dat dit gebeurd.

website-yourplan


Als ik een website ontwerp voor een klant gebruik ik altijd het volgende metafoor; “Je kunt een website eigenlijk zien als een kast. Die kast is helemaal volgestouwd met allerlei informatie en spullen. Als je de kast weer overzichtelijk en op orde wil krijgen haal je eerst alles eruit en ga je het sorteren. Spullen die bij elkaar horen doe je samen in een mandje, informatie die niet meer aan de orde is gooi je weg, enzovoorts. Bij een website doe je eigenlijk precies hetzelfde maar dan digitaal. Je zorgt er voor dat net als in de kast, alles weer goed te vinden is en het er weer netjes en aantrekkelijk uitziet.”

Onthoudt ook goed dat je een website niet ontwerpt voor jezelf, maar voor je klanten, je doelgroep. Heb je bijvoorbeeld een webshop in babykleertjes voor jongetjes, dan gebruik je natuurlijk geen roze, ook al vind je dat zelf misschien een mooie kleur. Ook hoef je de website niet vol te stouwen met kinderplaatjes, want de baby zal natuurlijk niet zelf de kleding kopen. Dit doen de ouders of de mensen die een leuk cadeau willen kopen voor de pasgeborene. Zorg er dus voor dat het ontwerp hun aanspreekt.

Als je deze twee dingen in je achterhoofd houdt bij het ontwerpen van een website ben je al een heel eind op weg. Daarnaast zijn er nog een aantal onderdelen die ik wil toelichten. Deze zijn belangrijk in een website. Ze zorgen ervoor dat je website voor de bezoeker extra helder en overzichtelijk wordt en de kans is dan groot dat ze langer blijven hangen en doorklikken naar andere pagina’s op je website.

1. DUIDELIJKE NAVIGATIE
Een menu is onmisbaar in een website, op deze manier kan de bezoeker door je site heen navigeren. Zorg ervoor dat je menu duidelijk zichtbaar is op je website. Je menu moet niet teveel items bevatten, vijf of zes menu items zijn ruim voldoende. Verwerk hierin ook een ‘about’ pagina en een ‘contact’ pagina. Je menu is eigenlijk de basis van je website, al je informatie moet je onder deze menu-items kwijt kunnen op een logische manier.

2. BROODKRUIMELS
Broodkruimels zijn aparte kadertjes en/of buttons waar je op kunt klikken zodat je direct op de pagina uitkomt waar je de rest van de informatie kunt vinden. Deze worden op de hele website gebruikt en zorgen ervoor dat je bezoeker heel snel verder kan klikken op je website zonder je menu te gebruiken. Denk bijvoorbeeld aan een ‘vraag hier gratis en vrijblijvend een offerte aan’ knop. Het is heel handig als je deze uitlicht, want wanneer de bezoeker dan genoeg informatie heeft verzameld kan hij/zij gelijk op deze broodkruimel klikken en het kost hem/haar geen extra tijd door het op te zoeken. Maar ook als je bijvoorbeeld nieuwe portfolio items hebt toegevoegd is het handig om dit ergens op de site terug te laten komen. Bijvoorbeeld ‘nieuwste projecten’ en dan een knop met ‘bekijk het portfolio’.

3. HEADER
De header is de bovenkant van de website. Hier staat logischerwijs altijd je logo, je slogan en het menu. Ook vind je hier vaak een zoekbalk en social media icons. Het is belangrijk dat je header helemaal perfect is, want dit is immers het eerste wat mensen zien als ze op de website terecht komen. Zorg voor een mooi, overzichtelijk en rustig ontwerp waarbij alle onderdelen duidelijk opvallen en makkelijk van elkaar te onderscheiden zijn.

4. FOOTER
Een goede website heeft ook altijd een footer. Dit is de onderkant van de website. Hier staan vaak de contact gegevens vermeldt en komt het menu nogmaals terug. Als je het menu er niet hebt staan is een ‘scroll to top’ button een erg slimme zet. Of beide kan natuurlijk ook. Een zoekfunctie is ook handig in de footer en de social media icons kun je er ook herhalen. Op deze manier hoeft de bezoeker als hij het hele artikel heeft gelezen geen moeite meer te doen om de belangrijkste dingen te zoeken, ze worden gewoon gepresenteerd in de footer en men kan makkelijk door klikken of contact opnemen etc.

5. VEEL BEELD, WEINIG TEKST
Een website is geen boek. Ben jij langdradig? Kun je uren praten over je bedrijf, visies en portfolio? Een website leent zich daar niet voor. De bezoeker wil snel informatie en heeft geen tijd en zin om lange teksten te lezen. Zorg dus dat je informatie kort en beknopt is. En zorg voor veel beeld, beelden zeggen soms meer dan 1000 woorden! Plus dat het visueel veel aantrekkelijker is.

6. OVERZICHTELIJK
Als laatste tip wil ik je meegeven om ervoor te zorgen dat je de website overzichtelijk ontwerpt. Vermijd drukke pagina’s die vol staan met allerlei verschillende content. Maak het een geheel en wees niet bang om dingen weg te laten. Wanneer je op je homepage een slogan of foto o.i.d plaatst dat de nieuwsgierigheid wekt, klikken bezoekers vanzelf wel door. Echter, maak het wel in 1 oogopslag duidelijk waar de bezoeker is beland. Het is een kwestie van honderd keer alles veranderen, allerlei combinaties uitproberen en je komt vanzelf uit op het beeld die past bij het bedrijf. Succes en zet hem op!

Als laatste wil ik jullie een visueel voorbeeld geven van een website die ik heb ‘gerestyled’.
Het betreft de website van Acem, en ik heb deze tijdens mijn stage mogen ontwerpen.

acem1
Dit is de website hoe die eerst was. Zoals je ziet is het visueel totaal niet aantrekkelijk want het bestaat alleen maar uit tekst. Het menu is verschrikkelijk lang en je hebt zoveel keuzes dat je al geen zin meer hebt om ergens op te klikken.

acem2
Dit is de website na de restyle. Een duidelijk en kort menu die is onder verdeeld in verschillende categorieën zodat het navigeren een stuk makkelijker en aantrekkelijk wordt. Ook is er gezorgd voor beeld om het visueel aantrekkelijk te maken. De verschillende afdeling zijn in een broodkruimel verwerkt onder het kopje ‘locaties’. Zo kan je als bezoeker in een heel simpel overzicht gelijk zien waar ze gevestigd zijn en of er ook 1 in de buurt is. Ook kun je makkelijk een locatie aanklikken als je er meer over wilt weten.

Meer als de helft van de informatie die op de oude website stond is niet relevant en wordt niet meer gebruikt in het nieuwe ontwerp. Alleen de informatie die er echt toe doet en die ervoor zorgt dat de bezoeker precies weet wat ze doen is online gezet. Je wordt dus niet overspoelt met onnodige info die je duizelig maakt en je doet wegklikken.

Disclaimer; Deze tips zijn leidraden voor het ontwerpen van een goede website. Echter ben ik als ontwerper van mening dat er geen regels zijn in creativiteit. Zoek dus gerust randjes op en ga er eventueel over heen. Wie weet levert dat juist een beeld op wat je zoekt. Experimenteer, creëer en geniet! Ook zijn deze tips vooral bedoeld voor websites voor bedrijven en niet perse voor blog sites.

Nu jij! Heel veel succes met het ontwerpen van een website en mocht je nog vragen hebben dan kun je me altijd mailen.
Heb jij een eigen website? Zo ja, heb jij deze tips toegepast?