Accessibility Bookmarklets

Wat zijn bookmarklets?

Bookmarklets (of favelets) zijn kleine stukjes JavaScript die een bewerking op een pagina kunnen uitvoeren. Om met bookmarklets te kunnen werken is een browser nodig die JavaScript ondersteunt.
In dit artikel bespreken we een aantal bookmarklets die van pas kunnen komen bij het onderzoeken van een site op toegankelijkheidsproblemen. We noemen deze bookmarklets accessibility bookmarklets. Het zijn veelal visuele hulpmiddelen waarmee bekeken kan worden of een enkele pagina (gedeeltelijk) aan een ijkpunt voldoet. Zo kan een bookmarklet de style sheet uitzetten, of kan een overzicht gegenereerd worden van gebruikte afbeeldingen en bijbehorende alt-teksten.

Een bookmarklet moet niet als meer gezien worden dan een handigheidje. Er kan maar één pagina tegelijk mee getest worden, en elke bookmarklet heeft een eigen doel. Bovendien geven de meeste bookmarklets niet de juiste informatie wanneer ze op een frameset-pagina toegepast worden. Wanneer alle pagina's in een site met bookmarklets moeten worden bekeken, dan moeten op elke pagina van de site de diverse bookmarklets één voor één gebruikt worden. En dan nog is de site niet helemaal op toegankelijkheid getest.

Bookmarklets zijn beperkte hulpmiddelen en menselijke interpretatie blijft altijd nodig. In dit artikel geven we geen overzicht van alle denkbare accessibility bookmarklets, maar reiken we een aantal bookmarklets aan die erg handig kunnen zijn bij opsporen van toegankelijkheidsproblemen.

Importeren en gebruik van de accessibility bookmarklets

Voor het gebruik van deze bookmarklets zijn de volgende punten belangrijk:

• De bookmarklets zijn vooral visuele hulpmiddelen;
• U heeft een browser nodig met JavaScript-ondersteuning.
• De meeste bookmarklets werken met verschillende browsers (Internet Explorer, Mozilla, Opera), een enkele bookmarklet werkt alleen met Internet Explorer 5 of hoger.
• Er kan maar een pagina tegelijk getest worden;
• Bij een aantal bookmarklets verschijnt informatie in een nieuw venster. Wanneer u een pop-up killer gebruikt, zorg er dan voor dat u pop-ups accepteert op het moment dat u de bookmarklets gebruikt;
• De meeste bookmarklets werken niet bij frame-set pagina's, of voeren dan de bewerking uit op de frame-set pagina. Open de pagina's die in de frame-set geladen worden afzonderlijk en test ze afzonderlijk. Dit werkt niet bij pagina's die door middel van JavaScript weer automatisch in het frame geladen worden: wanneer u JavaScript uitzet om dit te voorkomen, werken de (JavaScript-afhankelijke) bookmarklets niet meer.

Verderop in dit artikel vindt u een aantal bookmarklets. Wij geven u de keus om ze allemaal in één keer te importeren of er een aantal uit te kiezen en die toe te voegen aan uw browser.

Omdat niet alle bookmarklets werken voor alle browsers geven we bij iedere bookmarklet aan in welke browser hij werkt. Om de bookmarklets in één keer te importeren bieden we dus ook hieronder verschillende bestanden aan voor de verschillende browsers. Voor Opera geldt overigens dat het importeren in één keer problemen oplevert, en hebben we hier dus achterwege gelaten.

Importeren in Internet Explorer

1. Download het volgende bestand door met de rechtermuisknop te klikken op de link en te kiezen voor "Doel opslaan als..."): accessibilitybookmarklets-ie.html.
2. Ga naar het browsermenu 'Bestand' en kies voor 'Importeren en exporteren...'.
3. Kies voor 'Favorieten importeren'.
4. Kies voor 'Vanuit een bestand of vanaf een adres importeren'.
5. Klik op de knop 'Bladeren...' en selecteer het bestand wat u zojuist heeft gedownload.
6. Kies een doelmap voor het importeren van de favorieten.
7. Klik op 'Voltooien'

Importeren in Mozilla

1. Download het volgende bestand door met de rechtermuisknop te klikken op de link en te kiezen voor "Save link as..." : accessibilitybookmarklets-moz.html
2. Ga naar het browsermenu 'Bookmarks', en kies voor 'Manage Bookmarks...'. Een nieuw venster wordt geopend.
3. Ga in het nieuwe venster naar het menu 'File', en kies voor 'Import'. Een wizard venster verschijnt.
4. Kies voor het importeren van de bookmarks 'From file'.
5. Selecteer het zojuist gedownloade bestand.

Wanneer u nu een pagina bekijkt en u wilt hierbij de bookmarklet gebruiken klik dan in de Favorieten of Bookmarks op de betreffende bookmarklet.

Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.

Accessibility bookmarklets

