Wat is het verschil tussen de vier uitklapmenu's op deze pagina? Voor wie een gangbare browser gebruikt zijn ze zo op het eerste gezicht identiek. Maar schijn bedriegt:
Zie je de verschillen?
Het uitklapmenu wordt hier gebruikt als voorbeeld om drie ontwerpprincipes toe te lichten waarmee webpagina's toegankelijker kunnen worden gemaakt: 'graceful degradation', 'graceful transformation' en het aanbieden van een alternatief.
Graceful degradation gaat uit van de toepassing van webtechnieken als JavaScript en Cascading Style Sheets (CSS), waarbij er nadrukkelijk op wordt gelet dat informatie en navigatie in alle gevallen toegankelijk blijft voor browsers die dergelijke technieken niet ondersteunen.
Graceful transformation gaat uit van 'plain and simple' HTML, waarbij standaard HTML elementen hele andere eigenschappen toebedeeld krijgen en als zodanig onherkenbaar kunnen worden 'getransformeerd'. Mits de browser het aankan, uiteraard.
Aanbieden van een alternatief is de derde mogelijkheid om toegankelijkheid te waarborgen. Op deze pagina wordt daarom de HTML-tag <NOSCRIPT> gebruikt in combinatie met JavaScript. In browsers met JavaScript wordt alles wat tussen <NOSCRIPT>-tags staat niet weergegeven en juist weer wel in browsers zonder JavaScript.
Helaas zie je in de praktijk maar al te vaak dat geen van de drie hier genoemde technieken worden toegepast. Het resultaat: een webpagina die alleen maar werkt met één type browser, of een paar browsers als het meezit.
Met een moderne browser lijken alle vier menu's identiek: je kiest met je muis één van de mogelijkheden en vervolgens spring je 'vanzelf' naar de gewenste pagina. Als je de menu's probeert te bedienen via het toetsenbord, merk je al een klein verschil; als je niet weet met welke toetenbordcombinatie het menu kunt uitklappen, lukt dat alleen met menu 2. Heb je een andere dan bovenstaande browsers, of een 'oude' versie van de populaire bladerprogramma's, dan zie je mogelijk een ander opmerkelijk verschil: dan zijn er opeens nog maar drie uitklapmenu's. En heb je een browser zonder JavaScript, dan is helemaal snel duidelijk dat de vier niet hetzelfde zijn: één menu werkt niet meer, één heeft een submit-knop gekregen en er zijn ineens twee lijsten met links in plaats van uitklapmenu's.
Gebruik van een uitklapmenu in combinatie met JavaScript, als alternatief voor een lijst met links, betekent in het algemeen dat niet wordt voldaan aan de toegankelijkheidsrichtlijnen. IJkpunt 6.3 schrijft namelijk voor: 'Zorg ervoor dat pagina's bruikbaar zijn, als scripts, applets of andere programma-objecten uitstaan of niet worden ondersteund'. Er zal dus een voorziening moeten worden getroffen om de toegankelijkheid te waarborgen.
De hierboven beschreven methoden hebben elk hun voor- en nadelen. Behalve menu 3 dan, want dat heeft alleen maar nadelen. En da's nou net het type uitklapmenu dat je meestal ziet. De andere methoden zijn niet eens complexer, dus daar kan het niet aan liggen. Verder is alle code en scripting die je ervoor nodig hebt via deze pagina beschikbaar, als je weet hoe je de broncode kunt bekijken.
De techniek die is toegepast bij menu 1 is een hybride oplossing, waarbij een script op de server het werk overneemt als de browser daar zelf niet toe in staat is. Menu 2 is een mooi voorbeeld van hoe toepassing van nieuwe technieken juist tot betere toegankelijkheid kunnen leiden. En menu 3 geeft een vergelijkbaar resultaat en biedt letterlijk een bruikbaar alternatief.
Welke techniek het beste bruikbaar is mag eenieder voor zichzelf bepalen en hopelijk is deze pagina een nuttig hulpmiddel bij die keuze. Zolang maar niet de techniek van menu 3 wordt gekozen...
Aan het gebruik van uitklapmenu's voor navigatie-doeleinden zijn overigens ook beperkingen verbonden. Het voert te ver om hier de voors en tegens te gaan behandelen. De volgende links gaan er dieper op in:
Dit artikel is geschreven naar aanleiding van een discussie in de nieuwsgroep nl.internet.www.ontwerp. Het 'graceful transformation' script van menu 2 is bedacht en gemaakt door Salar al Khafaji (website@salar.xs4all.nl), met bijdragen van Warden Dave. Warden's voorkeur ligt echter bij voorbeeldmenu nummer 4. Als je al van een voorkeur kunt spreken, want Warden en Salar zijn allebei van mening dat je eigenlijk geen uitklapmenu's zou moeten gebruiken voor navigatie-doeleinden; zie ook de argumenten in de hierboven genoemde documenten.
Nabrandertje
Wie nieuwsgierig is naar de toetsenbordcombinatie waarmee een menu kan worden uitgeklapt: onder Windows en met Internet Explorer, Mozilla of Netscape kun je daarvoor ALT+<pijl omlaag> gebruiken.