Freshheads Blog » Roel Tuerlings http://www.freshheads.com/blog Alles over Freshheads en meer! Thu, 09 Feb 2012 15:52:04 +0000 en hourly 1 http://wordpress.org/?v=3.0.4 Het belang van goede leesbaarheid http://www.freshheads.com/blog/2012/01/het-belang-van-goede-leesbaarheid/ http://www.freshheads.com/blog/2012/01/het-belang-van-goede-leesbaarheid/#comments Mon, 02 Jan 2012 09:17:52 +0000 Roel Tuerlings http://www.freshheads.com/blog/?p=1884 Als bedrijf wil je het jouw (potentiële) klanten natuurlijk zo makkelijk mogelijk maken. Website gebruikers haken namelijk snel af wanneer ze op je website moeten zoeken naar relevante content. Als vormgever bij Freshheads is het niet alleen mijn taak om een project er mooi uit te laten zien, dat is slechts het halve werk. Het is zeker net zo belangrijk om ervoor te zorgen dat er een visuele hiërarchie ontstaat waarbij goede leesbaarheid centraal staat. In dit artikel laat ik een aantal simpele technieken zien waarmee je dit kunt bereiken.

In de afbeelding hieronder zie je een lijst met artikelen waarvan de leesbaarheid niet optimaal is. De artikelen zijn samengeklonterd tot één grote brok tekst, er zijn geen specifieke focuspunten of attentiewaarde. Hierdoor is de lijst moeilijk te scannen door de gebruiker.

Witruimte
In onderstaand voorbeeld is de overzichtelijkheid verbeterd door meer witruimte toe te passen. Niet alleen tussen de artikelen zelf maar ook tussen de datum en de introtekst, hierdoor is het makkelijker om de titels te scannen. Als laatste is ook de regelhoogte groter gemaakt zodat de tekst minder massief oogt. Merk ook op dat de lijnen tussen de artikelen overbodig geworden zijn bij het gebruik van meer witruimte. De lijst met artikelen oogt nu al een stuk luchtiger, de artikelen zijn herkenbaar als afzonderlijke blokken.

Proportie en kleurgebruik
In het volgende voorbeeld zie je wat proportie en kleur kunnen betekenen voor de leesbaarheid van een pagina. De titels zijn een stuk groter gemaakt en in een ander lettertype geschreven. Doordat de datum in lichtgrijs geplaatst wordt onder de titel ontstaat er een visuele scheiding tussen de titel en de introductietekst. De titels zijn donkerblauw van kleur waardoor ze niet alleen meer opvallen maar ook de indruk geven dat er op geklikt kan worden. Deze combinatie van eigenschappen zorgt ervoor dat content makkelijker te scannen is.

Focus
Wanneer je bovenstaande eigenschappen van witruimte, proportie en kleurgebruik verder doortrekt kan je verschillende focuspunten en hiërarchie  creëren op de pagina. In de volgende afbeelding zie je hier een voorbeeld van. De afbeelding en tekst van het eerste artikel zijn fors groter gemaakt, hierdoor krijgt het artikel meer aandachtswaarde. Met deze techniek kan je de focus leggen op het meest recente of belangrijkste artikel. Daaronder volgen standaard artikelen en als laatste nog een aantal artikelen dat alleen bestaat uit een (kleinere) titel. De focuswaarde van deze lijst is dan van boven naar onder: belangrijk, minder belangrijk, minst belangrijk.

]]> http://www.freshheads.com/blog/2012/01/het-belang-van-goede-leesbaarheid/feed/ 2 Thuisbezorgd.nl in een nieuw jasje http://www.freshheads.com/blog/2011/05/thuisbezorgd-nl-in-een-nieuw-jasje/ http://www.freshheads.com/blog/2011/05/thuisbezorgd-nl-in-een-nieuw-jasje/#comments Thu, 19 May 2011 13:12:20 +0000 Roel Tuerlings http://www.freshheads.com/blog/?p=1523 In opdracht van Thuisbezorgd.nl, de grootste eten-bestelsite van Nederland hebben wij Thuisbezorgd.nl en Takeaway.com voorzien van een geheel nieuw en strak jasje.

Freshheads is verantwoordelijk voor het grafisch- en interactieontwerp van de vernieuwde website. Daarnaast  hebben we ook het ontwerp van overige huisstijlelementen zoals raam- en auto bestickering voor onze rekening genomen.

We zijn erg trots op het resultaat en onze bijdrage aan de household name Thuisbezorgd.nl:

Het nieuwe ontwerp zal de basis vormen van alle Takeaway.com websites. Het Thuisbezorgd team heeft de afgelopen maanden hard gewerkt om de nieuwe website te lanceren en afgelopen dinsdag was het zover. Na een beta periode is de nieuwe site nu landelijk uitgerold.

Bekijk de nieuwe site op Thuisbezorgd.nl.

Smakelijk eten!

]]> http://www.freshheads.com/blog/2011/05/thuisbezorgd-nl-in-een-nieuw-jasje/feed/ 1