» direct naar zoek en menu

Tijdschrift voor webwerkers » Artikel #17

Door de designbril - Wat is een goed ontwerp?

Begin jaren negentig werd de eerste browser, Mosaic, geïntroduceerd en werd internet toegankelijker voor het groter publiek. Samen met de opmaakcode HTML waren de mogelijkheden voor de techneut eindeloos. Je kon de letters variëren in grootte, kleur en stijl. Zelfs plaatjes konden worden getoond. Het resultaat was nog steeds dat het ontbrak aan duidelijkheid en niet onbelangrijk: aan schoonheid.

Terwijl de techneuten sites maakten die er niet uitzagen maar wel enigszins werkten en vooral voorzien waren van de meest moderne vaak nutteloze snufjes, diende een nieuwe groep sitemakers zich aan: de grafisch ontwerpers. Met als enige achtergrond de kennis om drukwerk vorm te geven, begaven zij zich op het gladde internet-ijs. Evenals de techneut die alle technische registers opentrok, wilde de grafische vormgever onderscheidend zijn met creativiteit en originaliteit. Met behulp van ‘wysiwig’ editors maakten ze de prachtigste sites. Vormgevingstechnisch dan, want als je in het bezit was van een 28k8 modem dan was je, voor het eerste plaatje goed en wel geladen was, heel wat telefoontikken verder. Ik weet waarover ik praat, want ik was één van die grafisch vormgevers die dat deden. Oordeel: vorm 9+, functie 3-.

Goede vormgeving?

Gelukkig zijn de grafische internet ontwerpers van toen meegegroeid met de techniek, de mogelijkheden en de beperkingen van internet. Maar wat maakt een site nu een goed vormgegeven site? Ik zal mijn best doen deze vraag te beantwoorden door een aantal punten op te noemen die ik in mijn ontwikkeling tegenkwam, met als doel anderen meer bewust te laten worden van deze (meestal voor de hand liggende) onderwerpen. Tevens helpt het mij weer mijn eigen routinematigheid te controleren. :-)

Snelheid

Vanaf het moment dat de potentiële bezoeker een URL aanklikt of intypt, is het van belang dat de website die eraan gekoppeld is relatief snel op het scherm verschijnt. Het wordt vaak afgedaan als een open deur, maar de ervaring leert dat veel sitebouwers zich snel laten (ver)wennen door ADSL- en kabelsnelheden, waardoor bezoekers met een (56k) modem toch -net als vroeger- benadeeld worden. Oorzaak is vaak het overvloedig gebruik van plaatjes om de site vorm te geven.

Nu sites steeds meer worden opgebouwd vanuit databases, kan het een oplossing zijn om de site en de HTML-elementen voornamelijk op te maken met behulp van stylesheets. Op deze manier kun je tekst, lijnen en tabellen op een eenvoudige manier opmaken.

Onderstaande site, www.lcig.nl, is middels tabellen en stylesheets opgebouwd. Als je stylesheets in de browser uitzet, dan houd je kale HTML (rechts) over.

www.lcig.nl met stylesheetwww.lcig.nl zonder stylesheet

Eerste indruk: herkenbaarheid

De vormgeving van de site zorgt voor een eerste indruk. Pas daarna worden de teksten gescand. De vorm is er om de doelgroep te laten weten dat ze op de juiste plek zijn gekomen: herkenbaarheid van de afzender/organisatie. Deze herkenbaarheid komt voort uit het gebruik van het logo, kleuren, beeldtaal, fotografie, kortom: de huisstijl.

Imagobepaling: huisstijl
Het ontwikkelen van een goede huisstijl is een vrij complex ontwerppproces. Met de huisstijl wordt het imago van een organisatie bepaald. Voor een organisatie is het daarom van levensbelang dat deze uitstraling de juiste is én dat alle communicatieuitingen diezelfde uitraling hebben. Dus zeker ook op een site. Is de site van de telefoongids van KPN nog steeds de telefoongids als er geen logo op staat? En wie is de afzender van de paarse cirkel?

telefoongids - kpnscoot

In het voorbeeld van de telefoongids.nl zijn met name de huisstijl-elementen en de kleur herkenbaar. Hetzelfde geldt voor scoot.nl. De vormgeving in het tweede voorbeeld, de ABN-AMRO-site, is in dit geval minder herkenbaar. Door het bestaande logo te vervangen door een compleet ander (overigens zelfgemaakt) logo, is niet meer duidelijk dat dit de ABN-AMRO-site is.

abn-site met abn logo
abn-site met hunneman logo

