Editie 3 van usabilityweb magazine. Een gratis magazine dat we versturen aan iedereen die zich hiervoor aangemeld heeft.

1. Magazine
Nummer 3, 2007 ISSN: 1871-6393
2 De hegemonie van de Amerikanen!
Stefan Wobben
4 AB Testing
Marleen Nagengast
8 Hoezo aandacht voor opmaak bij
e‑mail nieuwsbrieven?
Hans Jacob de Gier
13 De homepage van morgen
Leonard Verhoef
17 Microformats
Johannes la Poutre
Over Usabilityweb Magazine
Je kunt je aanmelden voor het Usabilityweb Magazine
door een e-mail te sturen naar stefan@concept7.nl. Dit
geldt voor zowel de ontvangers van het magazine als
voor gastauteurs die graag een bijdrage willen leveren
aan dit initiatief.

2. Column
De hegemonie
van de Amerikanen!
Jaarlijks stelt het World Economic Forum Als we kijken naar de top tien van meest
de Networked Readiness Index (NRI) bezochte websites door Nederlanders,
samen. Dit is een rangorde van landen met dan zien we dat deze vooral gedomineerd
de grootste technologische vooruitgang. wordt door Amerikaanse giganten als
Er wordt dan gekeken naar ICT-infrastruc- Google, Microsoft, Yahoo, Wikipedia
tuur, algemene kennis en vaardigheden en en YouTube. Pas op nummer zes komen
gebruik van ICT-toepassingen. we de eerste Nederlandse website tegen:
Hyves.nl. De volgende twee Nederlandse
De top tien wordt gedomineerd door websites staan op respectievelijk plaats
West-Europese landen. Denemarken en negen en tien. Dit zijn Marktplaats.nl
Zweden staan aan kop en Noorwegen is de en NU.nl. Bij de andere Europese landen
hekkensluiter. Nederland staat op num- van de NRI is dit niet veel anders en zien
mer zes, net een plaatsje boven de VS, die we een vergelijkbaar beeld. Second Life,
op nummer zeven staat. Nummer drie, Firefox, Amazon.com, LinkedIn, Flickr,
Singapore, is samen met de VS het enige MySpace, het zijn allemaal Amerikaanse
niet-Europese land. innovaties. Is het louter toeval of bestaat
er een logische verklaring?
De ICT-randvoorwaarden zijn in West-
Europa dus goed op orde. Waarom zijn Laat ik eens kijken naar de inwonersaan-
er dan zo weinig internetdoorbraken uit tallen. Hieruit blijkt dat de VS ongeveer
Europa afkomstig? drie keer zoveel inwoners heeft als alle
andere Europese landen van de top tien
samen. Omdat er meer inwoners zijn,
Top tien NRI 2006–2007
zullen er ook meer internetinitiatieven
1 Denemarken worden ontplooid en hoe meer initiatieven
2 Zweden er worden ontplooid des te groter de kans
dat iets doorbreekt. Dit is ongetwijfeld
3 Singapore van invloed maar voor mij onvoldoende
4 Finland verklaring voor de hegemonie van de VS.
5 Zwitserland
Je kunt ook kijken naar de ontstaans-
6 Nederland geschiedenis van de succesverhalen. Veel
7 Verenigde Staten van deze initiatieven zijn begonnen voor
8 IJsland de millenniumwisseling. Als we naar de
NRI-index van deze periode kijken, dan
9 Verenigd Koninkrijk zien we dat de VS jarenlang op nummer
10 Noorwegen één stond. Dat zou een verklaring kunnen
zijn. In 1999 bezat Nederland echter wel
al de negende plaats en de Scandinavische
2 Usabilityweb Magazine Nummer 3, 2007

3. landen deden het ook al bovengemiddeld
goed. Dat verklaart dus ook onvoldoende
waarom een YouTube niet Zweeds is.
Heeft het dan te maken met het onder-
nemersklimaat? Volgens het Economisch
Instituut voor het Midden- en Kleinbedrijf
(EIM) zijn er grote verschillen: “Opvallend
is dat het starten van een eigen bedrijf in
Amerika zo gewoon wordt gevonden. On-
derwijs, cultuur, kapitaalmarkt en andere
instituties vormen er een ‘virtuous circle’.”
In Finland doen ze iets soortgelijks, het
Finse model, heet het daar. Onderzoek,
ontwikkeling en opleidingen streven al-
lemaal naar technologische innovaties en
er is een intensieve samenwerking met het
YouTube (youtube.com) bedrijfsleven. Wellicht een verklaring voor
het succes van Nokia?
Met alleen randvoorwaarden heb je echter
nog geen succes. Om te slagen op de
mondiale markt moet je uitvoering perfect
zijn. Op het internet heeft de consument
de macht. Je website moet dus naadloos
aansluiten bij de behoeften en wensen van
je klanten. Klantgerichtheid is een trucje
dat ze in de VS erg goed beheersen. De
vanzelfsprekendheid waarmee methoden
van user-centered design worden toe-
gepast, geeft de Amerikanen een grote
voorsprong. In Nederland moet je nog
uitleggen dat je eerst persona wilt maken.
In de VS daarentegen moet je uitleggen dat
je géén persona gaat maken.
Second Life (secondlife.com) Deze continue focus op de eindgebruiker
maakt een wereld van verschil. En dát is,
denk ik, een van de belangrijkste verkla-
ringen van de hegemonie van Amerikaan-
se websites.
Stefan Wobben
stefan@concept7.nl
Hyves (www.hyves.nl)
Usabilityweb Magazine Nummer 3, 2007 3

4. Goede testmethode of hype?
A/B Testing
De term ‘A/B testing’ hoor je steeds vaker in de wereld die ‘internet’ heet.
Maar wat is A/B testing eigenlijk precies? Is het gewoon een populair begrip,
een hype? Of is het een onderzoeksmethode die een substantiële bijdrage
kan leveren aan het verbeteren van websites? De meningen hierover zijn
verdeeld. Om een oordeel te kunnen vormen, is het echter van belang om
eerst te weten te komen wat A/B testing is en hoe het precies werkt.
Bij beide versies wordt dezelfde actie geme-
Wat is A/B testing?
ten, bijvoorbeeld het aanvragen van infor-
Bij deze methode worden bezoekers van matie of het aanmelden voor een nieuws-
een website willekeurig opgedeeld in twee brief. Er wordt zo getest bij welke versie de
groepen, groep A en groep B. Deze bezoe- actie het meest succesvol is. Op deze ma-
kers merken zelf niks van deze opdeling, nier worden de effecten van design in kaart
ze zijn zich er dan ook niet van bewust dat gebracht. A/B testing speelt dan ook voor-
ze meedoen aan een onderzoek. Dit is een namelijk een controlerende rol tijdens het
groot voordeel van deze testmethode. Bij A/ verbeterproces van een website.
B testing heeft de onderzoeker dus ook geen
invloed op het gedrag van de bezoekers. De
Werkwijze
onderzoeker kent de bezoekers niet. Dit al-
les komt de betrouwbaarheid van het on- Bij het toepassen van een A/B-test kan de
derzoek ten goede. A/B-tests meten het volgende werkwijze worden toegepast.
daadwerkelijke gedrag van bezoekers.
Fase 1: doelstelling
Bij elke bezoeker wordt opgeslagen in welke Hier geldt de tegelwijsheid “meten is weten”.
groep hij of zij zit. Een terugkerende bezoe- Meet eerst bijvoorbeeld alle bezoekers, be-
ker zal daardoor telkens in dezelfde groep zoeken en pageviews. Zoek vervolgens naar
terechtkomen. verbeterpunten en formuleer deze als een
meetbaar doel.
Elke groep krijgt een andere versie van
een webpagina te zien. Deze twee versies Voorbeeld: 2% van alle bezoeken moet lei-
verschillen op slechts één punt van elkaar, den tot de verkoop van een product.
bijvoorbeeld het kleurgebruik of de tekst-
grootte. Soms is versie A het huidige design Dit voorbeeld is gebaseerd op een populair
en ziet het grootste deel van de bezoekers doel: omzetverhoging. Deze twee procent
deze versie. Versie B is dan een meer uit- zal dan wel een stijging moeten zijn ten op-
dagende versie die slechts aan een kleine zicht van de huidige verkoopaantallen. Deze
groep wordt getoond totdat het zijn waarde huidige verkoopaantallen moeten daarom
bewezen heeft [1]. wel eerst in kaart zijn gebracht.
Usabilityweb Magazine Nummer 3, 2007

