 |
 |
||
 |
 |
 |
|
toegankelijkheid
achtergronden project
vooronderzoeken
onderdelen Drempelsweg.nl
procesbeschrijving
evaluatie project
evaluatie stage
conclusies & aanbevelingen
facilitaire website
richtlijnen
voorbeeldsites
gebruikte technieken
doelgroepen
Gebruikte technieken bij de ontwikkeling
en
bouw van Drempelsweg.nl
Voor de volledigheid zal ik bij de beschrijving van de site ook vertellen over de gebruikte technieken binnen de website. Ik heb in samenwerking met de programmeur veel dingen bedacht om de richtlijnen ook echt toegankelijker te maken. Omdat het mijns inziens niet uitmaakt in welke programmeertaal er is gebouwd hou ik het kort.
PHP3 met een MySQL database
Hoewel elke pagina binnen Drempelsweg.nl de extensie *.php3 heeft, zijn ze niet allemaal dynamisch 1. Het is namelijk veel handiger als alle pagina's dezelfde extensie hebben. Op deze manier kun je gemakkelijk pagina's laten communiceren met de richtlijnen. Een voorbeeld daarvan is de pagina De eerste stap, waarbij de regels gekoppeld zijn aan de richtlijnen.
PHP en toegankelijkheid
De PHP-code zelf hoeft niet toegankelijk te zijn. De door PHP gegenereerde (geparste) HTML daarentegen moet natuurlijk helemaal toegankelijk zijn. Hierop moet de PHP-code dus aangepast worden.
Het is niet erg belangrijk dat er geprogrammeerd is in PHP (afgezien van het feit dat het gemakkelijker op te maken is dan bijvoorbeeld ASP). Wat wel belangrijk is, is dat er een solide databaseontwerp is gemaakt om alle informatie binnen Drempels Weg in te vatten.
Zo'n ontwerp kun je het beste maken als je een beetje kan overzien wat de site allemaal moet doen. Dat konden we op het moment van bouwen nog niet. Eigenlijk is een deel van de functionaliteit van de site ontstaan tijdens het maken van het technisch ontwerp. Het gaat dan met name om de kleine extra's. Zo kun je door een aantal extra velden toe te voegen (bijvoorbeeld de richtlijnfamilie of de flag voor een HTML-richtlijn) later veel plezier beleven van de extra informatie die je van een richtlijn hebt.
Enkele cijfersStandaardqueries
Er zijn 57 tabellen in de Drempels Weg MySQL-database. Deze variëren van tabellen voor de diverse forums tot een tabel voor de bibliotheek, de nieuwsrubriek etc.
Ongeveer 7 tabellen zijn strikt bedoeld voor (informatie over) de richtlijnen. De centrale tabel ("richtlijnen") bestaat uit 22 velden. Elke richtlijn kan dus uit 22 verschillende soorten informatie zijn opgebouwd. Op dit moment staan er 118 richtlijnen in deze tabel.
Om het overzicht van richtlijnen te voorzien van filterknoppen zijn een aantal standaardqueries bedacht, waarmee de meest voorkomende sorteringen kunnen worden gemaakt. Ook op andere plaatsen binnen de site kan deze 'standaardinformatie' uit de database opduiken.
Een voorbeeld van zo'n query is de checklist, die alle richtlijnen uit de database haalt, waarvoor geldt dat de prioriteit 1 is, het geen HTML-richtlijnen zijn en ze gerangschikt moeten worden naar familie 2. Door deze voor de hand liggende -maar ingewikkelde- vraag in zo'n standaardquery te gieten hoeft de gebruiker er geen moeite meer voor te doen.
HTML
Belangrijkste bouwsteen binnen vrijwel elke website blijft toch HTML (HyperText Markup Language). Dit is de taal die webbouwers spreken. Het is tevens de taal die doorgaans ontoegankelijk is voor de gehandicapte bezoeker. Vrijwel alle toegankelijkheidsaanpassingen moeten in de HTML gebeuren.
Simpele HTML is in principe redelijk toegankelijk. Worden sites groter en ingewikkelder, dan wordt ook de HTML ingewikkelder. En vrijwel altijd ontoegankelijk. Framesets, tabellen in tabellen, layers, dit is allemaal nodig om structuur aan een site te geven. Maar ze maken de boel ook ontoegankelijk. Drempelsweg.nl is een frameloze site, met een minimaal aantal tabellen om de boel in het gareel te houden (meestal één per pagina). Verder is zo veel mogelijk opmaak uit de HTML gehaald en verplaatst naar een style sheet. Zo bestaat het HTML-document voornamelijk uit content en het CSS-document uit opmaak.
CSS
Cascading Style Sheets zijn heel nuttig om sites met een mooie vormgeving toegankelijk te maken. Informatie in style sheets wordt namelijk niet gebruikt in bijvoorbeeld tekstbrowers, screenreaders en dergelijke. De vorm en de inhoud zijn gescheiden. De vorm wordt genegeerd en de inhoud blijft over voor hen die niets aan vorm hebben.
Bijkomend voordeel: met style sheets heb je veel meer controle over opmaak dan met HTML. Zo heb je in HTML 256 kleuren tot je beschikking, met CSS heb je er (ongeveer) 16 miljoen (ligt aan monitor en videokaart van de gebruiker). Met CSS kun je marges, regelafstanden en dergelijke tot op de pixel regelen. In HTML kan dit meestal niet.
In HTML heb je zeven verschillende lettertypegroottes, met CSS een traploze schaal van 1 tot duizenden puntgroottes.
Je hoeft natuurlijk geen miljoenen kleuren en duizenden verschillende fontgroottes te gebruiken, maar je hebt wel meer keuze in wát je gebruikt.
JavaScript
Volgens mij is er op geen enkele plek binnen de site JavaScript toegepast. Dit heeft een reden. JavaScript zorgt in de regel niet alleen voor foefjes waar gehandicapten niets aan hebben; de meeste ergernissen van gehandicapten op internet komen juist door JavaScript-toepassingen.
Zo raken niet alleen blinden totaal gedesoriënteerd van pop-up vensters (ze kunnen écht hun oude venster niet meer vinden). En menu's die uitklappen kunnen vaak niet door blinde, lichamelijke of verstandelijk gehandicapten bediend worden 3. Een voorbeeld van zo'n navigatie is te zien op de website van TMF (www.tmf.nl; wijzigt ingrijpend om de paar maanden).
Bovendien hebben oude en tekstbrowsers geen JavaScript ondersteuning, waardoor de functionaliteit helemaal wegvalt. Zo kun je (dus) niet vertrouwen op een JavaScript:history.back button (een link of knop die hetzelfde doet als de knop 'Terug' of 'Back' in de knoppenbalk van de browser).
Conclusie
Vermijdt zoveel mogelijk het gebruik van JavaScript. Probeer zoveel mogelijk opmaak uit de HTML te halen en in een style sheet te stoppen. De door PHP (of een andere parser) gegenereerde HTML moet toegankelijk zijn.
volgende pagina:
Doelgroepen
Voor een overzicht:
ga naar de Sitemap
Verklarende Woordenlijst
voetnoten:
- Dynamisch betekent hier dat er met gegevens uit een database een HTML pagina geparst wordt.
Verandert de inhoud van de database, dan verandert de HTML pagina: dynamisch.
- In SQL ziet de query er dan ongeveer zo uit:
[ SELECT title, id FROM richtlijnen WHERE (prioriteit=1) AND (HTML=no) ORDER BY familie DESC ]
- Het gaat in dit geval om een geval van DHTML (Dynamic HyperText Markup Language), een combinatie van JavaScript, CSS en HTML. DHTML is over het algemeen helemaal af te raden als je toegankelijk wilt bouwen. Je moet -net als met Flash- bijna altijd een alternatief aanbieden.
Fig.1: de pagina's bestaan in principe uit slechts één tabel. Andere opmaak komt uit een style sheet (CSS).
Fig.2: Dezelfde pagina als fig.1, maar dan gezien met een tekstbrowser. De website is zo opgezet dat hij in een tekstbrowser (hier Lynx op een Unix systeem) goed leesbaar is. Het scheiden van content en opmaak in HTML en CSS is het halve werk.
Linksboven is een link 'spring naar de tekst' zichtbaar, die normaal niet te zien is. Gebruikers van een brailleleesregel gebruiken deze link om niet op elke pagina de hele navigatie aan te hoeven horen.
naar boven