In de onderstaande lijst staat een aantal accessibility bookmarklets. De nummers slaan op de ijkpunten waarop ze betrekking hebben. Bij iedere bookmarklet staat tussen haakjes in welke browsers de bookmarklet werkt. Het is ons streven om zoveel mogelijk bookmarklets aan te bieden die in alle browsers gebruikt kunnen worden.

• 0: Toon frames (werkt in: IE)
  Als een webpagina is opgebouwd uit frames, kunnen de frames worden weergegeven met behulp van deze bookmarklet. Een frame wordt zichtbaar gemaakt door gebruik van kleuren voor de rand van een frame. Deze bookmarklet kan handig zijn voor het detecteren van frames. Wanneer frames gebruikt worden werken de meeste bookmarklets namelijk niet, omdat ze dan een bewerking uitvoeren op slechts de definiëring van de frameset. Een pagina uit de frameset kan meestal wel in een nieuw venster geopend worden en dan afzonderlijk getest worden met de bookmarklets.
  Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.
• 0: Toon in lage resolutie (640 x 480) (werkt in: IE, Mozilla)
  Deze bookmarklet verkleint het browservenster tot een resolutie van 640 x 480. Bij een frameset pagina moeten er indien nodig schuifbalken verschijnen. Het is ook belangrijk om te kijken of de inhoud ook te lezen is zonder horizontaal te hoeven schuiven met een schuifbalk.
• 01.1 Overzicht afbeelding, alt-tekst en URL (werkt in: IE, Opera)
  Deze bookmarklet geeft een overzicht van de gebruikte afbeeldingen op een webpagina, de bijbehorende alt-tekst en het adres van de afbeelding. Wanneer er geen alt-attribuut aanwezig is wordt dit aangegeven met N/A (Niet Aanwezig), een alt-tekst met een spatie (alt=” ”) wordt aangegeven met ” ” en een lege alt-tekst (alt="") wordt aangegeven met "".
  Let op: Het overzicht verschijnt in een nieuw venster. Wanneer een pop-up killer in gebruik is, zal het overzicht niet verschijnen. Schakel eerst de pop-up killer uit en gebruik vervolgens de bookmarklet.
• 02.2 Toon in grijstinten (werkt in: IE)
  Deze bookmarklet geeft de pagina in grijstinten weer. Dit is een van de weinige bookmarklets die ook werkt op een pagina die opgedeeld is in frames. Objecten als flash, applets en embedded video worden echter niet in grijstinten weergegeven.
  Bekijk of de voor- en achtergrondkleur voldoende contrast hebben. Stelt u zich voor dat deze pagina bekeken wordt door iemand die kleurenblind is, of dat de pagina wordt weergegeven op een zwart-wit of monochroom beeldscherm.
  Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.
• 03.2 Valideer HTML, XHTML (werkt in: IE, Mozilla, Opera)
  De pagina die zichtbaar is in het browservenster wordt gevalideerd. Let op dat er wel een DOCTYPE gebruikt is in de broncode, anders kan er niet gevalideerd worden.
• 03.2 Valideer CSS (werkt in: IE, Mozilla, Opera)
  De style sheet van de pagina die zichtbaar is in het browservenster wordt gevalideerd. Bij het gebruik van meerdere style sheets in een webpagina moet u goed opletten welk style sheet er gevalideerd wordt.
• 03.3 Toon style sheets (werkt in: IE)
  Deze bookmarklet toont alle gebruikte style sheets. Dit kan handig zijn om te kijken of er absolute of relatieve eenheden bij bijvoorbeeld de lettergroottes staan.
  Let op: Het overzicht verschijnt in een nieuw venster. Wanneer een pop-up killer in gebruik is, zal het overzicht niet verschijnen. Schakel eerst de pop-up killer uit en gebruik vervolgens de bookmarklet.
• 04.1 Toon lang-attributen voor taalwisselingen (werkt in: IE)
  Taalwisselingen kunnen alleen aangegeven worden met het lang-attribuut (in combinatie met bijna alle elementen). Deze bookmarklet omlijnt secties waarvoor een lang-attribuut gebruikt is. Daarbij wordt aangegeven op welke taal overgegaan zou zijn en het gebruikte element. Hiermee wordt een snelle visuele check mogelijk van IJkpunt 4.1.
  Wanneer u geen veranderingen ziet, is het mogelijk dat u de bookmarklet gebruikt hebt op een frameset pagina (waarbij de bookmarklet niet werkt) of dat er geen lang-attributen gebruikt zijn op de betreffende pagina.
  Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.
