Webrichtlijnen toegankelijkheid in IPROX-4 Augustus 2012 versie 4
Inhoudsopgave 1. Waarom webrichtlijnen?... 5 2. Wat hebben de redacteuren zelf in de hand?... 6 3. Webrichtlijnen zichtbaar gemaakt in IPROX... 7 4. Webrichtlijnen, de praktijk... 9 5. De samenvattingen... 9 6. Indeling in koppen... 10 7. Paragrafen indelen... 10 8. Link / verwijzing... 11 9. Mailadressen... 11 10. Toegestane bestandstypen... 12 11. Aanduiden van anderstalige tekst... 12 12. Toelichting bij afbeeldingen... 13 13. Tabellen... 14 14. Gebruik van afkorting (ABBR)... 18 15. Opnemen van media... 18 document datum: augustus 2012, versie 4 2
Inleiding De webrichtlijnen gaan over het ontwerpen, bouwen en beheren van websites. Ze zijn gebaseerd op internationale standaarden voor kwaliteit en toegankelijkheid. Voor InfoProjects is het bouwen van websites conform de webrichtlijnen één van de speerpunten. Momenteel is InfoProjects gekwalificeerd als meest toegankelijke webbouwer door Accessibility en bouwt daar graag op voort. InfoProjects levert twee leden van de Adviesgroep Webrichtlijnen en is daarmee betrokken bij de actuele stand van zaken. Regelmatig komt deze Adviesgroep Webrichtlijnen bij elkaar om ideeën, ervaringen en ontwikkelingen uit de praktijk te bespreken. Waar doen we het voor? Iedereen vindt het de normaalste zaak van de wereld dat een overheidsgebouw toegankelijk is. Zo hebben gebouwen een hellingbaan voor rolstoelgebruikers, een invalidentoilet en liftknoppen met brailletekens. Daarnaast gelden nog tientallen geboden en verboden die ervoor zorgen dat een gebouw toegankelijk, veilig en bruikbaar is. Is het dan niet logisch dat die toegankelijkheidsnorm ook wordt toegepast op de informatie die de overheid verstrekt? De overheid wil dat alle burgers informatie op overheidswebsites goed kunnen vinden, begrijpen en gebruiken. Een voorwaarde daarvoor is dat die websites goed en toegankelijk worden gebouwd. Naarmate digitale dienstverlening de norm wordt, gaat online toegankelijkheid steeds zwaarder wegen. Het is een misverstand te focussen op mensen met een functiebeperking. Het gaat om de gehele kwaliteit die ook voor de organisatie zelf zijn vruchten afwerpt. Een site die volgens de webrichtlijnen wordt gebouwd, is op alle fronten beter. De site is sneller, kan op alle platformen worden bekeken en de informatie is beter vindbaar. Hiermee biedt een toegankelijk site niet alleen voordelen voor de bezoeker maar zeker ook voor de aanbieder. Wanneer mensen informatie goed kunnen vinden en transacties vlekkeloos kunnen uitvoeren, hoeven alternatieve (duurdere) kanalen niet aangewend te worden. Bekijk de voordelen op: http://www.webrichtlijnen.nl/wat-en-waarom/voordelen. Resultaatverplichting Voor websites van de rijksoverheid geldt sinds september 2006 dat ze bij oplevering dienen te voldoen aan de Webrichtlijnen. Dit is vastgelegd in het Besluit Kwaliteit Rijksoverheids websites. Voor decentrale overheden geldt dat de implementatie van de webrichtlijnen als resultaatverplichting opgenomen is in de overheidsbrede implementatieagenda voor dienstverlening en e-overheid (i-nup). Daarbij geldt dat de sites eind 2012 aan prioriteit 1 moeten voldoen. Op 1 januari 2015 moeten de overheidwebsites aan de maximale eisen voldoen (prioriteit 3). document datum: augustus 2012, versie 4 3
Stichting Accessibility Stichting Accessibility is het expertisecentrum op het gebied van kwaliteit en toegankelijkheid van ICT. De Stichting inspecteert websites en software op toegankelijkheid. Na een inspectie kunnen websites het Waarmerk drempelvrij.nl behalen. Omdat de norm van het Waarmerk drempelvrij.nl de internationale WCAG-standaard volgt, heeft het behalen van het logo met 'het groene mannetje' ook direct internationale waarde. Het Waarmerk drempelvrij omvat drie niveaus: prioriteit 1, 2 en Webrichtlijnen. Van een website die aan de minimale toegankelijkheidseisen (prioriteit 1) voldoet, tot een toegankelijke, gebruiksvriendelijke én kwalitatief goed gebouwde website (Webrichtlijnen). De Stichting houdt tevens een lijst bij van 'toegankelijke bouwers'. In deze lijst worden webbouwers vermeld die betrokken zijn (geweest) bij de bouw van websites die deelnemen aan het Waarmerk drempelvrij.nl Onlangs heeft de Stichting Accessibility InfoProjects bovenaan deze lijst met 'toegankelijke bouwers' gezet. Wat doet InfoProjects? IPROX zorgt er technisch gezien voor dat pagina s aan de webrichtlijnen kunnen voldoen. Kunnen, want als redacteur bent u verantwoordelijk voor het laatste onderdeel: correcte plaatsing van de inhoud in IPROX. In de volgende hoofdstukken gaan we dieper in op de webrichtlijnen zoals die door jou als redacteur toegepast worden. De opgenomen afbeeldingen in dit document zijn afkomstig uit IPROX-4.2. Bekijk de website Meer informatie over de webrichtlijnen vindt u via de website www.webrichtlijnen.nl, deze site is de bron voor dit document. document datum: augustus 2012, versie 4 4
1. Waarom webrichtlijnen? Het toepassen van de webrichtlijnen is niet vrijblijvend. Op de bovengenoemde website kunt u hier meer over lezen onder Afspraken over toegankelijkheid. Overheden en bedrijven staan voor de uitdaging hun websites zó te bouwen dat ze zowel voor mensen als voor browsers en zoekmachines optimaal toegankelijk zijn. De Webrichtlijnen helpen daarbij. Een website met correcte toepassing van de Webrichtlijnen scoort beter op onderstaande punten. Algemene toegankelijkheid Websites zijn beter en duurzaam toegankelijk voor alle bezoekers, toepassingen en browsers. De gebruiker van een website staat centraal. De site is beter vindbaar in zoekmachines Zoekmachines kijken naar de gestructureerde inhoud van webpagina s. In een website die voldoet aan de Webrichtlijnen is de inhoud gestructureerd in volgorde van belangrijkheid. Zoekmachines kunnen deze gestructureerde inhoud effectiever indexeren, wat gebruikers positieve resultaten oplevert. De duurzaamheid van websites bevordert De informatie blijft gedurende langere tijd gemakkelijker vindbaar en doorzoekbaar. Ook is deze informatie beter te archiveren. Het belang hiervan neemt toe, omdat belangrijke informatie steeds via websites wordt aangeboden. Snellere websites Websites die zijn ontwikkeld volgens de Webrichtlijnen zijn niet alleen beter toegankelijk, maar ook sneller en dus duurzamer. Ze hebben tot 80 procent minder code nodig dan een conventionele website. Dat beperkt het dataverkeer en maakt websites stukken sneller. document datum: augustus 2012, versie 4 5
2. Wat hebben de redacteuren zelf in de hand? Redacteuren hebben zelf grote invloed op de mate waarin hun website voldoet aan de webrichtlijnen. De belangrijkste punten komen in dit document aan de orde: 1. Maak een heldere samenvatting over de inhoud van de pagina in het Meta tabblad. 2. Maak gebruik van tussenkopjes en gebruik hierbij de hiërarchie van de koppenstructuur, gebruik hiervoor geen vet en/of cursief. 3. Gebruik uitsluitend Enters in de tekst. 4. Gebruik voor een interne of externe link de titel van de informatie als link en nooit Klik hier of Ga naar. 5. Gebruik voor een link naar een download een goede tekst, geef de het bestandstype aan en de bestandsgrootte. 6. Gebruik het volledige e-mailadres indien u het als link wilt opnemen. 7. Verklaar een afkorting in de tekst via de ABBR-functie uit de IPROX-Editor. 8. Bij foto s schrijft u toelichtingen die vertellen wat er op de foto s of afbeeldingen te zien is. 9. Maak een tabel met de juiste tabeleigenschappen als met bijschrift, samenvatting, koprij of kopkolom. 10. Bewegende beelden als video s en animaties moet u voorzien van ondertiteling en een auditieve beschrijving van de beelden. document datum: augustus 2012, versie 4 6
3. Webrichtlijnen zichtbaar gemaakt in IPROX De Itemtab Binnen IPROX kunt u op verschillende manieren zien dat uw pagina webrichtlijnen meldingen geeft. In de Itemtab van het dialoogscherm van de pagina, zoals hieronder is afgebeeld. De werklijsten Op de startpagina s van sites en containers kunt u een lijst van pagina s met webrichtlijnen oproepen door middel van de knop [Webrichtlijnen meldingen]. Dit is een zoekopdracht die alle pagina s in de structuur waar u zich op dat moment bevindt laat zien, waarop één of meerdere webrichtlijnmeldingen van toepassing zijn. document datum: augustus 2012, versie 4 7
Het redactiescherm In het redactiescherm van de pagina zijn de webrichtlijnen meldingen op verschillende plaatsen zichtbaar. 1. Er is een lijst van de meldingen te zien bovenaan het redactiescherm. De rode nummering is klikbaar naar de pagina op webrichtlijnen.nl over dit onderwerp. 2. In het tabblad waar de webrichtlijnen niet zijn gehandhaafd, is een het icoon zichtbaar. 3. In het HTML-veld is de melding met een kader aangeduid en kan het soort melding via het icoon worden getoond. Klik op het icoon in de IPROX-Editor en u ziet de melding verschijnen. In enkele IPROX omgevingen is het rood vervangen door grijs. document datum: augustus 2012, versie 4 8
4. Webrichtlijnen, de praktijk In de volgende hoofdstukken vindt u de meldingen van webrichtlijnen terug en geven we uitleg hoe de meldingen op te lossen in de praktijk. Op details kan uw omgeving afwijken van de standaard. Bijvoorbeeld dat sommige velden wel of juist niet aangemerkt zijn als verplicht veld. In de tekst refereren we regelmatig aan de IPROX-Editor. In de online Help kunt u hierover gedetailleerd informatie vinden. http://help.iprox.nl/iprox-editor-detail Nummering webrichtlijnen De nummering van de webrichtlijnen refereert aan de nummering die staat op de site Webrichtlijnen. Een voorbeeld hiervan is: R-pd.3.3. De bijbehorende pagina op de website: http://www.webrichtlijnen.nl/richtlijnen/webrichtlijnen-1/r-pd-3-3. De website wordt regelmatig voorzien van nieuwe inhoud en inzichten. In de volgende hoofdstukken is de nummering zo veel mogelijk vermeld. 5. De samenvattingen Meta tabblad In het tabblad Meta zorgt u voor een heldere korte samenvatting van twee of drie heldere zinnen. Gebruik in deze samenvatting zoveel mogelijk kernwoorden waarover de pagina gaat en waarop bezoeker mogelijk zoeken. Zoekmachines maken naast de tekst in het artikel ook gebruik van de samenvatting. Schrijf altijd in hele zinnen, het kan voorkomen dat de samenvatting op de pagina toont of op een andere plaats in de site te zien is. Denk hierbij aan de Indexpagina. Tabel In de tabel kunt u een samenvatting opnemen. Deze toont niet op de pagina, zoekmachines maken er wel gebruik van. In deze samenvatting schrijft u wat het verband is tussen de kopcellen en de gegevens die daarbij horen. En verder Op alle andere onderdelen waar u een samenvatting kunt invullen gelden de bovenstaande regels. document datum: augustus 2012, versie 4 9
6. Indeling in koppen Officiële tekst: R-pd.3.3 Sla in de markup geen niveaus in de hiërarchie van kopregels over. Vet of cursief mag u inzetten om tekst te benadrukken. Gebruik deze mogelijkheid echter nietniet voor volledige tekstpassages of tussenkoppen. Zoals u in Word een document voorziet van hoofdstuk indeling, zo werkt u in IPROX met een indeling in koppen. Koppen boven een alinea moeten als header gedefinieerd zijn, H2 en volgende. Koppen vet maken of cursief is niet toegestaan. Dit genereert een foutmelding. Het is van belang een logische volgorde aan te houden indien u gebruik maakt van koppen. Afhankelijk van uw IPROX-implementatie begint de 1e kop in een tekstveld met een H2 of een H3. In de meeste gevallen met H3. H1 is gereserveerd voor de titel van uw pagina, H2 is gereserveerd voor losse elementen zoals het kruimelpad en kopjes voor rechter zijbalk elementen. Deze twee kopstijlen komen dus niet voor in de IPROX-Editor. Na een H3 mag H4 worden toegepast, na H4 mag H5 worden toegepast, enzovoorts. Willekeurig gebruik van de kopstijlen is niet toegestaan. Dus niet: H4 gevolgd door H6. 7. Paragrafen indelen Officiële tekst: R-pd.3.4: Gebruik het p (paragraph) element voor het aangeven van paragrafen. Gebruik niet het br (linebreak) element voor het scheiden van paragrafen.(meervoudige nieuwe regel) document datum: augustus 2012, versie 4 10
Het is niet toegestaan lege regels in de pagina op te nemen die zijn ontstaan door meervoudig gebruik van Enter of Shift + Enter. Een enkelvoudige Shift + Enter (break) of Enter (paragraaf) is wel toegestaan. Indien het nodig is meer witruimte te creëren dan dient dit in de stijlset te worden opgenomen. Het is aan te raden na het plakken van tekst uit Office programma s eerst de overbodige witruimtes te verwijderen voordat u andere bewerkingen uitvoert. 8. Link / verwijzing Officiële tekst: "Richtlijn R-pd.8.1: Beschrijf niet het mechanisme achter het volgen van een link." Schrijf teksten die prettig te lezen zijn. Links (verwijzingen) hoeven niet van tevoren te worden aangekondigd. Ook is het overbodig om het mechanisme achter het volgen van een link te beschrijven. Zoals: Klik hier. Tekst met kernbegrippen hebben de voorkeur. Bezoekers lezen namelijk vaak niet de tekst op een site; ze zoeken naar opvallend gemarkeerde trefwoorden. Linktekst moet in principe buiten de context van de omringende tekst te begrijpen zijn; men leest de context namelijk niet. 9. Mailadressen Officiële tekst: R-pd.8.16: Links naar e-mail adressen: het e-mail adres waaraan het te versturen bericht is gericht dient zichtbaar te zijn in de linktekst. (Adres {0} niet zichtbaar in linktekst) U mag alleen een mailadres als volgt noteren: naam@domein.nl. Een eigennaam met als hyperlink een mailadres is niet toegestaan. Het is dan niet direct duidelijk dat het een mailadres is. document datum: augustus 2012, versie 4 11
10. Toegestane bestandstypen Officiële tekst: Richtlijn R-pd.8.20: Bij het aanbieden van downloadbare bestanden, informeer de bezoeker over hoe deze te downloaden en vervolgens te gebruiken. Het is van belang de bezoeker van de pagina duidelijk te maken wanneer er sprake is van het aanbieden van downloads en wat deze downloads inhouden. Het is niet toegestaan zonder melding vooraf downloads te laten openen. Welke bestandstypen er voor uw site geldig zijn is beschreven in het sitereglement van uw site. Het is belangrijk om bij een download altijd de titel, bestandssoort en de bestandsgrootte te vermelden. De websitebezoeker moet kunnen zien hoe groot het document is. De bezoeker wil zelf kunnen bepalen of het bestand direct geopend wordt in de browser of eerst opgeslagen moet worden. Indien u van een woord of tekstgedeelde een link maakt naar een download, kan de bezoeker aan de link niet zien om welke bestandssoort het gaat en hoe groot het is. In het voorbeeld is de onderste link duidelijker voor de bezoeker dan de bovenste link. 11. Aanduiden van anderstalige tekst Richtlijn R-pd.15.7 officiële tekst \Geef in de markup taalvariaties in de inhoud van pagina's aan. De site staat standaard ingesteld voor één taal: meestal het Nederlands. Voor een bezoeker van uw site die gebruik maakt van een spraakcomputer wordt de site in het Nederlands voorgelezen. Om de tekst die in een andere taal is geschreven goed te laten uitspreken is het noodzakelijk specifiek die tekst te voorzien van een zogenaamde taaltag. U maakt gebruik van de mogelijkheid in de IPROX-Editor zoals eerder is aangegeven. document datum: augustus 2012, versie 4 12
12. Toelichting bij afbeeldingen Richtijn-pd.7.1 Het invoeren van correcte toelichting bij afbeelding. Officiële tekst: Het alt (alternative) attribuut dient te worden gebruikt op ieder img (image) en area element en dient te worden voorzien van een effectieve alternatieve tekst. Een correcte alternatieve tekst aanbieden Wanneer een afbeelding niet kan worden getoond, bijvoorbeeld vanwege het gebruik van speciale software voor blinden en slechtzienden, wordt de waarde ervan weergegeven. Dit is de alternatieve tekst ook wel alt-tekst, of alt tag genoemd. In IPROX is dit het veld toelichting. Een effectieve alternatieve tekst is een tekst die gelezen kan worden in plaats van de afbeelding, zodat de informatie die met de afbeelding wordt overgebracht niet verloren gaat. Indien men met de muis over een afbeelding beweegt, wordt de alt tag zichtbaar. Zie het voorbeeld hieronder. In het Dialoogvenster van de afbeelding plaatst u een goede heldere tekst in het verplichte veld Toelichting. document datum: augustus 2012, versie 4 13
13. Tabellen Binnen websites is het een vereiste dat structuur en vormgeving gescheiden zijn. Gebruik tabellen voor het geordend presenteren van gegevens en niet voor het vormgeven van de pagina. Denk bijvoorbeeld aan: vertrek- en aankomsttijden, planningsschema s of overzichten van onderzoeksgegevens. Tabellen lenen zich uitstekend voor een overzicht van informatie in verschillende verbanden. Als het niet nodig is om een tabel in te zetten om informatie over te dragen, is het vaak beter de informatie in één context te plaatsen. Gebruik hiervoor een genummerde lijst of een opsomming. Voor het opnemen van foto's met bijbehorende tekst mag zeker geen tabel worden ingezet, u gebruikt in dat geval het paginatype Fotoalbum. De tabel zorgt ervoor dat cellen die gedefinieerd zijn als "kop" een relatie hebben met cellen die gedefinieerd zijn als "data". Op deze wijze kan informatie goed worden geïnterpreteerd. Voor braillelezers en zoek-spiders is dat van belang. Een tabel met daarin gedefinieerde koppen en data is zo opgezet dat de relaties er wel zijn. De tabel kan veel verschillende webrichtlijnen meldingen veroorzaken. Op deze pagina leest u daar uitgebreid over: http://www.webrichtlijnen.nl/aan-de-slag/tabellen De informatie in de volgende hoofdstukken helpen u bij het neerzetten van een goede tabel en het oplossen van herstellen van meldingen. IPROX-Editor, de knoppen voor de tabelfuncties Bovenstaande knoppen uit de IPROX-Editor zijn beschikbaar om de tabel mee te bouwen en te wijzigen. In de IPROX-help is de werking ervan uitgebreid opgenomen. help.iprox.nl document datum: augustus 2012, versie 4 14
Melding Koppen Melding Eigenschappen van deze rij Eigenschappen van een cel U stelt de eigenschappen in voor de hele rij, de cellen in die rij zijn dan automatisch van het type kop zijn. Het bereik is automatisch op kolom gezet. Immers, de kopcel zegt iets over alle ondergelegen cellen, de kolom. Er wordt een relatie gelegd. Dit is te controleren door met de cursor op één van de cellen in de koprij te gaan staan en in de IPROX-Editor op de knop eigenschappen van deze cel te klikken. Een rechter muisklik in de cel toont ook dit dialoogvenster. document datum: augustus 2012, versie 4 15
Bij het neerzetten van een nieuwe tabel definieert u direct de eerste rij van de tabel tot koprij als volgt: 1. Sta met de cursor in de eerste cel van de rij 2. Klik op het icoon in de IPROX-Editor eigenschappen van deze rij 3. Kies voor kop, zie afbeelding hieronder Meer informatie over het gebruik van kopcellen In een bestaande tabel kunt u een kolom of een rij toevoegen. Indien u na het invoeren van gegevens de IPROX-Editor sluit met OK, dan verschijnt er een melding over de kop. Een toegevoegde rij of kolom voorziet u handmatig van een kop en geeft in het dialoogvenster altijd aan om welk bereik het gaat. Voor een kop bovenaan een kolom zult u dus invoeren dat het bereik Kolom is, voor een kop vooraan een rij geeft u aan dat het bereik Rij is. Het kan voorkomen dat de melding hardnekkig is, steeds na OK in de IPROX-Editor. In dat geval gaat u alle kopcellen één voor één af en opent steeds het dialoogvenster Eigenschappen van deze cel. document datum: augustus 2012, versie 4 16
Melding bijschrift (titel) Een tabel moet worden voorzien van een bijschrift indien het niet direct voorafgegaan wordt door een Kopregel (H2, H3, H4 e.d.). In het dialoogvenster van de tabel voert u al direct het bijschrift en de samenvatting in. Samenvatting in een tabel Voor de gemiddelde gebruiker is het duidelijk waar een tabel over gaat. Dit geldt niet voor slecht ziende gebruikers. In het veld Samenvatting moet een een korte beschrijving van de inhoud van de tabel worden ingevoerd. Deze beschrijving is wel zichtbaar voor slecht ziende gebruikers en wordt door zoek spiders doorzocht. Dit veld is verder niet zichtbaar via de standaard browsers. De samenvatting is een korte beschrijving waar de tabel over gaat, de inhoud van de kopcellen en de relatie wordt beschreven. Het invullen van de samenvatting is alleen zinvol indien het een andere beschrijving is dan de titel. document datum: augustus 2012, versie 4 17
14. Gebruik van afkorting (ABBR) Officiële tekst: "Richtlijn R-pd.3.6 Gebruik het abbr (abbreviation) element voor afkortingen indien er onduidelijkheid zou kunnen ontstaan over de betekenis ervan, de afkorting een zeer belangrijke rol speelt in de tekst of wanneer de afkorting niet voorkomt in het Nederlands woordenboek. Selecteer de afkorting, kies in de IPROX-Editor voor ABBR en voer de volledige betekenis van de afkorting in. Voor de bezoeker ziet het er als volgt uit: 15. Opnemen van media Biedt alternatieven aan voor video, audio en bijzondere bestandsformaten. In veel omgevingen is het nu mogelijk om video-bestanden te plaatsen of YouTube films op te nemen. Wilt u aan de webrichtlijnen voldoen, dan bent u verplicht om een uitgeschreven variant aan te bieden (zoals een tekstbestand), zodat iedereen de mogelijk heeft om deze informatie tot zich te nemen. document datum: augustus 2012, versie 4 18