 |
 |
||
 |
 |
 |
|
toegankelijkheid
achtergronden project
vooronderzoeken
onderdelen Drempelsweg.nl
procesbeschrijving
evaluatie project
evaluatie stage
conclusies & aanbevelingen
projectmanagement
richtlijnen
facilitaire website
voorbeeldsites
Ontwikkeling facilitaire website
De website Drempelsweg.nl heeft sinds haar eerste live-moment een aantal grote veranderingen ondergaan. Ik ben steeds de eindverantwoordelijke en hoofdbouwer geweest van elke versie. Codewoord: voortschrijdend inzicht. Dit houdt in dat elke volgende stap de conclusies en consequenties van de voorgaande stappen met zich meedraagt.
Voordat de facilitaire site een feit was hebben we een groot aantal kleine websites en losse pagina's gebouwd om meer feeling te krijgen met de richtlijnen. Alles wat we in de richtlijnen vertellen hebben we eerst in de praktijk geprobeerd. Het blijkt onder andere dat het W3C ook richtlijnen voor toekomstige ontwikkelingen heeft opgesteld, die nog door geen enkele browser worden ondersteund. Deze richtlijnen hebben wij voorlopig weggelaten.
Proces
In de periode voor en tijdens de bouw van de facilitaire site hadden wij (webbouwers, redacteuren en ontwerpers van NMG) minimaal één maal per week een bijeenkomst met o.a. de vormgevers (Lust). Een tijdrovende manier van werken, zeker als de tijdsdruk hoog is.
Probeersels van Lust werden door ons meteen gebouwd en getest bij groepen gehandicapten. Hierdoor konden we stap voor stap onze inzichten aanpassen.
Sommige simpele ontwerpen bleken tijdens de bouw erg moeilijk toegankelijk te bouwen, terwijl andere typen ontwerpen wel gemakkelijk te realiseren waren. Met deze opgedane kennis zijn er per fase van Drempelsweg.nl aanzienlijke verbeteringen aangebracht. Dit geldt voor zowel het technisch verhaal als de algemene gebruikersvriendelijkheid.
volgende pagina:
Voorbeeldsites
Voor een overzicht:
ga naar de Sitemap
Verklarende Woordenlijst
voetnoten:
- Van de meeste van deze applicaties moest ter plekke de functionaliteit bedacht worden. Dit ging in sessies van soms maar enkele minuten en dan meteen bouwen.
Je moet dan denken aan applicaties als het forum, de nieuwsrubrieken, de zoekfunctie, de agenda van de ambassadeurs, het beheergedeelte om alle databasevelden te vullen etc. etc.
Fase 0
De eerste versie van Drempelsweg.nl die live ging heette bij ons intern de nul-versie. De site was voornamelijk bedoeld om aan het publiek en de pers te laten weten dat het project van start was gegaan. Het gaf enige achtergrondinformatie over de opdrachtgever en de deelnemers. Dit was dus echt een digitale folder.
Hij is gebouwd toen het richtlijnenonderzoek nog niet was afgerond. Met onze beste kennis hebben we de site toegankelijk proberen te maken.
Ontwerp
Het ontwerp van fase 0 kwam van Lust, die ook het ontwerp van de papieren folder hadden gedaan. Bij het ontwerp is uitgegaan van een aantal veronderstellingen, die we inmiddels verworpen hebben.
De ontwerper had van mij gehoord dat de opmaakt het liefst in style sheets moet worden gevat. Toen heeft hij met zijn beperkte kennis van deze techniek de website ontworpen (en het gepresteerd de style ontoegankelijknkelijk te maken).
De letters waren zowel groot als vet. Er zijn nauwelijks plaatjes gebruikt en er worden geen tabellen of frames gebruikt. De volle breedte van het scherm wordt benut, zodat teksten erg breed worden.
Ik had de grootste moeite om niet alles tegen de linkerrand geplakt te krijgen.
Reacties & conclusies
Belangrijkste reactie: we zijn toch niet achterlijk! Mensen konden de letters niet kleiner maken. Bovendien vond vrijwel iedereen het ontwerp saai en de kleuren niet mooi.
Hieruit hebben we een aantal conclusies getrokken:
- er moeten foto's op om de boel levendig te maken;
- tekst moet op gewone grootte, maar wel door de gebruiker aanpasbaar;
- rood is een signaalkleur, en mag niet voor gewone dingen als linkjes worden gebruikt;
- gebruikers snapten het 'gedoe' met de pijlen en de vinkjes die aangaven waar jeheen konn en waar je was, maar half;
- de inhoud van de website is erg belangrijk om aantrekkelijk gevonden te worden. Omdat de teksten niet voor gehandicapten (maar voor ministeries en de pers e.d.) was geschreven, vonden ze meteen niets aan de website. Gebruikers overwinnen in de regel erg ontoegankelijke websites, als er maar wat leuks te halen valt (www.tmf.nl);
- er moet een andere navigatieoplossing komen voor als de site uit erg veel rubrieken zal bestaan;
- de website werd wel snel ingeladen (gedownload), omdat hij vrijwel alleen uit tekst (HTML; CSS) bestaat. Plaatjes die erop staan worden op elke pagina opnieuw gebruikt.
Fig.1: Homepage fase 0
Fig.2: Over Drempels Weg / deelnemers (een rubriek die nu nog bestaat)
Fase 1
Fase 1 is de vorm die de website had ten tijde van alle onderzoeken. De site is voornamelijk gebruikt door de redactie voor het publiceren van nieuwsartikelen die niet konden wachten tot de openingsmanifestatie. Een ander belangrijk onderdeel van de site was het online inschrijfformulier voor de openingsmanifestatie. Dit was een belangrijke oefening om een groot formulier toegankelijk te maken. Dit waren bovendien de eerste online programmeeractiviteiten aan de website off-linee waren we o.a. al bezig de richtlijnendatabase te ontwerpen en te bouwen).
Ontwerp
Omdat Lust op dit moment te druk bezig was met het ontwerpen van de demosites, heb ik het ontwerp voor fase 1 zelf gedaan. Dan kon ik meteen rekening houden met de nieuwe inzichten die we inmiddels hadden verkregen en mijn kennis van style sheets gebruiken. Jammer genoeg had ik maar een dag de tijd om een nieuw ontwerp te maken.
Ik wilde qua ontwerp dicht bij het oude blijven (voor de herkenbaarheid), maar alle op- en aanmerkingen van de vorige fase meenemen in het ontwerp.
Elke hoofdrubriek kreeg foto's, de tekst was niet langer zo groot als krantenkoppen (maar wel instelbaar) en slechts een gedeelte van de breedte van het scherm werd gebruikt voor tekst.
Reacties & conclusies
Omdat dit ontwerp zo snel is gemaakt, heb ik niet de kans gekregen om 'op de groei' te ontwerpen. Het ontwerp is slechts geschikt voor drie hoofdrubrieken. Meer rubrieken naastelkaarr zou niet passen (rubrieksnamen zouden afbreken) en bovendien is het ondoenlijk om een evenwichtig ontwerp te maken als zeven hoofdrubrieken allemaal een eigen hoofd- en steunkleur zouden krijgen.
Omdat de tekst nog steeds niet aansloot op gehandicapten, werd deze nog steeds als saai ervaren. Wat dat betreft is er eigenlijk op de verkeerde doelgroep getest: de techniek was op gehandicapten afgestemd, maar de inhoud zeker niet.
Fig.3: Homepage fase 1
Fig.4: De nieuwsberichten waren nog statisch (niet uit een database)
Fase 2
Fase 2 van Drempelsweg.nl is de vorm die gepresenteerd werd tijdens de openingsmanifestatie. De website is dan explosief gegroeid ten opzichte van haar vorige fasen: meer rubrieken, geïntegreerde demosites en standaardinterfaces, een heleboel richtlijnen in meerdere verschijningsvormen, meer nieuws etc.
Het heeft dan ook een evenredig langere periode geduurd voor deze site helemaal gebouwd en getest was. En onderschat niet het werk dat gaat zitten in het invoeren van 118 richtlijnen met omschrijving, alternatieven en koppeling met de andere onderdelen binnen de site.
Toch hebben we voor het bouwen van de facilitaire site (functioneel ontwerp; technisch ontwerp; databaseontwerp; bouw geraamte in HTML, bouwen en koppelen ongeveer 25 PHP-applicaties 1) maar twee weken gehad. Vervolgens nog twee maal een week met elk een demosite (inclusief integreren in de facilitaire site) en toen nog anderhalve week testen (zelf en met de inmiddels uitgezochte ambassadeurs).
We begonnen die week met z'n tweeën (de programmeur en ik) en eindigden met z'n zessen. Dit team bestond uit twee PHP-programmeurs, twee junior HTML-ers en twee senior HTML-ers/vormgevers. Andere projecten werden aan de kant geschoven om dit project tot een goed einde te brengen.
Ontwerp
Het ontwerp kwam weer van Lust. Ditmaal hebben ze niet zozeer gelet op toegankelijkheid of de mogelijkheden van style sheets. Ze hebben gewoon een schermontwerp gemaakt, zoals ze dit altijd doen. Het moest alleen zonder frames te bouwen zijn.
Na enkele -totaal andere- schetsen die absoluut niet toegankelijk te bouwen waren, zijn ze met dit huidige ontwerp gekomen.
Het bleek dat dit simpele ontwerp erg doeltreffend was: gemakkelijk te bouwen, toegankelijk en ook aansprekend bij de doelgroep.
Tijdens de bouw hebben we onder de paraplu van het 'voortschrijdend inzicht' nog enige kleine aanpassingen gedaan aan het ontwerp. Er was geen tijd om Lust om een oplossing te vragen bij eventuele knelpunten, dus hebben we hierbij het heft volledig in eigen hand genomen. Dit geldt ook deels voor het projectmanagement. Die was ook te druk met de ambassadeurs in de weer om enig overzicht te hebben in de voortgang van zaken. Daarom heeft produktie op een gegeven moment ook die taken in handen genomen om de voortgang van het project te garanderen.
Reacties
Hoewel de reacties op deze versie bijna overwegend positief waren, is hier natuurlijk ook wel wat op aan te merken. De site is zo snel gebouwd dat het eigenlijk een wonder is dat hij niet rammelt aan alle kanten. Maar het bouwteam was tegen het einde van dit project zo op elkaar ingespeeld en had nauwelijks iets anders gedaan dan zich bezighouden met toegankelijkheid. Bovendien beschikten de meesten al van te voren over een solide (technische) basis.
Eén van de opmerkingen die we vaker kregen van bezoekers: het lettertype is echt veel te klein. Waarschijnlijk is men niet meer gewend dat je de lettergrootte zelf kunt instellen (zoals vroeger altijd kon voor de introductie van CSS) en heeft men de standaardinstellingen van de browser op een klein font staan.
Met eenhelppaginaa over dit soort instellingen en aanpassingen die de gebruiker zelf kan doen hopen we in de nieuwe fase meer duidelijkheid te scheppen.
Een andere opmerking: het groen van de eerste rubriek is veel te licht om te lezen. Ook dit zou verholpen kunnen worden door bijvoorbeeld de style sheets binnen de browser uit te schakelen, maar dat is een beetje een vlieg met een kanon doodschieten. Inmiddels heb ik de rubriek donkerder gemaakt. Een fluitje van een cent, als de kleurcoderingen in één centrale style sheet staan. Je hoeft dan alleen nog maar twee plaatjes aan te passen.
Op de site staat ook dat we niet pretenderen dat dit het voorbeeld is voor een toegankelijke website. Er zijn vele interpretaties mogelijk en gebruikers worden uitgenodigd te reageren op dingen die ze nog onduidelijk vinden.
Fase 3
Inmiddels zijn we aanbeland bij de huidige fase van Drempelsweg.nl. Waarschijnlijk zullen de werkzaamheden samenvallen met mijn afstudeerpresentatie. De belangrijkste aanpassingen: een themanavigatie (elke maand wordt een ander thema belicht) en een z.g. matrix interface. Dit houdt in dat functionaliteiten en onderwerpen gescheiden worden. Elk onderwerp krijgt haar eigen functionaliteiten (dus elke rubriek krijgt een nieuwsrubriek, een forum etc.). Meer hierover in het hoofdstuk Conclusies & aanbevelingen (onder Verwachtingen).
Fig.5: Fase 2, de site die het grote publiek kent.
Fig.6: Fase 3 heeft een andere indeling van rubrieken. Het groen heeft een hoger contrast met de witte achtergrond gekregen.
naar boven