• 05.1 Toon tabel headers (th element) (werkt in: IE, Mozilla, Opera)
  Deze bookmarklet laat zien waar tabel headers gebruikt worden. Deze zouden gebruikt moeten worden in de rij- en kolomkoppen van datatabellen. Hiermee kan ook gekeken worden of tabel headers 'misbruikt' worden voor opmaak (tabel headers maken de tekst namelijk vetgedrukt en gecentreerd).
  Wanneer u geen veranderingen ziet, is het mogelijk dat u de bookmarklet gebruikt hebt op een frameset pagina (waarbij de bookmarklet niet werkt) of dat er geen tabelheaders op de pagina voorkomen.
  Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.
  
• 05.3 Toon tabellen (werkt in: IE, Mozilla, Opera)
  Met deze bookmarklet worden tabellen op de pagina gemarkeerd. Hiermee kan bekeken worden of tabellen voor de lay-out van een webpagina gebruikt wordt of voor datatabellen.
  Wanneer u geen veranderingen ziet, is het mogelijk dat u de bookmarklet gebruikt hebt op een frameset pagina (waarbij de bookmarklet niet werkt) of dat er geen tabellen op de pagina zijn. De pagina of het betreffende gedeelte is dan bijvoorbeeld met style sheets opgemaakt. Het kan ook zijn dat u een datatabel ziet, maar dat deze niet als een tabel is opgemaakt, maar bijvoorbeeld als tekst met spaties.
  Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.
• 06.3 Zet style sheets aan-uit (werkt in: IE, Mozilla)
  Hiermee worden de style sheets van een webpagina gedeeltelijk uitgezet. Wat niet wordt uitgezet is de in de style sheets bepaalde positionering. Door de bookmarklet nog een keer te gebruiken worden de style sheets weer aangezet. Controleer met deze bookmarklet of de pagina nog goed te bekijken is zonder de style sheets.
  Wanneer u geen veranderingen ziet, is het mogelijk dat u de bookmarklet gebruikt hebt op een frameset pagina (waarbij de bookmarklet niet werkt) of dat de pagina niet met style sheets is opgemaakt, maar met HTML-code.
  Met 'Vernieuwen' van de pagina in uw browser wordt de bewerking van de bookmarklet weer teniet gedaan.
• 11.2 Valideer de webpagina op HTML 4.01 Strict (werkt in: IE, Mozilla, Opera)
  Hiermee wordt de pagina gevalideerd op HTML 4.01 Strict. Volgens ijkpunt 11.2 mogen geen afgekeurde elementen en attributen gebruikt worden en dus wordt gecontroleerd op een Strict DOCTYPE. Een frameset pagina kan niet op deze manier beoordeeld worden.
• 11.2 Valideer met een strict DOCTYPE (XHTML 1.0 Strict) (werkt in: IE, Mozilla, Opera)
  Hiermee wordt de pagina gevalideerd op XHTML 1.0 Strict. Volgens ijkpunt 11.2 mogen geen afgekeurde elementen en attributen gebruikt worden en dus wordt gecontroleerd op een Strict DOCTYPE. Een frameset pagina kan niet op deze manier beoordeeld worden.
• 13.1 Toon links met eventuele titels (werkt in: IE, Mozilla, Opera)
  Hiermee wordt een overzicht gegenereerd van alle links op een webpagina en kunt u kijken of er titels zijn meegegeven aan de links.
  Let op: Het overzicht verschijnt in een nieuw venster. Wanneer een pop-up killer in gebruik is, zal het overzicht niet verschijnen. Schakel eerst de pop-up killer uit en gebruik vervolgens de bookmarklet.
• 13.1 Valideer links (werkt in: IE, Mozilla, Opera)
  Hiermee valideert u of alle links binnen een pagina geldig zijn.
• 13.2 Toon meta data (werkt in: IE, Mozilla, Opera)
  Deze bookmarklet toont de gebruikte meta data in een webpagina, zoals keywords, description en author.
  Let op: Het overzicht verschijnt in een nieuw venster. Wanneer een pop-up killer in gebruik is, zal het overzicht niet verschijnen. Schakel eerst de pop-up killer uit en gebruik vervolgens de bookmarklet.
• Bobby WAI-A (werkt in: IE, Mozilla, Opera)
  Test op WAI-A met behulp van de evaluatie tool Bobby: de webpagina wordt getest op alle prioriteit 1 ijkpunten.
  Let op: Het merendeel van de ijkpunten moet alsnog handmatig gecheckt worden.
• Bobby WAI-AA (werkt in: IE, Mozilla, Opera)
  Test op WAI-AA met behulp van de evaluatie tool Bobby: de webpagina wordt getest op alle prioriteit 1 én 2 ijkpunten.
  Let op: Het merendeel van de ijkpunten moet alsnog handmatig gecheckt worden.
• Bobby WAI-AAA (werkt in: IE, Mozilla, Opera)
  Test op WAI-AAA met behulp van de evaluatie tool Bobby: de webpagina wordt getest op alle prioriteit 1, 2 én 3 ijkpunten.
  Let op: Het merendeel van de ijkpunten moet alsnog handmatig gecheckt worden.