5. Fase 2: verbeterpunten Nu is beschreven wat A/B testing is en hoe
Met de nieuw geformuleerde doelstelling het uitgevoerd kan worden, is het leuk om
in het achterhoofd worden op basis van be- eens te kijken naar een voorbeeld uit de
staande richtlijnen, de kennis en ervaring praktijk.
van usabilityexperts of de uitkomsten van
een gebruikerstest aannames gemaakt over
Usabilityweb
de manier waarop de doelstelling bereikt
kan worden. Hiervoor kan gebruik worden Erik Nijland heeft voor zijn afstudeeronder-
gemaakt van verschillende publicaties zoals zoek van de opleiding ‘Communicatiesyste-
Handboek Website Usability [2], Website- men: Multimedia ontwikkeling’ onder an-
usability [3] en de Research-Based Web De- dere een A/B-test uitgevoerd op de website
sign Usability Guidelines []. In dit laatste www.usablityweb.nl.
document staan meer dan 200 richtlijnen
omtrent gebruiksvriendelijkheid. Tijdens een kleine gebruikerstest met zes
deelnemers kwam één punt herhaaldelijk
Voorbeeld: naar voren, namelijk: “Het leest niet zo pret-
tig.”
Aanname: “Bezoekers kopen zo weinig
omdat ze de bestelknop, die telkens op een Er zijn vervolgens drie richtlijnen gevonden
andere plek staat, niet kunnen vinden.” die invloed hebben op de leesbaarheid []:
Richtlijn: “Plaats belangrijke items consi- • Limit the Number of Words and Senten-
stent.
” ces
Fase 3: uitvoeren • Optimize Display Density
Een webdesigner krijgt vervolgens de taak
om de website te verbeteren aan de hand • Use Moderate White Space
van één aanname. Meer dan één aanname
gebruiken voor het aanpassen van een de- De eerste richtlijn stelt dat een zin maximaal
sign is ook toegestaan, maar besef dan wel twintig woorden mag bevatten en elke pa-
dat het effect per aanname niet meetbaar ragraaf maximaal zes zinnen. De content op
is. usabilityweb voldeed al aan deze richtlijn.
Vervolgens is het wachten op onderzoeks- De tweede en derde richtlijn beïnvloeden el-
resultaten. Het is aan te raden om minimaal kaar. Het blok met content op usabilityweb
twee weken te wachten. Vergelijk vervol- bevatte te veel witruimte. Door deze grote
gens de onderzoeksresultaten per week. witruimtes ontstaat er een lage dichtheid
Als deze ongeveer gelijk zijn kan deze fase van content. Tekst met een lage dichtheid
worden afgesloten. Als er duidelijke ver- wordt minder snel gelezen.
schillen merkbaar zijn, wacht dan nog eens
twee weken, net zolang totdat er twee even Het doel is om bezoekers een “prettige lees-
lange periodes zijn met gelijke onderzoeks- ervaring” te bezorgen.
resultaten.
Voor dit onderzoek zijn vier weken lang sta-
Fase 4: evaluatie tistieken verzameld. Er zijn twee betrouw-
Na het onderzoek wordt gekeken of de baarheidintervallen van twee weken gehan-
nieuwe doelstelling is behaald. Dit is echter teerd. De resultaten per interval zijn vrijwel
niet voldoende. Kijk ook naar statistieken gelijk (zie tabel 1), tijd heeft geen duidelijk
van zoveel mogelijk andere aspecten van de meetbare invloed op de uitslag van dit on-
website. derzoek.
Voorbeeld: Het opvallender tonen van het De doelstelling om de leessnelheid te ver-
offerteaanvraagformulier heeft geleid tot hogen lijkt geslaagd (zie tabel 2). Pagina’s
meer aanvragen. De doelstelling is be- worden gemiddeld 26 seconden korter be-
haald. Maar als dit betekent dat er minder zocht. Dit lijkt op een stijging van de lees-
producten zijn verkocht (zonder eerst een snelheid van meer dan 0 procent.
offerte aan te vragen) dan hoeft er geen
sprake te zijn van een verbetering.
Usabilityweb Magazine Nummer 3, 2007

6. Afbeelding 1: Boven versie A (de originele versie), onder versie B (fixed layout)
6 Usabilityweb Magazine Nummer 3, 2007

7. Ik denk dat gesteld kan worden dat A/B tes-
Tabel 1: resultaten A/B-test per interval
ting niet alleen maar een hype is. Het is wel
Periode: 19 mei 2006 tot en met 16 juni 2006 degelijk een methode die zinvolle resultaten
Aantal seconden per pageview kan opleveren (zie bovenstaand voorbeeld),
zeker voor organisaties die structureel be-
Versie A 477 zig zijn met het verbeteren van hun website.
Versie B 220 Maar of het ook echt een methode is die een
Periode: 17 juni 2006 tot en met 4 juli 2006 substantiële bijdrage levert? In combinatie
met andere methoden waarschijnlijk wel.
Aantal seconden per pageview
Versie A 501 De voorbereiding is bij A/B testing essen-
Versie B 246 tieel. Weet wat je precies wilt meten en
ga niet lukraak de methode inzetten, om-
dat je nou eenmaal wil testen. De doelen
moeten duidelijk zijn! Kies een pagina en
Tabel 2: resultaten A/B-test gehele testperiode
onderbouw deze keuze. De aanpassingen
Periode: 19 mei 2006 tot en met 4 juli 2006 die getest worden, moeten gebaseerd zijn
Aantal seconden per pageview op gedegen onderzoek. Er kan bijvoorbeeld
gebruik worden gemaakt van richtlijnen die
Versie A 489 reeds door anderen onderzocht zijn en die
Versie B 233 hun waarde hebben bewezen.
Met een gedegen voorbereiding kun je met
A/B-tests inderdaad eenvoudig resultaten
Dat de leessnelheid is gestegen, is echter behalen. Realiseer je echter ook dat de me-
niet met zekerheid te concluderen. De enige thode niet zaligmakend is. Het is één van de
zekerheid is het feit dat een bezoek aan een vele mogelijkheden om de eindgebruiker als
pagina gemiddeld korter van duur is. Het is uitgangspunt te nemen bij het ontwikkelen
niet duidelijk of de pagina’s ook daadwerke- en continu verbeteren van je website.
lijk zijn gelezen.
M arleen Nagengast
Daarom is besloten om nog een gebrui- marleen@concept7.nl
kerstest uit te voeren met dezelfde deelne-
mers. Elke deelnemer heeft hetzelfde arti- Marleen Nagengast heeft eerst de oplei-
kel gelezen. Drie personen kregen versie A ding Commerciële Economie afgerond
voorgeschoteld, de andere drie versie B. aan de Hanzehogeschool in Groningen.
Het verschil in leessnelheid bleek hier nog Vervolgens heeft ze Communicatie- en In-
positiever uit te vallen in het voordeel van formatiewetenschappen gestudeerd aan
versie B. De tekst werd ruim 60 procent de RUG. Tijdens deze opleiding heeft ze in
sneller gelezen. de redactiecommissie gezeten, waarvoor
ze ook al enkele artikelen heeft geschre-
Op basis van de resultaten van dit onder- ven. Sinds een half jaar is ze als Junior
zoek kan gesteld worden dat de verbetering Projectmanager werkzaam bij Concept7
is geslaagd: de leesbaarheid is verhoogd, (www.concept7.nl).
bezoekers lezen sneller en ze ervaren dit als
“prettig lezen”.
Conclusie Bronnen
Om terug te komen op de vragen die in het 1. Putting A/B Testing in Its Place (Jakob
begin van dit artikel werden gesteld. Is A/ Nielsen’s Alertbox). http://www.useit.com/
alertbox/20050815.html. (16 maart 2007)
B testing gewoon een populair begrip, een 2. Kassenaar, P. Van Rijswijk, O. (2003).
hype? Of is het een onderzoeksmethode die Handboek Website Usablity. ISBN 9039521018.
een substantiële bijdrage kan leveren aan 3. Van der Put, W. (2006). Website-
het verbeteren van websites? Het antwoord usability. ISBN 9789043013048.
is volgens mij: “geen van beide.” 4. Research-Based Web Design Usability
Guidelines. http://www.usability.
gov/pdfs/guidelines.html
Usabilityweb Magazine Nummer 3, 2007 7

8. Hoezo aandacht
voor opmaak bij
e‑mailnieuwsbrieven?
Visuele structuuraanduiders in e‑mailnieuwsbrieven ondersteunen het
scangedrag van de lezer. Uit dit onderzoek naar twee tekstueel dezelfde,
maar visueel verschillende nieuwsbrieven blijkt dat het gebruik van visuele
structuuraanduiders duidelijk van invloed zijn op het scangedrag van de lezer.
In de marketing- en communicatiepraktijk dagelijks ongetwijfeld ook in uw mailbox,
van verschillende MKB-bedrijven vindt het terechtkomen. Met e-mailmarketing bedoe-
medium e-mail steeds beter zijn plaats. len we hier organisaties die op basis van per-
De mediumspecifieke eigenschappen van missie e-mail inzetten om te communiceren
e-mail worden meer en meer gebruikt om met hun doelgroepen. De ontvanger van de
diverse marketing- en communicatiedoel- mailing heeft toestemming verleend aan de
stellingen te behalen. organisatie om hem periodiek via e-mail te
informeren (opt-in) en behoudt te allen tijde
Toch is e-mail, en specifiek e-mailmarke- de mogelijkheid om deze toestemming weer
ting, een relatieve nieuwkomer binnen dit in te trekken (opt-out).
vakgebied.
Onderzoek naar leesgedrag op internet
Onderzoek naar het medium staat dan
ook nog in de kinderschoenen. Reden voor Het onderzoek gaat dus in op de vraag hoe
Mail to Mail en Concept7 om gezamenlijk e-mailnieuwsbrieven eigenlijk gelezen wor-
de e-mailnieuwsbrief eens te onderwerpen den. Specifiek:
aan een gebruikerstest.
“ Wat is het verschil in leesgedrag tussen een
Omdat steeds meer organisaties kiezen voor opgemaakte “HTML”-mailing en een niet-
een volledig opgemaakte e-mailnieuwsbrief, opgemaakte “platte” mailing. ”
hebben we het onderzoek toegespitst op
het verschil in leesgedrag tussen een vol- Nu is er al veel onderzoek gedaan naar de
ledig opgemaakte “HTML”-mailing en een manier waarop mensen teksten van inter-
niet-opgemaakte “platte” mailing. Natuur- net lezen. De algemene opvatting is dat in-
lijk gebruikten we hierbij de eyetracker van ternetgebruikers niet zozeer teksten lezen,
Concept7. maar meer scannen naar voor hen interes-
sante woorden of zinnen (zie bijvoorbeeld
Jakob Nielsen 1997).
E-mailmarketing: de achtergrond
Om alle misverstanden direct uit de weg te Nu zijn deze onderzoeken voornamelijk
helpen; met e-mailmarketing hebben we het gericht op het lezen van internetsites waar
hier niet over de bekende spammailtjes, die de gebruiker met een vooraf bepaald doel
8 Usabilityweb Magazine Nummer 3, 2007

9. naar toe gaat. Men is bijvoorbeeld gericht aanduiders om de nieuwsbrief te scannen
op zoek naar bepaalde informatie of wil (gelijk websites)?
een product bestellen. Gebruiksvriendelijke
websites ondersteunen dan ook dit zoekge-
Opzet onderzoek
drag van de gebruiker. Door “structuuraan-
duiders” zoals opmaakelementen, interne Om dit verschil in leesgedrag te onderzoe-
links, menustructuur en visualisatie te ge- ken hebben we twaalf proefpersonen twee
bruiken, wordt de gebruiker “geholpen” bij verschillende nieuwsbrieven laten lezen. De
het navigeren door de site. beide nieuwsbrieven waren qua structuur en
inhoud precies hetzelfde en verschilden al-
leen in de opmaak van elkaar. Nieuwsbrief A
E-mailnieuwsbrief vs. website
is de opgemaakte nieuwsbrief, nieuwsbrief
E-mailnieuwsbrieven missen in zekere mate B miste deze extra opmaak.
dit vooraf bepaalde doel van de gebruiker.
Daar waar een website actief en doelbewust
De eyetracker
bezocht wordt door de gebruiker, worden
e-mailnieuwsbrieven aangeboden door de De nieuwsbrieven werden gelezen achter
zendende partij. een eyetracker. Dit is een computermonitor
die precies de oogbewegingen van de proef-
Toch verwachten wij dat de lezer wel de- persoon volgt en opslaat. Op deze manier is
gelijk met een bepaald doel de nieuwsbrief het mogelijk om na afloop van het onderzoek
leest. Hij zal immers opzoek gaan naar in- de oogbewegingen te analyseren. Tevens
formatie die voor hem op dat moment inte- genereert de eyetracker een zogenaamde
ressant kan zijn. heatmap waarin precies wordt aangegeven
op welke plekken van de nieuwsbrief extra
Wij verwachten dan ook dat ook e-mail- oogfixatie gemeten werd.
nieuwsbrieven gescand worden door de le-
zer. Maar de vraag die dan rijst is of er ver-
Resultaat: opmaak ondersteunt
schil aan te wijzen is tussen het scangedrag
scangedrag lezer
binnen een opgemaakte “HTML”-mailing
(waarbij de eerdergenoemde “structuuraan- Het verschil in het leesgedrag van nieuws-
duiders” gebruikt worden) en een “platte” brief A en nieuwsbrief B is opmerkelijk te
mailing. Kortom, scannen nieuwsbrieflezers noemen. In de niet opgemaakte nieuwsbrief
de nieuwsbrief alleen op woorden of wordt verliep de oogbeweging heel duidelijk van
er actief gebruik gemaakt van structuur- boven naar beneden. Er werd niet “gespron-
gen” tussen tekstgedeelten of teruggekeerd
Fig 1. Bovenste gedeelte van de twee onderzochte nieuwsbrieven. De opgemaakte (nieuwsbrief A)
en de niet opgemaakte (nieuwsbrief B)
Usabilityweb Magazine Nummer 3, 2007 9

10. naar eerder gelezen stukken. De tekst werd ste gedeelte van de nieuwsbrief ). Het lijkt
als één stuk gezien en ook als zodanig gele- alsof de gebruiker heel duidelijk opzoek is
zen. Hierbij dient opgemerkt te worden dat naar de structuur en daarmee de inhoud van
dit natuurlijk niet betekent dat de gehele de nieuwsbrief.
tekst gelezen werd.
Geen fixatie op esthetische plaatjes
Dit in contrast met de opgemaakte nieuws- Duidelijk is dat de oogfixatie gericht is op de
brief. Hier was veel meer een scan patroon tekst en niet op de plaatjes naast de tekst. De
te herkennen. De afzonderlijke tekstitems plaatjes worden wel gezien maar niet aan-
werden als zodanig herkend en gebruikt. dachtig bekeken. Dit in tegenstelling tot de
Het lijkt erop dat de lezer de structuuraan- inhoudelijke visualisatie die wel aandachtig
duiders gebruikt om een eigen “pad” door bekeken werd.
de tekst te belopen.
Waardering en retentie van
Dit heeft verschillende gevolgen voor het
de nieuwsbrieven
lezen van de nieuwsbrief. Doordat de items
meer als afzonderlijke delen gezien werden Na afloop van het onderzoek werd aan de
werd er meer geschakeld tussen de items en proefpersonen gevraagd om een vragen-
lag de oogfixatie heel duidelijk op de eerste lijst in te vullen. De vragen die gesteld wer-
paar zinnen en de kopjes van de verschillen- den waren inhoudelijk van aard (er werd
de items. Het lijkt of hier de keuze gemaakt gevraagd naar feitelijkheden binnen de
werd of het stuk al dan niet interessant was. nieuwsbrief ) en naar de waardering van de
Tevens werd er regelmatig teruggekeerd nieuwsbrief.
naar eerder gelezen stukken. Opvallend
hierbij was dat alle Opvallend was dat de retentie van beide
nieuwsbrieven laag was. Men had moeite
lezers van de opgemaakte nieuwsbrief te- om feitelijkheden uit de nieuwsbrief zich te
ruggingen naar het begin van de nieuwsbrief herinneren. Dit terwijl de nieuwsbrieven als
om nogmaals de inhoud van de nieuwsbrief redelijk interessant gewaardeerd werden.
te bekijken (weergegeven in het eerste tekst-
item). Het lijkt alsof de inhoud nogmaals Wat betreft de waardering voor de nieuws-
geëvalueerd werd op persoonlijke interes- brief werd de opgemaakte nieuwsbrief, zei
se. Sommige van de lezers kozen er hierna het gematigd, positiever ontvangen.
voor om (al dan niet door middel van de
interne links) terug te keren naar één van
De laboratoriumsituatie
de (waarschijnlijk door hen als interessant
gekenmerkte) tekstitems. Dit onderzoek pretendeert in geen ge-
val zwaar wetenschappelijk onderzoek te
Dit scannende gedrag kwam niet naar voren zijn. We hebben geprobeerd om in kaart
in de niet opgemaakte nieuwsbrief, terwijl te brengen hoe e-mailnieuwsbrieven gele-
de tekst wel hetzelfde was. Hieronder ziet u zen worden en wat de invloed van opmaak
twee voorbeelden van de oogfixatie (heat- op ditzelfde leesgedrag is. Natuurlijk is het
maps) van zowel de opgemaakte als de niet onderzoek in een laboratoriumsetting uit-
opgemaakte nieuwsbrief. gevoerd, waardoor er zeker interfererende
elementen te verwachten zijn. De lezers wa-
Fixatie op kopjes en eerste paar ren er zich bewust van dat ze onderzocht
zinnen binnen tekstitem werden, de nieuwsbrief werd hoogst waar-
Als we kijken naar de heatmaps zien we dat schijnlijk beter gelezen dan in een thuissi-
de opgemaakte nieuwsbrief een duidelijke tuatie en waarschijnlijk werd er meer tijd
fixatie heeft op de kopjes en de eerste zin- aan de nieuwsbrief besteed. Echter, juist als
nen binnen de tekstitems. Deze fixatie is we juist deze verstorende elementen in het
ook wel te herkennen binnen de niet opge- achterhoofd houden kunnen we voorzich-
maakte nieuwsbrief maar in sterk mindere tig enkele uitspraken doen over het lezen en
mate. opstellen van e-mailnieuwsbrieven.
Fixatie op structuur
Tevens zien we in de heatmap van de opge-
maakte nieuwsbrief een sterke fixatie op de
menustructuur (weergegeven in het boven-
10 Usabilityweb Magazine Nummer 3, 2007

11. zijn geheel gelezen wordt?”. Opmaak kan
Aandacht voor opmaak
hierbij dus een zeer belangrijke rol spelen
kan lezer helpen
en dient binnen e-mailmarketing net zoveel
Er zijn verschillende onderzoeken geweest aandacht krijgen als bij het opstellen van een
naar de tijd die lezers vrijmaken voor het le- gebruiksvriendelijke website. Let hierbij,
zen van nieuwsbrieven. Deze tijd (natuurlijk naast de visuele opmaak, ook op de tekstu-
afhankelijk van de inhoud van de nieuws- ele structuuraanduiders. Zoals aangegeven
brief ), is korter dan onze proefpersonen ligt de oogfixatie op de kopjes en de eerste
namen. Aangezien structuuraanduiders paar zinnen binnen de tekstitems. Geef dan
scangedrag zeker ondersteunen is het aan ook extra aandacht aan deze elementen van
te raden om bij het opstellen van de mai- de nieuwsbrief. Spreek de lezer persoonlijk
ling hier rekening mee te houden. De vraag aan en geef duidelijk weer wat de lezer kan
“hoe ondersteun ik de lezer bij het vinden verwachten van de tekstitem. “What’s in it
van de voor hem interessante onderwerpen” for me” zal het uitgangspunt zijn waarmee
is waarschijnlijk belangrijker dan de vraag de lezer de nieuwsbrief leest. Natuurlijk
“hoe zorg ik ervoor dat mijn nieuwsbrief in spelen bij het opstellen en vormgeven van
Usabilityweb Magazine Nummer 3, 2007 11

12. een nieuwsbrief ook zaken als doelgroep,
boodschap, imago en branding mee. Een
jongere doelgroep zal waarschijnlijk meer
ervaring hebben met het snel scannen van
teksten, gebruik maken van (interne) links
en menustructuren en misschien meer
waarde hechten aan opmaakelementen en
nieuwe features dan een oudere doelgroep.
Deze zaken zijn niet meegenomen in dit
onderzoek, maar vormen natuurlijk goed
materiaal voor toekomstig onderzoek.
Eyetrackfilmpje te bekijken
op www.mailtomail.nl
Voor iedereen die mee wil weten over het
onderzoek in het algemeen of de eyetrack-
methode in het bijzonder hebben we een
van de eyetrackfilmpjes van het onderzoek
gepubliceerd op onze website www.mailto-
mail.nl. Zo kunt u zelf zien hoe een e-mail-
nieuwsbrief gelezen wordt.
Hans Jacob de G ier
hansjacob@mailtomail.nl
Hans Jacob de Gier heeft zich tijdens zijn
studie Communicatie- en Informatie-
wetenschappen gespecialiseerd op het
gebied van Computer Mediated Com-
munication (CMC). De verandering in het
communicatiegedrag bij de tussenkomst
van nieuwe interactieve media is een be-
langrijk onderdeel binnen zijn studie en
werk. Sinds anderhalf jaar is hij werkzaam
als operational manager bij de Groningse
e-mailmarketingorganisatie Mail to Mail.
12 Usabilityweb Magazine Nummer 3, 2007

13. De homepage
van morgen
Op usabilityweb.nl kun je veel vinden over het verbeteren van een
homepage, bijvoorbeeld door met gebruikersmening, onderzoek,
usability en verkiezingen van de beste homepage. Een gebruiker
beweegt, kijkt, gebruikt woordjes, leert en denkt om een taak uit te
voeren. Je kunt ook kijken hoe goed een homepage daarbij past.
c) Een fors probleem kan zijn dat je te bie-
Wat was de beste homepage
den moet hebben wat de gebruiker nodig
Wat wil de gebruiker heeft. Als je te dikwijls ‘neen’ verkoopt
De gebruiker heeft een taak; hij wil iets we- dan komen je klanten niet terug. Op veel
ten of iets hebben. De meest voor de hand homepages is dat overigens wel een pro-
liggende vraag die je dan kunt stellen is: “Wat bleem. Men omzeilt dit probleem door
wilt u?” Kruideniers doen dat al eeuwen. De andere dingen te doen dan de vraag:
ergonomie gaat al jaren uit van ‘taken’ en er “Wat wilt u?” Plaatjes, technische snufjes
zijn psychologen die de mens opvatten als en design snufjes suggereren veel maar
een ‘doel’ gericht handelend wezen. leiden de gebruiker af van zijn taak. Ook
een menu[1] is een goede mogelijkheid
De interface daarvoor om te voorkomen dat de gebruiker iets
Hoe ziet de “Wat wilt u?” homepage er uit? vraagt dat je niet hebt. De gebruiker kan
Simpel dus, er staat minstens op: “Wat wilt namelijk alleen aanklikken wat de page
u?”. Dit kan bijvoorbeeld met een ‘zoek’ biedt en navigatieproblemen zorgen er-
functie. Terzijde merken we op dat dit an- voor dat de gebruiker er niet achter komt
ders is dan: “Dit hebben we.”, bijvoorbeeld in dat jij dat niet hebt wat hij zoekt. Bij een
de vorm van menu- of pictogrambalken. goede zoekfunctie bestaat het navigatie-
probleem niet.
a) Naast de vraag “Wat wilt u?” moet de
gebruiker op het scherm een antwoord d) Goed, de beste homepage is dus de tekst:
kunnen geven. Ook simpel, gewoon een “Wat wilt u?”en een vakje daarachter. Er
vakje op waar de gebruiker zijn vraag in ontstaat dan wel een ander fors pro-
kan typen. bleem: wat laat je al die programmeurs,
designers en webtekstschrijvers doen als
b) Het derde element van de interface zie je geen menu’s met snufjes meer hebt?
je niet maar is misschien wel het belang- Natuurlijk beginnen ze te scanderen: ‘Het
rijkste, namelijk het antwoord. Ook dat oog wil ook wat.’ Dat wordt hier niet ont-
is simpel, voor interface ontwerpers ten- kend. De stelling hier is dat: ‘Als functie
minste, want dat probleem moeten tech- nodig is, dan is functie leading en design
nici oplossen. volgend.’
Usabilityweb Magazine Nummer 3, 2007 13

14. e) En dan natuurlijk de ervaren gebruikers, • Je hebt strategieën voor precieze taken
de ITers en de whizzkids. Onervaren ge- die je algoritmisch uit kan voeren. De
bruikers en ouderen zullen in het vakje vraag is exact: ‘Wat is de hypotheekrente
rustig intypen: ‘Wat is uw telefoonnum- (van deze bank)?’, ‘Kan ik subsidie krijgen
mer?’ of ‘Wanneer is het eerstvolgende op dubbel glas?’
concert?” De ervaren gebruikers zullen
tijd verliezen of verdwalen bij hun zoek- • Je hebt vage taken, bijvoorbeeld omdat
tocht naar de inmiddels gebruikelijke op- zij een wat vager doel hebben of omdat
ties als ‘veel gestelde vragen’, ‘contact’ en zij niet bekend zijn. Een heuristische uit-
‘agenda’. voering ligt dan voor de hand. De gebrui-
ker wil een indruk krijgen van een bedrijf
f ) Het grootste probleem van een homepage vóór dat hij ermee in zee gaat.
met alleen “Wat wilt u” en een invulvakje
er naast is wel: “Hoe maak je aannemelijk De interface daarvoor
dat drie woorden en een leeg balkje een Voor vage taken kun je dus inderdaad een
paar duizend euro kosten?” lijstje geven met daarin items als geleverde
producten, uitgangspunten en zelfs niet in-
Evaluatie houdelijke formele informatie als betrouw-
Echt nieuw is zo’n hompage overigens niet. baarheidsinformatie en organisatie struc-
De titel van dit hoofdstukje is ook: “Wat was tuur.
de beste homepage?” Jaren geleden heeft
iemand dit geflikt. Waarschijnlijk weer een We zien nu de eerste homepages struike-
paar studenten die ook allemaal niet wisten len. Voor gebruikers zijn die lijstjes lastig;
hoe het toen ‘moest’. Op hun homepage dit heet het ‘navigatieproleem’. Maar daar
stonden inderdaad gewoon een paar woord- gaat het hier even niet om.
jes en een vakje. Ook zelfs geen graphics of
achtgergrondkleur. Oh ja, je kreeg ook een a) De beide strategieën moeten duidelijk
antwoord waar je wat aan had. Het is nu een onderscheiden zijn. Dat betekent dus
multinational [2] die iedereen kent. dat het invulvakje voor de precieze taken
duidelijk zichtbaar en onderscheidbaar
De conclusie is duidelijk. Heeft een wat moet zijn van het lijstje. Je moet de tool
complexere homepage geen zoekfunctie van een expert niet in de gereedschaps-
dan heeft gebruikersmening, onderzoek kist van de beginner gooien. Wanneer
en usability geen zin. De pagina, mag niet men ‘zoek’ als menuoptie presenteert
meedoen aan competities voor de beste ho- dan geeft men als het ware een zeer er-
mepage, tenzij men natuurlijk met een goed varen drinker een pilsje in een zuigfles.
verhaal komt. Toch verstoppen ontwerpers ‘zoek’ regel-
matig in een lijstje.
Wat is de beste homepage
b) Ten tweede moet duidelijk zichtbaar zijn
Wat wil de gebruiker dat beide strategieën mogelijk zijn. Dat
Natuurlijk gaat het in eerste instantie om betekent dus dat het invulvakje direct bo-
“Wat wilt U?”. De denkpsychologie is hier- ven, onder, links of rechts van het lijstje
over klip en klaar. Er zijn algoritmische en moet staan. Een andere plaats is riskant
heuristische denkstrategieën. Dat klinkt omdat grafische grappen of gecropte
wat ingewikkeld maar er zijn vele concrete vensters de opvallendheid van het hokje
toepassingen [3] voor interface design. Een kunnen verminderen.
aardige is toepassing is bijvoorbeeld dat
‘Design dummies, interface wizards’ maken. Evaluatie
We beperken ons hier even tot de home- De conclusie is duidelijk. Heeft een wat
page. complexere homepage geen zoekfunctie dan
heeft gebruikersmening, onderzoek, usabi-
Wanneer je de werkwijze van gebruikers lity geen zin en mag de page, niet meedoen
analyseert dan blijken er twee strategieën aan competities voor de beste homepage.
te zijn. Nou ja, in principe. Alles mag natuurlijk als
je er een goed verhaal bij hebt.
1 Usabilityweb Magazine Nummer 3, 2007

15. cert met Friestalige pop. Wanneer de pro-
Lang leve de homepages
vincie een afzonderlijke cultuur homepage
Wat wil de gebruiker heeft dan is er meer kans dat het concert
Tot nu toe zijn we meegegaan met de vraag: management de gemeente vindt. De psy-
“Wat is de beste homepage?” We hebben chologie krijgt hier onverwachte steun van
netjes een analyse gemaakt en zeer concreet de techniek. Een afzonderlijke provinciale
aangegeven wat ontwerpers moeten doen. cultuur homepage is, zoekmachine – en
Het wordt nu tijd om naar de essentie te portal, vriendelijker is dan één algemene
gaan en de vraag ter discussie te stellen. homepage.
Er zijn treinreizen waarbij de reistijd gro- Evaluatie
tendeels bestaat uit dolen door het station. De conclusie is duidelijk. Je moet een goed
De oorzaak is dat de huidige stations soms verhaal hebben als je site geen achteringan-
nog oude stations zijn met een centralis- gen heeft. Anders heeft gebruikersmening,
tische opzet. Eén hoofdingang, één rij lo- onderzoek, usability waarschijnlijk geen zin
ketten, één informatiebord waar iedereen en is er een flinke kans dat de page een com-
langs moet. Deze ‘éénheid’ is gemakkelijk. petitie voor de beste homepage niet wint.
Je hebt maar één deur, maar één kabel
naar een informatiebord en maar één chef
Weg met de homepage
plaatskaarten die goed kan zien wat al zijn
medewerkers doen. Een homepage is ook Wat wil de gebruiker
zo’n centralistische hoofdingang. Ook erg Opmerkelijk is dat vragen van ontwerpers
gemakkelijk. Voor de organisatie en de tech- aan de psychologie eigenlijk irrelevant zijn.
niek dan wel. Dat komt omdat men vragen stelt over een
interface dat niet vanuit de psychologie ont-
We hadden gezegd dat een mens iets is dat worpen is. Doe je dat wel dan is de vraag er
een taak uitvoert. Een taakomstandigheid niet meer. Zo ook met de vraag wat de beste
kan zijn dat reizigers achter een station homepage is. Het juiste psychologische ant-
wonen of dat er alleen aan de achterzijde woord is: “Eigenlijk wil de gebruiker hele-
plaats is voor de subtaak: ‘kiss en ride’. Ta- maal geen homepage.” De gebruiker wil ge-
ken verschillen en daar moet men bij aan- woon dat zijn Friestalige popconcerten goed
sluiten. Gelukkig is een home page is wel bezocht worden. Als je daarbij aansluit dan
aanzienlijk zachter dan een negentiende ben je naast psycholoog ook koopman.
eeuws stationsgebouw in het midden van
een drukke stad. Wat achteringangen moe- De interface daarvoor
ten dus mogelijk zijn. Voor een koopman zijn homepages nog
steeds krakkemikkige etalages waarvan je
De interface daarvoor maar moet hopen dat er mensen langs ko-
De homepagegebruiker van verschillende men, dat ze in de etalage kijken en dat ze
kanten kan komen voor verschillende pro- iets zien dat ze nodig hebben. Het is een
ducten. Maak dus voor elke kant en elk van erg passieve, traditionele en niet klantge-
die producten een ingang of, om maar even richte wijze van verkopen. De popconcert
in de eigenzinnige terminologie van de IT organisator wil niet naar de homepage van
te blijven een ‘homepage’. Zo kan een ad- zijn bank. Hij wil in zijn spreadsheetje zien
viesbureau dat advies geeft, cursussen geeft wat zijn saldo nu is. Dat geldt ook voor zijn
en boeken uitgeeft voor elk die producten agenda communicatie. Hij wil niet via een
een homepage hebben, met name voor in- homepage van een provinciale culturele
stanties met onduidelijke producten is zo’n site naar een agenda maar hij wil dat in die
aanpak gewenst. Een provincie is zo’n vage agenda site, precies hetzelfde staat als in zijn
instantie. agenda spreadsheetje.
Natuurlijk zal een provincie een homepage Aanvankelijk dacht ik: “HTML ha dat is het.”
hebben. Een provincie geeft subsidies en Met HyperText bedoelt men ‘linked tekst’.
maakt regels voor bijvoorbeeld energie, mi- Zeg dan ‘link’ dacht ik nog, maar goed, wat
lieu en cultuur. Dat zijn dan ook de hoofd- is in een woord. Bij nadere bestudering
ingangen voor bepaalde gebruikersgroepen. bleek dat echt linken van informatie met
Mogelijk komen gebruikers zelfs niet op het HTML niet kan. Je krijgt er je banksaldo niet
idee om bij de provincie te gaan kijken of mee in je spreadsheet.
je daar subsidie kunt krijgen voor een con-
Usabilityweb Magazine Nummer 3, 2007 1

16. Evaluatie
Voor sommigen is het vervangen van een
homepage door een systeem van linkbare
informatie elementen misschien revolutio-
nair. Anderen zullen zeggen: “Hebben we al-
lang.” Dat kan best zo zijn want de toekomst
hebben sommigen achter zich en anderen
nog voor zich. Bedrijven linken hun infor-
matie al wat langer dan vandaag. Inderdaad
niets nieuws onder de zon. Sinds kort is het
mogelijk om je browser direct informatie
in het formulier te laten invullen. Een mooi
begin van een ontwikkeling die niet tegen
te houden is.
De les is duidelijk. Het accent verschuift
van snelle traditionele marketing en design
naar content en duurzame relaties. ‘Element
linking’ is voor beide partijen een investe-
ring die voor beide partijen veel winst geeft.
Maar dan moet je natuurlijk niet elk jaar
wisselen. Het traditionele centralistisch op-
gezette prominente treinstation verdwijnt
langzaam uit het stadsbeeld en gaat op in
een complex van transport, winkels, horeca
en vergadercentra. De traditioneel centra-
listisch opgezette prominente homepage
verdwijnt langzaam uit beeld en gaat op in
een complex hybride systeem van gelinkte
informatievoorzieningen.
Leonard Verhoef
verhoef@humanefficiency.nl
Leonard Verhoef benadert interfaces
reeds meer dan twintig jaar vanuit de
bewegings-, waarnemings-, taal-, leer- en
denkpsychololgie. Inmiddels is duidelijk
dat dit leidt tot vraagtekens bij gebruike-
lijke interfaces, tot andere meestal simpe-
ler, technieken en ook tot andere resul-
taten voor de ‘gebruiksvriendelijkheid’.
Interfaces, artikelen, boeken en cursussen
op www.humanefficiency.nl.
Bronnen
1. www.humanefficienc.nl/gui/
menu_navigatie.htm
2. www.google.nl
3. Meer hierover in ‘GUI, webontwerp,
psychologie en human efficiency’, www.
humanefficiency.nl/gui.htm
16 Usabilityweb Magazine Nummer 3, 2007

17. Microformats
Het semweb leunt zwaar op nogal abstrac-
Het statische world wide web
te disciplines uit de academische wereld,
Rond 1990 werd het world wide web bedacht kunstmatige intelligentie, verzamelingen-
door Tim Berners-Lee [1]. Het succes was leer en archiefwetenschappen.
enorm, mede door de eenvoud van de ba-
sistechnieken die werden gebruikt. Daarbij Dit is lastige kost, heel anders dan de schijn-
was de belangrijkste doorbraak de opmaak bare eenvoud van opmaak in HTML. Het
van informatie in HTML, met als unieke ei- semweb werd dan ook aanvankelijk buiten
genschap de links naar de rest van het web. de wereld van wetenschap en bibliotheken
vrijwel genegeerd.
Gedurende de eerste tien jaar groeide het
web exponentieel, waarbij iedereen die dat Naast de lastige academische materie waren
wilde, zijn informatie op zijn eigen wijze er nog meer redenen waarom het semweb
vorm gaf en op websites beschikbaar maak- niet direct een succes werd. Het toevoegen
te. De bezoeker van een website kon deze van gegevens over web content, metadata,
bekijken, maar er niets aan toevoegen. Ook is veel werk en de eerste jaren zou daar nog
het vinden van informatie bleef een lastige niet veel profijt tegenover staan. Daarvoor
opgave, zeker omdat zoekmachines nog niet is het immers nodig dat alle relevante in-
goed ontwikkeld waren. formatie op het web verrijkt is, een enorme
klus voor de content producenten.
Verre belofte: het semantic web
Rond de eeuwwisseling was ook de tijd dat
Hiermee was dit niet het web zoals Ber- Google een nieuwe manier introduceerde
ners-Lee dit oorspronkelijk voor ogen had. om het web te indexeren. Door gebruik te
Hij was veel meer uit op een web waarbij maken van de structuur van het web zelf
informatie ruimer toegankelijk was. Rui- bleek het mogelijk om verrassend goede
mer dan in het geval van een website met aannames te maken over de relevantie van
een enkele beheerder bereikbaar was. In de gegevens. Dit maakte het handmatig verrij-
eerste plaats doordat iedere webpagina te ken van content minder urgent.
bewerken zou zijn door bezoekers (dit is la-
ter gedeeltelijk gerealiseerd, in de vorm van Toch waren de beloften van het semweb
Wiki’s [2]). Maar ook doordat informatie niet gering. Een standaard voorbeeld uit die
eenvoudig en automatisch gecombineerd dagen ging over het gebruik van intelligente
zou moeten kunnen worden. Dit laatste agents die op zoek gaan voor hun opdracht-
idee verwoordde Berners-Lee rond 1999 gevers en zelfstandig activiteiten uitvoeren
als The Semantic Web [3], kortweg semweb. of met adviezen komen. Zoals bij het ma-
Informatie wordt hierbij voorzien van be- ken van een afspraak: ik wil een afspraak
tekenis die ook door machines, computers, maken met collega’s en stuur mijn agenda
te interpreteren is. Het basis principe komt agent het net op, met de namen van mijn
er op neer dat er rijke meta-data wordt toe- gesprekspartners. De agent weet wanneer
gevoegd, dat wil zeggen, informatie over de ik beschikbaar ben en gaat op zoek naar de
(soort) informatie. Daarnaast werd er een informatie van alle betrokkenen. Door alle
hele reeks aan standaarden en technieken beschikbaarheidsgegevens en voorkeuren te
voorgesteld om deze meta-informatie te vergelijken, wordt er vanzelf een afspraak
kunnen verwerken. geboekt en in alle agenda’s bijgeschreven.
Usabilityweb Magazine Nummer 3, 2007 17

18. Het sociale web Microformats
Vanuit een heel andere hoek bleek er uit- Microformats zijn snel populair geworden
eindelijk toch meer behoefte aan een rijker als eenvoudig, begrijpelijk alternatief voor
web te komen. Vanaf 2000 groeide het ver- ingewikkelde semweb technieken. Het uit-
schijnsel van de weblog exponentieel. Dit gangspunt is bestaande web techniek, voor-
leidde tot de opkomst van een sterke so- namelijk HTML en wat CSS. Hieronder wordt
ciale component bij het publiceren op het in meer detail ingegaan op de kenmerken.
web. Ik vertel op mijn weblog graag wie mijn
vrienden en inspiratiebronnen zijn en deel
Voor “gewone” mensen
belangrijke gebeurtenissen met anderen.
Met de enorme groei van het aantal weblogs De definitie van microformats, vrij vertaald
werd het ondoenlijk om alle blogs actief bij [18]:
te houden. RSS feeds [] (op zich een veel
oudere techniek) boden een gedeeltelijke “Microformats [19] zijn in de eerste plaats
oplossing, maar er moest meer gebeuren ontwikkeld voor mensen en op de tweede
om informatie thematisch te kunnen ver- plaats voor machines. Het zijn open data
zamelen. formats, gebaseerd op bestaande en veel
gebruikte standaarden. In plaats van het
In 200 signaleerde uitgever Tim O’Reilly [] wiel opnieuw te willen uitvinden, bou-
dat er een wezenlijke sociale- en samenwer- wen microformats verder op wat nu al
kings component aan het web werd toege- werkt, door uit te gaan van eenvoudige
voegd en hij noemde dit Web 2.0 [6]. Een oplossingen. En door huidige patronen in
van de kenmerken was het toegankelijk ma- gedrag en gebruik als basis te nemen.”
ken van ruwe gegevens voor derden. Door
deze gegevens te combineren met andere En inderdaad, de basis van microformats
bronnen en verder te verwerken (te mixen) is gewoon bestaande HTML. Daar binnen
kunnen er geheel nieuwe, vaak verrassende wordt bepaalde informatie vervolgens op
toepassingen gemaakt worden. Een vroeg een gestructureerde manier opgenomen.
voorbeeld is housing maps [7], dat huizen Let wel, het gaat hier niet om de uiterlijke
die op Craigs List [8] te koop staan, op Goo- weergave, de vormgeving of lay-out, maar
gle Maps [9] markeert. om de interne structuur van de HTML. Zo
bestaan er afspraken voor een groeiend aan-
Een verschijnsel dat een hoge vlucht nam tal formaten. Een paar voorbeelden:
was het taggen [10] van informatie en links.
Bekende voortrekkers zijn del.icio.us (book- • hCard [20]: adres- en contact gegevens
marks) [11] en flickr (foto’s) [12]. Zo’n verza-
meling tags, met betrekking tot een zelfde • hCalendar [21]: agenda gegevens (ge-
onderwerp, wordt ook wel folksonomy [13] beurtenissen en data)
genoemd. Ook voor weblogs werden tags
populair. Op basis van deze tags kunnen • XFN [22]: relaties (wie zijn mijn vrienden
blogs dan weer thematisch gegroepeerd en bekenden)
worden. Een bekend voorbeeld is Techno-
rati [1], dat op basis van door gebruikers • hReview [23]: recensies
aangebrachte tags weblogs en artikelen
groepeert en samenvoegt. • XOXO [2]: lijsten, opsommingen, defi-
nities
Hiermee was er een grote vraag naar infor-
matie met goede meta data ontstaan, ook • hResume [2]: curriculum Vitae (een sa-
buiten de blogosphere [1]. De business case mengesteld formaat).
voor het semweb was als het ware rond. In
dat zelfde jaar 200 stelde Tantek Çelik [16]
Door “gewone” mensen
(van Technorati) microformats voor onder
de veelzeggende naam Real World Seman- Het is opvallend dat de specificatie van mi-
tics [17]. De doelstellingen van het sem- croformats niet door een officiële commis-
web worden verwezenlijkt met bestaande sie wordt bepaald, maar door een zelf ge-
(X)HTML-techniek, voor en door de gewone organiseerde groep van web ontwikkelaars,
gebruiker – primair de weblogger. met een brede belangstelling voor sociale
processen op het internet.
18 Usabilityweb Magazine Nummer 3, 2007

