5 stappen voor een mooie layout

Webdesign is best lastig, hoe kom je nu aan een mooie layout waar je zelf tevreden over bent en die anderen aanspreekt? Daarnaast wil je toch ook dat je website een hedendaagse uitstraling heeft en niet als oubollig of cliché wordt gezien. Al met al kun je best een 5 stappenplan gebruiken om je webdesign onder handen te nemen.

1. Research

Eerst zul je moeten onderzoeken wat je mooi vindt. Of wat de opdrachtgever mooi vindt. Het gaat hierbij om twee zaken, research offline en research online. Offline research doe je door te kijken naar wat je mooi vindt bij bijvoorbeeld boeken, tijdschriften, foto’s, onderweg, reclame enzovoort. Je krijgt dan een idee wat je zelf mooi vindt en wat niet.

moodboard voorbeeldJe kunt hier van een soort moodboard maken. Dat is een impressie van alles wat je leuk, mooi en esthetisch vindt. Probeer hierbij je niet te laten beperken door wat anderen vinden, laat je fantasie hierin de vrije loop. Pas dan krijg je een goed idee.

Online research bestaat uit twee onderdelen. Welke sites vindt je mooi en welke niet. Daarbij hoort de vraag ook waarom wel of niet. Je kunt een site mooi vinden vanwege een bepaalde kleurencombinatie of vanwege een bepaald lettertype.

Een site kun je lelijk vinden door verkeerd gebruik van kleuren of teveel gebruik van bijvoorbeeld Flash.

Kortom, je geeft je zelf een beeld van wat je wel en niet mooi vindt. Deze twee bij elkaar gaan de basis vormen voor de verdere opzet van je webdesign.

2. Structuur

De tweede stap is het opzetten van een structuur voor je website. Welke onderdelen bevat een website en hoe moeten die onderdelen verband met elkaar houden. Wederom is pen en papier een uitkomst om ervoor te zorgen dat je goed duidelijk krijgt hoe een en ander eruit gaat zien. Maak een schets en verbind de verschillende onderdelen met elkaar. Zoiets:

website diagram

Hiermee krijg je inzichtelijk hoe je website in elkaar zit, wat je moet toevoegen, wat belangrijk is en wat je wilt dat bezoekers zien, en waar ze heen gaan.

3. Navigatie

Een van de meest onderschatte onderdelen van veel websites is de navigatie. Veel bezoekers komen niet binnen via de homepagina, maar via bijvoorbeeld een artikel. Daarom is een navigatie onmisbaar. En je moet ervoor zorgen dat deze ook op iedere pagina hetzelfde is. Zo kun je een horizontale navigatie plaatsen die voor elke pagina hetzelfde is, en daaronder, of links een navigatie met daarbij een uitbreiding van de verschillende onderdelen binnen een bepaalde categorie.

Aan de hand van de structuur van de website zoals je die hierboven hebt bepaald, maak je je navigatie compleet. Voorwaarde is dan dat elk onderdeel via maximaal twee klikken bereikbaar is.

4. Afbeeldingen en kleur

Nu komt het leukste onderdeel, op zoek gaan naar kleuren en plaatjes die inhoud geven aan de stijl van je website. Het gaat hierbij niet alleen om afbeeldingen die aan een pagina worden toegevoegd, maar ook achtergrond afbeeldingen of bijvoorbeeld schaduwafbeeldingen. Zo kan het een verschil maken als een zijkant van een webpagina een schaduwrand bevat in tegenstelling tot een zwarte lijn.

Ook een logo kan een leuke uitdaging zijn. Je kunt in ieder geval dagen zoet zijn om het juiste logo te ontdekken. Het moet de juiste ‘look en feel’ hebben en dat is niet eenvoudig, maar leg je niet neer bij surrogaat, maak of koop iets waar je helemaal achter kunt staan.

Enige tijd geleden heb ik een artikel geschreven over webpagina’s die je helpen bij het krijgen van de juiste kleuren voor een website.

5. Alles komt samen

Tenslotte komt alles samen. Je gaat ontwerpen. De een gebruikt Photoshop, de andere bouwt gewoon. Zorg dat het idee er achter klopt. Zorg ervoor dat de onderdelen die je bedacht hebt erin zitten, zorg dat je de juiste kleuren gebruikt en de juiste plaatjes en afbeeldingen toevoegt, maar laat er in deze fase ook anderen naar kijken. Wellicht zie je zelf iets over het hoofd en heeft een ander een goede blik.

