De grafisch designers van DTC Media Online zijn onmisbaar voor ons én onze klanten. Bij bijna elk product, van website tot brochure, zijn zij betrokken. Zij vertalen onze ideeën naar een visuele werkelijkheid en daarbij maken ze gretig gebruik van… niets. DTC Online Designer Mike Jansen vertelt in deze blog over het onzichtbare element binnen design: witruimte. Waarom vervult dit zo’n belangrijke functie binnen een actiepagina, e-mail of banner?

Wat is witruimte?
De term witruimte betekent niets anders dan de lege ruimte tussen en rondom elementen. Denk daarbij aan titels, visuals en call to actions. Witruimte is niet slechts een ‘achtergrond’. Het speelt een belangrijke rol en kan worden beschouwd als actief element binnen een design, hoewel er eigenlijk ‘niets’ gebeurt.

Bij witruimte denk je misschien ook aan de kleur ‘wit’, maar dit hoeft niet het geval te zijn, witruimte kan elke kleur zijn, zolang deze ruimte maar niet concurreert met de focus van de elementen van een design. Andere benamingen voor witruimte (whitespace) zijn ook wel blank space of negative space.

Blog-het nut van niets-1

User interface en witruimte
Witruimte is eigenlijk bij alle elementen van een design betrokken. Tekst, buttons, logo’s en visuals hebben allemaal ademruimte nodig. Deze ruimte creëer je door middel van margin, padding, gutters, line-spacing en letter-spacing – allemaal termen die duiding geven aan een bepaalde manier van ruimtegebruik. Het gebruik van die ruimte heeft vier verschillende functies voor alle overige elementen:

  • Begrijpelijk maken
  • Relaties verduidelijken
  • Aandacht trekken
  • Gevoel van luxe creëren

Begrijpelijk maken
Witruimte zorgt ervoor dat het lezen en scannen van content eenvoudiger wordt. Door dit goed toe te passen verhoog je zowel de legibility (het kunnen onderscheiden van letters en woorden) als de readability (het kunnen scannen van content). Een klein beetje extra ruimte tussen een titel en een alinea verhoogt dus al de leesbaarheid.

Blog-het nut van niets-2

Relaties verduidelijken
Naast het begrijpelijk maken van content zorgt witruimte ook voor het vormen van relaties tussen content. Witruimte dient dan als visual cue, oftewel een hint. Om meer duidelijkheid te geven aan je content kan witruimte ingezet worden om elementen gegroepeerd weer te geven. Op deze manier wordt je content meer als eenheid gezien. Een prachtig voorbeeld van goed en slecht gebruik van witruimtes met betrekking tot de relatie is het formulier. In het voorbeeld is duidelijk te zien welke ‘labels’ en ‘invoervelden’ bij elkaar horen als witruimte juist wordt toegepast. Het formulier wordt hier veel gebruiksvriendelijker van.

Blog-het nut van niets-3

Aandacht trekken
In veel reclame-uitingen staat ontzettend veel informatie, omdat je de consument natuurlijk graag zo duidelijk mogelijk wilt vertellen wat je actie is en wat daarvan de voordelen zijn. Het liefst valt ie ook nog even flink op. Het gevolg hiervan kan zijn dat de consument een information overload krijgt door deze opeenhoping van elementen. Kies er daarom bewust voor om sommige elementen te laten ontbreken om andere elementen meer op te laten vallen. Daarbij geldt: hoe meer witruimte, hoe meer aandacht voor dit element. Op deze manier kan witruimte goed worden toegepast om een duidelijke visuele hiërarchie te creëren voor de over te brengen boodschap.

Hoe moet het dus niet? In dit voorbeeld zie je alles wat het prachtige programma Word te bieden heeft (dit is natuurlijk wel een heel oude versie). Duidelijk is dat er echt ontzettend veel mogelijk is in een Word document, maar wordt het ook duidelijk door al die opties te laten zien? Nee. Hier vindt een information overload plaats. De gebruiker zal zo veel te lang moeten zoeken naar de functie of het element die hij of zij wil toepassen, daarnaast is het daadwerkelijke document waarin je aan het typen bent zo goed als onzichtbaar.

Daarentegen kan het ook anders – in dit voorbeeld is de witruimte goed toegepast om samenhangende content als eenheid te tonen en opvallender te maken. Je ziet simpelweg drie ‘hoofdelementen’ die allemaal een heel duidelijk doel hebben: 1. navigeren, 2. informeren en 3. registreren.

Blog-het nut van niets-4

Gevoel van luxe
Vormgevingstechnisch is witruimte ook in te zetten vanuit een esthetisch oogpunt. Door het gebruik van witruimte kan je een bepaalde elegantie aan je merk of campagne meegeven. Witruimte voegt een extra gevoel van toewijding en luxe toe aan je merk, campagne of product, omdat je het zo positioneert dat het belangrijker lijkt dan alles wat er verder binnen die omgeving staat.

In deze voorbeelden is duidelijk te zien dat het draait om het product. Veel witruimte zorgt voor extra focus op het product. Het helpt natuurlijk als het product zelf ook enigszins een luxe uitstraling heeft.
In het voorbeeld van Bose zorgen visuals, typografie en witruimte samen voor het luxe gevoel dat het product je geeft. Een sfeervisual die duidt op een buitengewone ervaring van het geluid en een korte beschrijvende tekst zorgen ervoor dat je al een bepaald gevoel krijgt bij dit product. Een heel ander gevoel dan bijvoorbeeld een nieuwe speaker die toevallig voor de helft van de prijs wordt verkocht bij de Action.

Blog-het nut van niets-5

Kortom, door goed gebruik van witruimte zorg je voor duidelijkere content, leg je focus op elementen die er echt toe doen en kun je net dat beetje extra luxe aan je merk, campagne of product meegeven. Best waardevol voor iets dat je eigenlijk ‘niet’ ziet.

 

Over de DTC expert

Mike Jansen is Online Webdesigner bij DTC Media Online. Hij is altijd op zoek naar inspiratie en toffe designs voor onze klanten. Weten wat Mike voor je kan betekenen? Of heb je vragen over deze blog? Neem dan direct contact met hem op.

Ook interesse in een samenwerking?

Wij werken samen met o.a.:
Logo Hubspot Silver Partner Logo Activecampaign Partner Logo Google Partner Logo Bing Ads Logo Visual Website Optimezer Logo Visual Website Optimezer