Voor wie?
En als er geen huisstijl is waar je de site op kunt baseren? De site moet toch een identiteit krijgen? Soms weet een opdrachtgever al heel goed hoe de site eruit moet komen te zien, hebben ze voorbeelden van andere sites mee en de te gebruiken techniek dient “zeker Flash” te zijn. Op de vraag “waarom” zal meestal als antwoord komen dat de hij/zij dat “mooi vindt”. De fout die de klant dan maakt, is dat er niet gekeken wordt naar de doelgroep en de functie van de site. De belevingswereld en het verwachtingspatroon van de doelgroep bepalen voor het grootste deel de sfeer en taal van de site. Aan de ontwerper de taak om dit om te zetten in een vorm die deze doelgroep aanspreekt.

nos journaaljeugdjournaal

Goed gebruik van combinatie van techniek, vorm en doelgroep. Beide bovenstaande voorbeelden leveren nieuws en komen van dezelfde afzender: de NOS. De taal in vormgeving is duidelijk afgestemd op de doelgroepen die ze ook voor de tv-programma’s voor ogen hebben: jeugdjournaal en journaal.

De volgende voorbeelden tonen allebei een tv-programmering. SBS 6 doet dat duidelijk voor een zeer brede doelgroep, de doorsnee Nederlander in de breedste zin, terwijl Villa Achterwerk meer een specifiekere doelgroep wil aanspreken: jongeren en jong volwassenen.

sbs 6villa achterwerk

Hiërachie en navigatie

De meeste internet-bezoekers hebben haast bij het vinden van informatie en scannen een pagina op een website veelal als een krantenpagina. De koppen worden als eerst beoordeeld op voor de gebruiker relevante informatie. Belangrijk is het dus om onderscheid te maken in hoofdnavigatie, generieke navigatie (bv: home, zoek, contact), subnavigatie en (binnen de uiteindelijke leestekst) kopje, intro, subkopje, leestekst en hyperlinks binnen de teksten. Hiërarchie in het informatieaanbod kan daarom gezien worden als navigatie. Met die navigatie vindt de bezoeker zijn weg door de site en vragen als “Waar ben ik?”, “Hoe ben ik hier gekomen?” en “Waar kan ik naartoe?” dienen daarmee te zijn beantwoordt. Een navigatie die helder en eenduidig is kan daaraan bijdragen. Voor de vorm van de navigatie geldt ook weer dat de doelgroep en zijn verwachtingspatroon de bepalende factoren zijn.

Consistentie

De navigatie kan ervoor zorgen dat de bezoeker weet waar hij zich binnen de site bevindt. Dit is het duidelijkst als de positie van die navigatie op elke pagina binnen de site dezelfde is. Dit geldt ook voor de rest van de opmaak van de pagina: locatie van elementen als navigatie, subnavigatie, beeldmateriaal en tekst, kleur en vorm van deze elementen dienen hetzelfde te zijn. Dit vookomt dat de bezoeker of de weg kwijt is binnen de site of, nog erger, het idee krijgt op een andere site te zijn aanbeland.

De grafische internet ontwerpers van toen zijn meegegroeid met de techniek en zijn geëvolueerd tot echte internetontwerpers die zich niet meer alleen maar met de ‘grafische schil’ bezighouden. Dat zie je nu zeker terug, met name in sites van de landelijke, grote bedrijven en organisaties. Functie en vorm vullen elkaar aan en de internetsites vormen meer een geheel met de communicatie-uitingen en uitstraling van een bedrijf of organisatie.

Auteur

dennis hunneman

is in 1998 afgestudeerd als grafisch ontwerper aan de hogeschool voor de kunsten te Kampen. Sinds 1998 is hij werkzaam bij het ontwerpbureau ‘en/of ontwerp’ te Utrecht waar hij de kneepjes van het internet-vak heeft geleerd.

Op dit moment zijn toegankelijk internet voor gehandicapten en gebruiksvriendelijke vormgeving de speerpunten van zijn werk. Award-winning-site (volgens drempelsweg.nl) is www.zoenenenzo.nl, een seksuele voorlichtingsite voor visueel beperkte jongeren.

Publicatiedatum: 18 september 2002

Let op

Naar Voren is op 18 juli 2010 gestopt met publiceren. De artikelen staan als een soort archief online. Het kan dus zijn dat de informatie verouderd is en dat er inmiddels veel betere of makkelijkere manieren zijn om je doel te bereiken.

Copyright © 2002-heden » NAAR VOREN en de auteurs