Laat anderen de navigatie uitproberen en observeer wat ze doen en hoe ze verder gaan. Praat er met ze over en verfijn de onderdelen die er zwak uitkomen.

Succes!

8 Reacties

  1. @DePrins
    Mooi is een relatief begrip, als je de doelgroep gaat polsen dan krijg je allemaal verschillende meningen. Het gaat erom wat de opdrachtgever met de site wil, dat dit vervolgens consequenties heeft is helemaal waar. Een doelgroep jongeren stelt andere eisen dan een doelgroep 65+. Maar de opdrachtgever bepaalt wie hij als doelgroep heeft/wil (van tevoren althans).

  2. Ik geef DePrins hierboven groot gelijk hoor. De doelgroep is uiteindelijk de groep die de site gaan gebruiken, niet de opdrachtgever.

    Stel dat je een tuttige vrouw hebt als opdrachtgeefster. Deze vrouw houd heel erg van kitschie patroontjes, en van rose.
    De site die ze wil, gaat over fitness spullen. Denk je echt dat je een site gaat ontwerpen naar wensen van de klant, echt niet!

    Misschien een beetje een overdreven voorbeeld, maar het illustreert perfect dat je doelgroep de belangrijkste mensen zijn. Dus beter advies zou zijn, kijk naar goede sites van concurrenten, en doe misschien maar eens een doelgroep onderzoek. Er komen hier dan wel zeer uiteenlopende meningen uit, maar er zal altijd een patroon zijn in je bevindingen. Dit kun je dan uiteindelijk gaan gebruiken voor je site.

    Je vergeet ook de belangrijkste stap: Ervaring. Zorg dat je skills helemaal up to date zijn als je een goede layout wilt maken.

  3. mwah, niet helemaal mee eens Daan.

    Als jouw opdrachtgever het niks vind en ook al sluit het perfect aan bij de doelgroep, dan nog zal hij het niet goedkeuren. Maar meestal gaat het hand in hand. Doelgroep vind het goed, opdrachtgever vind het goed.

    Maar ik kijk bijna altijd eerst naar andere sites. Zoek template sites af naar inspiratie. En na een uur zoeken, heb ik meestal wel iets in mijn hoofd.

    Mijn tip is eigenlijk gewoon blijven oefenen en elke keer iets anders doen.
    Als je blijft oefenen en je maakt heel de tijd een soort gelijk design, leer je niks en kan je ook niks meer. Maar maak je elke keer een nieuwe design met totaal nieuwe elementen, leer je er veel meer van.

  4. Het was ook een sterk overdreven voorbeeld, mijn punt was dat als je alles zou ontwerpen precies naar wens van de opdrachtgever, je vaak met iets slechts zal eindigen.

  5. Toch is de klant koning! Deze betaalt (als het goed is) voor het ontwerp. Je moet hier dus zeker rekening mee houden.

    Uiteraard is de doelgroep ook belangrijk, maar meer in de zin van usability (naar mijn mening). Je doelgroep moet de site goed en makkelijk kunnen gebruiken. Het ontwerp heeft hier natuurlijk invloed op, maar een lelijk ontwerp kan tevens gebruiksvriendelijk zijn.

    Als je klant iets wilt wat echt niet kan, moet je dat bespreken. Communicatie is belangrijk: maak duidelijk wáárom hetgeen wat de klant wilt niet kan. Leg het uit, dat is goed voor je geloofwaardigheid. Jij bent immers de expert, niet je klant.

    Maar nogmaals, hoe je het ook went of keert: de klant is koning. In het extreme geval weiger je de opdracht… Je bent niet verplicht om dingen te doen waar je (als ontwerper) niet achter staat.

  6. “Jij bent immers de expert, niet je klant.”

    Dat is het punt dat ik wil maken. Natuurlijk weet ik dat je naar de opdrachtgever moet luisteren.

    Je zegt zelf dat het ontwerpen voor de doelgroep vooral op het gebied van usability zit. Dit zou dus betekenen dat als je ontwerpt zonder deze groep in gedachte te houden, je een niet (goed) te gebruiken website krijgt.

    En zoals ik al zei, er zijn wensen van de opdrachtgever, maar het moet niet zo zijn dat deze elke stap in het creatieve proces beheerst, bepaald en beoordeelt.

    Er zit gewoon een lijn tussen je klant zijn/haar wensen, en de dingen waar je webpagina zeker aan moet voldoen, als het een ten koste gaat van het ander, gaat het niet goed.

Een reactie achterlaten

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *