Ik geef training in frontend tools en stacks als HTML, JavaScript, TypeScript, React, Angular en Vue. Ik schrijf boeken en artikelen over tal van (ICT-) onderwerpen. Ik was lead developer en directeur bij Yindo - Jouw digitale bibliotheek. Je kunt mij volgen op Twitter(@PeterKassenaar).

In dit blog vind je persoonlijke artikelen, die niet noodzakelijk tech-gerelateerd zijn.

Views and expressions are my own.

Terug naar de algemene site.

29december

Dashboards: more than meets the eye

dashboard

One of the things we are doing in my company is creating a new Dashboard for the SaaS-platform we are offering to our customers. This way, customer data can be made more visually insightful.

Color blindness


In the discussions we had about the Dashboard, it was brought to our attention that one of our colleagues is color blind. For him, for example, it is difficult to distinguish whether a pie slice of a graph is red or green, and where the separation between the values lies.
It turns out that worldwide about 8% of men experience some form of color blindness and 0.5% of women. These do not seem like large percentages, but still means that almost 1 in 10 users (including our customers!) is color blind. So, we must take this into account in the final design. There should be some kind of switch that allows the visitor to switch between a standard color palette or a palette optimized for the most common forms of color blindness. This way everyone will benefit, and we will provide better value for our customers.

User Experience


This once again shows that a seemingly simple question ("Can you create a dashboard?") can be more complex than you think at first glance. As one of my previous students (now a specialist on User Experience, UX, Michael Ramlal), put it: “Simplifying complex data visualization is easier said than done, especially if you aim for inclusivity. I'm a big fan of Edward Tufte, who, with his minimalist approach, managed to convey the right message visually.”

-- Peter Kassenaar

29 december 2023

26mei

Handboek Usability – 2e editie

978905940699523 mei 2014 – Vandaag is het Handboek Usability – 2e geactualiseerde editie verschenen. In dit handboek leert u alles over het ontwerpen van gebruikersvriendelijke websites. In deze uitgave is alle tekst geactualiseerd en zijn de screenshots aangepast voor de situatie in 2014. Nieuw is een compleet hoofdstuk over mobile usability.

U kunt dit boek gebruiken om uw eigen websites te beoordelen op hun gebruikersvriendelijkheid. Ook leert u hoe u betere websites maakt door vanaf het begin af aan al te letten op factoren die gezamenlijk de gebruikersvriendelijkheid van een website bepalen. U leert eerst welke aspecten een rol spelen bij de usability van een site en gaat vervolgens stap voor stap in detail kijken naar deze factoren. Zo krijgt u langzamerhand een totaalbeeld van de gebruikersvriendelijkheid van een site.

Specificaties

  • Boek, paperback, 336 pagina’s
  • Full Color-uitgave
  • Geschikt voor opleidingen en zelfstudie
  • Onafhankelijk van het gebruikte besturingssysteem en browser
  • ISBN-13: 978-90-5940-699-5 (9789059406995)
  • Prijs: EUR 34,95

Van de flaptekst

“Op internet is de gebruiker de baas. Met maar één muisklik kan hij kiezen uit duizenden soortgelijke websites. Usability gaat over het gebruiksgemak van websites. Hoe gebruikersvriendelijker uw website is, hoe beter hij zal scoren ten opzichte van de concurrentie. In dit geheel in kleur uitgevoerde Handboek Usability laat Peter Kassenaar u uitgebreid zien welke richtlijnen van toepassing zijn bij het maken van gebruikersvriendelijke websites. U leert onder meer hoe usability gedefinieerd wordt en welke kenmerken van toepassing zijn op gebruikersvriendelijke websites. Aan de hand van helder beschreven theorie en talloze schermafbeeldingen met goede en foute voorbeelden hebt u snel inzicht in veelgemaakte usabilityfouten bij webdesign. Door het gebruik van vragen en praktijkoefeningen aan het eind van ieder hoofdstuk is het Handboek Usability buitengewoon geschikt voor opleidingen en zelfstudie. Tot de behandelde onderwerpen behoren:

  • wat is usability en wat is user experience
  • van algemeen naar specifiek: siteontwerp, navigatie en paginaontwerp
  • de homepage en de landing page
  • schrijven voor het web
  • het belang van de zoekfunctie op een website
  • usability en multimedia
  • toegankelijk webdesign (accessibility)
  • mobile usability
  • zelf usabilitytesten uitvoeren

“Dit boek is een must voor webdesigners, webprogrammeurs, webmasters, webschrijvers, hobbyisten, (media)studenten, projectmanagers en marketeers. Kortom, iedereen die met websites werkt om mensen te bereiken. Eén boek – alles over website usability.”

Direct bestellen

 

-- Peter Kassenaar
26 mei 2014

09oktober

Gastcollege ‘usability voor mobiele apparaten’ bij HvA

Logo Hogeschool van Amsterdam

Woensdag 9 oktober 2013 gaf ik een gastcollege ‘Usability op mobiele apparaten’ op deHogeschool van Amsterdam, afdeling Sport, Management en Ondernemen (SM & O).

Beknopte inhoud

In ongeveer een uur kwamen de volgende onderwerpen aan de orde:

  • Waarom is usability belangrijk – waarom heb ik dit als specialisatie gekozen?
  • Een korte geschiedenis van mobiele communicatie.
  • Hoe worden mobiele apparaten op dit moment ingezet bij aankoop- en informatiebeslissingen? De verschuiving van bureaublad-devices naar mobiele devices is onherroepelijk ingezet. Mobiel internet gaat de rol van traditioneel (vast) internet overnemen. Je moet hier in de website of –app voor je onderneming of (sport)vereniging nu al rekening mee houden.
  • Wat is eigenlijk het verschil tussen een (mobiele) website en een App?

Drie concrete verschillen tussen desktop usability en mobile usability:

  • schermafmeting (en de gevolgen daarvan voor je design)
  • bediening: muis vs. touch (en de gevolgen…)
  • belangrijkste doel van de site identificeren (en de gevolgen…)
  • Deze drie aspecten werden daarna getoetst voor drie verschillende sites:
  • Het bleek dat er grote verschillen zijn tussen de sites onderling. Zo is de desktop-gebruikerservaring van Rio 2016 op veel punten nog wel voor verbetering vatbaar, maar is er wel gezorgd voor een geoptimaliseerde mobiele versie van de website. Bij NOC*NSF is dit beeld omgekeerd. De gebruikerservaring van de ‘gewone’ publiekssite is prima, maar is lastig bij mobiel gebruik. Hockey.nl laat min of meer hetzelfde beeld zien als rio2016.com.
  • Bij hockey.nl zijn bijvoorbeeld goede keuzes gemaakt in het terugdringen van de hoeveelheid menu-items in de navigatiestructuur. Zo biedt de mobiele versie snel toegang tot de belangrijkste functies van de site, zonder dat de gebruikersinterface overdadig vol aandoet.

Verschillende sites kennen verschillende sterke en zwakke punten. Het is niet zo dat een site compleet ‘mislukt’ of ‘onbruikbaar’ is, als een van de onderdelen niet goed is uitgewerkt. Het geeft wel aan dat dit betreffende aspect nader bekeken (en liefst verholpen) moet worden, om site-bezoekers op zowel desktop- als mobiele apparaten zoveel mogelijk tegemoet te komen.

Als een site responsive is, betekent dit dat de site zelf onderzoekt op welk type apparaat en schermbreedte hij getoond wordt. De site past zich vervolgens aan, aan het apparaat. Uiteraard moet dit wel door een programmeur worden ingesteld. Het gaat niet vanzelf.

Responsive design is de huidige trend in de webdesignwereld. Het maken van een responsive site is meestal wat duurder dan van een gewone site. Het onderhoud ervan kan vervolgens echter goedkoper omdat je maar één serie bronbestanden hoeft bij te houden.

Eerste dia presentatie usability mobiele apparaten

Presentatie

Je kunt de presentatie van dit college downloaden. Hij is beschikbaar in twee formaten:

Voor vragen over de presentatie of de rest van het gastcollege kun je contact opnemen via het contactformulier op deze site.

Peter Kassenaar
-- 09 oktober 2013

01oktober

Gastcollege ‘usability op mobiele apparaten’ bij Hva

 

SNAGHTML575f6c63Maandag 1 oktober 2012 gaf ik een gastcollege ‘Usability op mobiele apparaten’ op de Hogeschool van Amsterdam, afdeling Sport, Managemen en Ondernemen (SM & O).

Beknopte inhoud

In ongeveer een uur kwamen de volgende onderwerpen aan de orde:

  • Waarom is usability belangrijk – waarom heb ik dit als specialisatie gekozen?
  • Een korte geschiedenis van mobiele communicatie.
  • Hoe worden mobiele apparaten op dit moment ingezet bij aankoop- en informatiebeslissingen? De verschuiving van bureaublad-devices naar mobiele devices is onherroepelijk ingezet. De verwachting is dat rond 2014 het mobiele internet een belangrijkere rol zal spelen dan vast internet. Je moet hier in de website of –app voor je onderneming of (sport)vereniging nu al rekening mee houden.
  • Wat is eigenlijk het verschil tussen een (mobiele) website en een App?

Drie concrete verschillen tussen desktop usability en mobile usability:

  • schermafmeting (en de gevolgen daarvan voor je design)
  • bediening: muis vs. touch (en de gevolgen…)
  • belangrijkste doel van de site identificeren (en de gevolgen…)
  • Deze drie aspecten werden daarna getoetst voor drie verschillende sites:
  • Het bleek dat er grote verschillen zijn tussen de sites onderling. Zo is de desktop-gebruikerservaring van Rio 2016 op veel punten nog wel voor verbetering vatbaar, maar is er wel gezorgd voor een geoptimaliseerde mobiele versie van de website. Bij NOC*NSF is dit beeld omgekeerd. De gebruikerservaring van de ‘gewone’ publiekssite is prima, maar is lastig bij mobiel gebruik. Hockey.nl laat min of meer hetzelfde beeld zien als rio2016.com.
  • Bij hockey.nl zijn bijvoorbeeld goede keuzes gemaakt in het terugdringen van de hoeveelheid menu-items in de navigatiestructuur. Zo biedt de mobiele versie snel toegang tot de belangrijkste functies van de site, zonder dat de gebruikersinterface overdadig vol aandoet.

Verschillende sites kennen verschillende sterke en zwakke punten. Het is niet zo dat een site compleet ‘mislukt’ of ‘onbruikbaar’ is, als een van de onderdelen niet goed is uitgewerkt. Het geeft wel aan dat dit betreffende aspect nader bekeken (en liefst verholpen) moet worden, om site-bezoekers op zowel desktop- als mobiele apparaten zoveel mogelijk tegemoet te komen.

image

Presentatie

Je kunt de presentatie van dit college downloaden. Hij is beschikbaar in twee formaten:

Voor vragen over de presentatie of de rest van het gastcollege kun je contact opnemen via het contactformulier op deze site.

Peter Kassenaar
-- 01 oktober 2012

29september

Usability op mobiele apparaten

imageWoensdag 28 september 2011 gaf ik een gastcollege ‘Usability op mobiele apparaten’ op de Hogeschool van Amsterdam, afdeling Sport, Management en Ondernemen.

Beknopte inhoud

In korte tijd kwamen de volgende onderwerpen aan orde:

  • Waarom is usability belangrijk – waarom heb ik dit als specialisatie gekozen?
  • Een korte geschiedenis van mobiele communicatie.
  • Wat is eigenlijk het verschil tussen een (mobiele) website en een App?
  • De ‘mobiele revolutie’ is nog maar net begonnen. Nog minder dan 10% heeft een tablet-device. De komende jaren zullen een steeds verdergaande verschuiving laten zien van desktop naar mobiel. Je moet hier in de website voor je onderneming of sportvereniging nu al rekening mee houden.
  • Drie concrete verschillen tussen desktop usability en mobile usability:
    • schermafmeting (en de gevolgen daarvan voor je design)
    • bediening: muis vs. touch (en de gevolgen…)
    • belangrijkste doel van de site identificeren (en de gevolgen…)
  • Deze drie aspecten werden daarna getoetst voor drie verschillende sites:
  • Het bleek dat er grote verschillen zijn tussen de sites onderling. Zo is de desktop-gebruikerservaring van London 2012 op veel punten nog wel voor verbetering vatbaar, maar is er wel gezorgd voor een geoptimaliseerde mobiele versie van de website. Bij NOC*NSF is dit beeld omgekeerd. De gebruikerservaring van de ‘gewone’ publiekssite is prima, maar is lastig bij mobiel gebruik. Hockey.nl laat min of meer hetzelfde beeld zien als London2012.com.

Verschillende sites kennen verschillende sterke en zwakke punten. Het is niet zo dat een site compleet ‘mislukt’ of ‘onbruikbaar’ is, als een van de onderdelen niet goed is uitgewerkt. Het geeft wel aan dat dit betreffende aspect nader bekeken (en liefst verholpen) moet worden, om site-bezoekers op zowel desktop- als mobiele apparaten zoveel mogelijk tegemoet te komen.

image

Presentatie

Je kunt de presentatie van dit college downloaden. Hij is beschikbaar in twee formaten:

Voor vragen over de presentatie of de rest van het gastcollege kun je contact opnemen via het contactformulier op deze site.

Peter Kassenaar
-- 29 september 2010

15september

Gastcollege Hogeschool van Amsterdam

logo_HvA Woensdag 15 september 2010 gaf ik een gastcollege op de Hogeschool van Amsterdam (HvA), afdeling Sport, Management en Ondernemen. Als oud-ALO’er was dat natuurlijk een leuke gelegenheid om eens terug te keren naar mijn roots.

Beknopte inhoud

In de presentatie kwamen onder meer de volgende onderdelen aan de orde:

  • Het web is niet hetzelfde als ‘het internet’. Het web is een subset van het internet. Andere internet-technieken zijn bijvoorbeeld e-mail, nieuwsgroepen, P2P-netwerken en meer.
  • Bij websites zijn onder meer de volgende twee aspecten te onderscheiden: Techniek (werkt alles zoals het moet werken) en Usability (gebruikersvriendelijkheid; is de website eenvoudig en efficiënt te gebruiken). In het college ging ik vervolgens dieper in op enkele usability-aspecten.
  • Om de usability/gebruikersvriendelijkheid van een website meetbaar te maken, kun je de complete site opdelen in een aantal deelaspecten, zoals herkenbaarheid, snelheid, mogelijkheden om te zoeken en meer. Door deze deelaspecten in detail te bekijken en ze te beoordelen, kun je uitspraken doen over de totale gebruikersvriendelijkheid van een site en wat de verbeterpunten zijn.
  • Als voorbeeld werden de volgende drie aspecten beoordeeld voor verschillende sites: Herkenbaarheid, Navigatie en Interactie.
  • Deze componenten werden bekeken voor:
  • Verschillende sites kennen verschillende sterke en zwakke punten. Het is niet zo dat een site compleet ‘mislukt’ of ‘onbruikbaar’ is, als een van de onderdelen niet goed is uitgewerkt. Het geeft wel aan dat dit betreffende aspect nader bekeken (en liefst verholpen) moet worden, om site-bezoekers zoveel mogelijk tegemoet te komen.

usability_HvA

Presentatie

De presentatie is beschikbaar in twee formaten

Voor vragen over de presentatie of de rest van het gastcollege kun je contact opnemen via het contactformulier op deze site.

Peter Kassenaar
-- 15-09-2010

24maart

Handboek Usability

Handboek Usability (klein) Vandaag is het Handboek Usability – ontwerp gebruikersvriendelijke, doelmatige en toegankelijke websites verschenen. In dit Handboek leert u wat de voorwaarden en kenmerken zijn voor het ontwerpen van gebruikersvriendelijke websites.

U kunt dit boek gebruiken om uw eigen websites te beoordelen op hun gebruikersvriendelijkheid. Ook leert u hoe u betere websites maakt door vanaf het begin af aan al te letten op factoren die gezamenlijk de gebruikersvriendelijkheid van een website bepalen. U leert eerst welke aspecten een rol spelen bij de usability van een site en gaat vervolgens stap voor stap in detail kijken naar deze factoren. Zo krijgt u langzamerhand een totaalbeeld van de gebruikersvriendelijkheid van een site.

Specificaties

  • Boek, paperback, 352 pagina’s
  • Full Color-uitgave
  • Geschikt voor opleidingen en zelfstudie
  • Onafhankelijk van het gebruikte besturingssysteem en browser
  • ISBN-13: 978-90-5940-415-1 (9789059404151)
  • Prijs: EUR 34,90
  • Online voorbeeldhoofdstuk beschikbaar

Van de flaptekst:

“Op internet is de gebruiker de baas. Met maar één muisklik kan hij kiezen uit duizenden soortgelijke websites. Usability gaat over het gebruiksgemak van websites. Hoe gebruikersvriendelijker uw website is, hoe beter hij zal scoren ten opzichte van de concurrentie. In dit Handboek usability laat Peter Kassenaar u uitgebreid zien welke richtlijnen van toepassing zijn bij het maken van gebruikersvriendelijke websites. U leert onder meer hoe usability gedefinieerd wordt en welke kenmerken van toepassing zijn op gebruikersvriendelijke websites. Aan de hand van helder beschreven theorie en talloze schermafbeeldingen met goede en foute voorbeelden hebt u snel inzicht in de meest gemaakte usabilityfouten bij webdesign. Door het gebruik van vragen en praktijkoefeningen aan het eind van ieder hoofdstuk is het Handboek usability buitengewoon geschikt voor opleidingen en zelfstudie”

Beknopte inhoudsopgave

  • Wat is usability en wat is user experience
  • Van algemeen naar specifiek: site-ontwerp, navigatie en paginaontwerp
  • De speciale rol van de homepage
  • Schrijven voor het web
  • Het belang van de zoekfunctie op een website
  • Usability en multimedia
  • Toegankelijk webdesign (accessibility)
  • Interactie en usability
  • Zelf usabilitytesten uitvoeren

“Dit boek is een must voor webdesigners, webprogrammeurs, webmasters, webschrijvers, hobbyisten, (media)studenten, projectmanagers en marketeers. Kortom iedereen die met websites werkt om mensen te bereiken. Eén boek – alles over website usability.”

Hyperlinks uit het boek

In het boek worden honderden voorbeelden en tientallen andere websites met meer achtergrondinformatie genoemd. Alle hyperlinks zijn – voor zover mogelijk – gebundeld op de volgende pagina:

Handboek Usability op Yindo

Yindo Logo Yindo is een nieuw platform voor het online lenen, lezen en kopen van (e-)boeken. Het Handboek Usability is in zijn geheel op Yindo gepubliceerd. Het eerste hoofdstuk is gratis beschikbaar als inkijkexemplaar. 

Daarna kunt u besluiten het boek voor een gering bedrag te lenen, te kopen als online Yindo-boek of te kopen als ‘gewone’ papieren uitgave.

Hebt u het boek gelezen en hebt u opmerkingen ter verbetering van een eventuele volgende druk? Of wilt u andere lezers laten delen in uw ervaringen? Laat dan een bericht achter onder dit artikel of tweet er over via de Yindo-pagina.

Direct bestellen

 

Peter Kassenaar
-- 24 maart 2010

 

(PS: in aanvulling op het bloggen ben ik ook actief op Twitter, voor korte berichten en handige links. Je kunt me volgen via http://twitter.com/PeterKassenaar (@PeterKassenaar is mijn Twitternaam).

24maart

Hyperlinks bij Handboek Usability

 

Handboek Usability Coverfoto Deze pagina bevat een overzicht van de hyperlinks die worden genoemd in het Handboek Usability (ISBN 9789059404151). De hyperlinks verwijzen zowel naar achtergrondinformatie als naar de sites waarvan de afbeeldingen in het boek afkomstig zijn en welke als bronmateriaal werden gebruikt.

Het is onvermijdelijk dat sommige hyperlinks in de toekomst niet meer werken, of dat de sites er niet meer zo uitzien als toen de schermafbeelding voor gebruik in het boek werd gemaakt. Bekijk in dat geval de afbeelding inclusief opmerkingen in het boek en zie of de nieuwe (huidige) versie van de site beter of juist minder goed is geworden. Welke gevolgen hebben de aanpassingen van de site in dat geval gehad voor de usability ervan?

Onder in de pagina staat een opsomming van meer aanbevolen usability-literatuur.

Hoofdstuk 1 - Inleiding

Hoofdstuk 2 – De homepage

hoofdstuk 3 – De navigatiestructuur

Hoofdstuk 4 – Zoekdienst op de website

Hoofdstuk 5 – Servicepagina’s

Hoofdstuk 6 - paginaontwerp

Hoofdstuk 7 – Schrijven voor het web

Hoofdstuk 8 – usability en multimedia

Hoofdstuk 9 – Accessibility

Hoofdstuk 10 – Interactie

Hoofdstuk 11 – usabilitytesten

Aanbevolen en geraadpleegde literatuur

Weaving the Web
Weaving the Web
Tim Berners-Lee

A Brief History of the Future
A Brief History of the Future
John Naughton

 

Don't Make Me Think!
Don't Make Me Think!
Steve Krug

Jakob Nielsen's 50 Websites
Jakob Nielsen's 50 Websites
Jakob Nielsen & Marie Tahir

Eyetracking Web Usability
Eyetracking Web Usability
Jakob Nielsen & Kara Pernice
Prioritizing Web Usability
Prioritizing Web Usability
Jakob Nielsen
About Face 3
About Face 3
Alan Cooper & David Cronin
Elements Of User Experience
Elements Of User Experience
Jesse James Garrett & Jessie James Garrett
 

-- Peter Kassenaar
november 2009 – maart 2010