19. Al deze formaten komen tot stand op basis Voorbeeld: adresgegevens, opgemaakt als
van uitgebreide observatie hoe de betreffen- vCard, kun je direct vinden op Google Maps
de soort informatie in de praktijk het vaakst voor een routebeschrijving.
wordt gepubliceerd. Vervolgens wordt er
kritisch gekeken naar wat er daadwerkelijk Of: het jaarprogramma van de voetbalclub
gebruikt wordt en waar de knelpunten zit- met uit- en thuiswedstrijden, opgemaakt
ten. Zo is bijvoorbeeld het hCard formaat met hCalendar. Met een enkele druk op de
gebaseerd op het al veel langer bestaande knop staat het hele programma foutloos in
vCard formaat (bekend van o.a. Outlook en je eigen agenda.
Mac Adresboek).
Maar er zijn ook toepassingen waarbij in-
De uitgangspunten zijn steeds: formatie van verschillende bronnen met
elkaar in verband gebracht kan worden. Zo
• Een specifiek probleem oplossen kun je door het koppelen van XFN-relatie-
netwerkgegevens uitvinden of, en hoe, je via
• Zo simpel mogelijk beginnen vrienden in contact met iemand komt.
• Ga uit van menselijk gebruik, daarna de Hier liggen grote mogelijkheden voor sites
machine die gegevens verzamelen en indexeren. Van
een recensie in hReview is het onderwerp
• Maak gebruik van veel gebruikte stan- eenduidig vastgelegd en meerdere recensies
daarden zijn makkelijk tot een gezamenlijk oordeel
samen te voegen. Via je vriendenlijst kun je
• Modulaire opzet, samen te voegen tot dan bijvoorbeeld recensies van mensen uit
groter geheel je eigen netwerk zwaarder laten wegen.
• Bevorder decentrale ontwikkeling, con- De mogelijkheden werden eigenlijk alleen
tent en diensten maar beperkt door de beschikbaarheid van
microformats in de praktijk. Op dit mo-
ment is er een ware explosie in aandacht
Toepassingen
voor microformats. Veel toepassingen zoals
Microformats zijn niet bedoeld als vol- weblogsoftware (Wordpress, LiveJournal)
waardig alternatief voor het semweb. Maar worden voorzien van microformatopmaak,
een aantal kenmerken komen wel in die zonder dat eindgebruikers er iets voor hoe-
richting. Nu al is er een zoekmachine voor ven doen. Onlangs heeft zakelijke netwerk-
microformat content [26], waarmee je kunt site LinkedIn [30] beknopte versies van
zoeken naar personen, gebeurtenissen of de CV’s van 9 miljoen leden als hResume
recensies. gepubliceerd [31]. Het ziet er hiermee naar
uit dat de doorbraak vanuit de aanbodzijde
Voor de browser Firefox zijn er een aantal komt; de toepassingen [32] volgen nu heel
plugins die microformats detecteren [27]. snel.
Vervolgens kun je de microformat gegevens
gebruiken om te zoeken op andere websites,
Toekomst
of exporteren naar andere programma’s op
je computer. De kritische massa voor microformat con-
tent is bij de web pioniers inmiddels wel be-
Uitwisselen van gestructureerde gegevens reikt. Voor eindgebruikers is het aanbod nog
tussen webpagina’s en locale applicaties wat mager. Het meest zichtbaar zijn vaak de
wordt ook mogelijk gemaakt met Live Clip- enigszins knullige logo’s op websites, zoals
board [28], een voorstel van Microsoft dat we die ook kennen van RSS feeds en pod-
een jaar geleden met veel enthousiasme casts. Hier ligt nog veel werk voor usability
ontvangen werd (Ray Ozzie: Wiring the experts en vormgevers om daar meer mee te
Web) [29]. doen. Dit wordt door Alex Faaborg, UI-de-
signer voor Firefox, onderkend in het artikel
Dit maakt nuttige toepassingen mogelijk, Structured Data Chaos [33].
dicht bij huis.
Verder zal webbrowser Firefox in versie 3.0
sterke ondersteuning voor microformats
gaan bieden. Dit betekent dat de webbrow-
Usabilityweb Magazine Nummer 3, 2007 19

20. ser een functie kan krijgen als centrale infor-
Bronnen
matiemakelaar voor het web. Het online en
offline beheer van je gegevens, koppeling en 1. http://en.wikipedia.org/wiki/Tim_Berners-Lee
uitwisseling via het web: The Web Browser 2. http://en.wikipedia.org/wiki/Wiki
3. http://en.wikipedia.org/wiki/Semantic_Web
as Information Broker (Alex Faaberg) [3]. 4. http://en.wikipedia.org/wiki/RSS_feed
Dat hier grote usability uitdagingen liggen 5. http://www.oreillynet.com/pub/au/27
mag duidelijk zijn. De informele webloggers 6. http://www.oreillynet.com/lpt/a/6228
en de open source gemeenschap hebben het 7. http://www.housingmaps.com
voortouw genomen. Als de gereedschappen 8. http://www.craigslist.org/
9. http://maps.google.com
voldoende bruikbaar worden voor het gro- 10. http://en.wikipedia.org/wiki/
te publiek, is het ideaal van het read/write Tag_%28metadata%29
web, ofwel het Web Operating System, veel 11. http://del.icio.us/
dichter bij gekomen. 12. http://www.flickr.com/
13. http://en.wikipedia.org/wiki/Folksonomy
14. http://technorati.com/
Vanuit het semantic web kamp lijkt er een 15. http://en.wikipedia.org/wiki/Blogosphere
voorzichtige toenadering naar de enthousi- 16. http://tantek.com/
aste microformat communities te beginnen. 17. http://tantek.com/presentations/2004etech/
Aan de ene kant zijn de microformats heel realworldsemanticspres.html
duidelijk gedefinieerd, waardoor ze eenvou- 18. http://microformats.org/about/
19. http://microformats.org/
dig te beschrijven zijn in semweb termen. 20. http://microformats.org/wiki/hcard
Aan de andere kant begint het besef door 21. http://microformats.org/wiki/hcalendar
te breken dat een dergelijke massabeweging 22. http://gmpg.org/xfn
het gebruik van meta data op het web ein- 23. http://microformats.org/wiki/hreview
delijk tot een succes zal kunnen maken (The 24. http://microformats.org/wiki/xoxo
25. http://microformats.org/wiki/hresume
Shortest Path to the Future Web , Danny 26. http://kitchen.technorati.com/search/
Ayers voor IEEE Internet Computing, dec. 27. http://microformats.org/wiki/firefox
2006) [3]. 28. http://www.liveclipboard.org/
29. http://rayozzie.spaces.live.com/blog/
Door deze kruisbestuiving kan het ontstaan cns%21FB3017FBB9B2E142%21285.entry
30. http://linkedin.com/
van het semweb uiteindelijk via een proces 31. http://steve.ganz.name/blog/2007/01/
van evolutie lopen. Kleine stapjes tegelijk, linkedin-launches-hresume.html
waarbij technieken die niet gebruikt wor- 32. http://microformats.org/wiki/implementations
den ook weer (tijdelijk) vergeten worden. 33. http://blog.mozilla.com/faaborg/2006/12/12/
Langzamer dan een van bovenaf opgelegde microformats-part-1-structured-data-chaos
34. http://blog.mozilla.com/faaborg/2006/12/13/
revolutie, maar diep verankerd in de bele- microformats-part-2-the-fundamental-types
vingswereld van de gebruikers van het web 35. http://dannyayers.com/docs/websense/1
zelf.
Johannes la Poutre
squio.nl/blog/
Johannes La Poutre is webarchitect en
pionier op het gebied van internettech-
niek. Hij volgt de ontwikkelingen van het
Semantic Web op de voet en realiseert
projecten die deze technieken in de
praktijk toepassen. Zijn achtergrond is
breed: industrieel ontwerper, ervaring in
de grafische branche (reclame) en een
lange carriere als web ontwikkelaar bij
Nederlands grootste internet providers.
Sinds een jaar zelfstandig adviseur en web
ontwikkelaar. Visie: techniek onzichtbaar
laten worden ten gunste van de beleving.
20 Usabilityweb Magazine Nummer 3, 2007