Webrichtlijnen

Voorbeeld redactiescherm met Webrichtlijnen meldingen

webrichtlijnen meldingen klein

Bekijk deze afbeeling op ware grootte ( document in gif).

Webrichtijnen 2.0 en PDF bestanden

Op de website van de the Internet Academy staat een uitstekend document dat beschrijft hoe goede toegankelijke PDF bestanden te maken.

The Internet Academy, Syllabus Toegankelijke PDF-documenten

Algemeen

Voor het bouwen van websites bestaan internationaal erkende afspraken in de vorm van webstandaarden. Toepassing van deze standaarden levert beduidend betere websites op. De Nederlandse overheid heeft deze internationale standaarden handzaam samengebracht in een kwaliteitsmodel Webrichtlijnen. Het omvat 125 kwaliteitseisen ten behoeve van betere websites.

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.

Bij de Webrichtlijnen staat de gebruiker van een website centraal. Een correcte toepassing van de Webrichtlijnen leidt ertoe dat websites beter en duurzaam toegankelijk zijn voor alle bezoekers, toepassingen en browsers. Dit heeft een directe relatie met het rendement van een website. Een website die is toegesneden op meerdere typen browsers, heeft een hoger rendement, omdat de site meer mensen bereikt.

Ook is de site 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. Ook het gebruik van leesbare webadressen, levert betere zoekresultaten op.

Verder bevordert toepassing van de Webrichtlijnen de ‘duurzaamheid' van websites. Op websites die voldoen aan de Webrichtlijnen, blijft informatie 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.

Websites die zijn ontwikkeld volgens de Webrichtlijnen zijn niet alleen beter (en duurzaam) toegankelijk, maar ook sneller. Ze hebben tot 80 procent minder code nodig dan een conventionele website. Dat beperkt het dataverkeer en maakt websites stukken sneller.

Meer informatie over de webrichtlijnen vindt u via de website http://www.webrichtlijnen.nl/

U kunt ons document over Webrichtlijnen downloaden. Hierin staat nadere uitleg over webrichtlijnen en hoe deze in de praktijk toe te passen. PDF: Webrichtlijnen IPROX-4 versie 4 (309 kB)

IPROX en de webrichtlijnen

Na het opmaken van de inhoud van een pagina wordt u (zodra u de IPROX-editor afsluit) direct geattendeerd op schendingen van webrichtlijnen zoals onlogische kophiërarchie, ontbrekende teksten bij afbeeldingen, dubbele breaks of tabelindelingen die niet aan de voorschriften voldoen. Er verschijnt dan een rood vlak om de sectie die niet aan de webrichtlijnen voldoet. Wanneer u met de muisaanwijzer over dit rode vlak beweegt verschijnt in de alttag de bijbehorende melding.

Deze meldingen kunnen ook worden getoond terwijl u in het inhoudsveld aan het werk bent. Klik daartoe op een willekeurige plaats binnen het rode vlak en vervolgens op het icoon ‘Toon Webrichtlijnen melding'.

Zodra er een overtreding van een webrichtlijn optreedt, wordt de tekst gemarkeerd met een rode balk. De manier waarop een toelichting op de fout wordt gegeven, is alsvolgt:

  • Wanneer het HTML-veld open is, verschijnt na het selecteren van de foutmelding en vervolgens het webrichtlijnen-icoon in de editor een publieksvriendelijke tekst die direct aangeeft wat er fout is.
  • Wanneer het HTML-veld gesloten is, verschijnt bij Mouse-over de publieksvriendelijke tekst aangevuld met de aanduiding van de officiële webrichtlijn.
  • Bovenin het bewerkenscherm verschijnt een overzicht van alle webrichtlijnen-meldingen binnen het voorstaande tabblad. Dit overzicht bevat publieksvriendelijke tekst én officiële webrichtlijn. Bovendien kan men vanuit dit overzicht doorklikken naar betreffende pagina op www.webrichtlijnen.nl voor een detailuitleg.
  • De toelichtende tekst is aangepast en kent de volgende opbouw: eerst een publieksvriendelijke toelichting, daarna een aanduiding van de officiële webrichtlijn die overtreden wordt.

De lijst van meldingen die IPROX-genereert

Meldingen in IPROX over webrichtlijnen

Item

Mogelijke altertering

Actie

Afbeelding

R-pd.7.1: 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. (Geen goede alternatieve tekst voor afbeelding)

Blinden en slechtzienden kunnen een afbeelding niet zien. De software die ze gebruiken kan wel de alt-TAG (in IPROX: toelichting van de foto) aangeven.

In IPROX moet hiertoe het veld ‘toelichting' ingevuld worden bij het uploaden van een bestand.

Tabel

R-pd.11.2: Gebruik het th (table header) element voor het beschrijven van een kolom of rij in een tabel met relationele informatie. (geen kopcellen in tabel)

Een tabel moet minimaal 1 Table-header (TH), bijschrift (caption) en een samenvatting (summary) hebben.

Daarnaast is het van belang een tabel alleen voor tabel-doeleinden in te zetten, dus een tabel inzetten om tekst en afbeeldingen op de juiste manier uit te lijnen is niet toegestaan.

Een tableheader moet beschrijven waar de informatie over gaat. In IPROX kun je aangegeven dat het een ‘ kop' (TH) betreft. Een tableheader kan op de 1e rij en/of op de 1e kolom staan.

De samenvatting is een korte beschrijving waar de tabel over gaat.

R-pd.11.3: Groepeer rijen met alleen th (table header) cellen met het thead (table head) element. Groepeer de rest van de tabel met het tbody (table body) element. (Ongeldige groepering rijen in tabel)

R-pd.11.4 : Gebruik het scope attribuut voor het associëren van tabellabels (th cellen) met kolommen of rijen.(Geen scope aangegeven bij kopcel in tabel)

R-pd.11.7 : Gebruik het caption element of heading markup voor het geven van een koptekst boven een tabel. (Geen bijschrift bij tabel)

Opmaak

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)

Het toont op dezelfde manier, maar het is het verkeerde gebruik van een enter: 2x breaks (shift enters) plaatsen. Soms zit het in een stuk tekst dat je gekopieerd hebt en kan het ongemerkt op je site staan.

Een enkelvoudige Shift enter (break) is wel toegestaan.

Headers

R-pd.3.3: Sla in de markup geen niveaus in de hiërarchie van kopregels over.

(Foute hiërarchie: H{0} => H{1})

Bij de meeste IPROX-implementaties wordt de paginatitel in H2 weergeven. De redactie kan de koppen vanaf H3 inzetten. Dit moet wel in een logische volgorde. Je start dus altijd met een H2.

Alleen na een H3 mag je een H4 inzetten. Het is dus niet toegestaan te beginnen met een H4 en daarna verder te gaan met een H6.

Mailadres

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)

Je mag alleen een mailadres als volgt noteren: naam@domein.nl Naam met daaraan een mailadres is niet toegestaan. Het is dan niet direct duidelijk dat het een mailadres betreft.

Mailadres

R-pd.8.17: Links naar e-mail adressen: de URL in het href attribuut van een link naar een e-mail adres, mag alleen het mailto protocol en een e-mail adres bevatten. (Formaat link naar e-mail adres {0} onjuist)

Je mag voor het toevoegen van het e-mailadres alleen een e-mailadres invoeren.

Unieke Pagina ID's voor braillelezers en screenreaders

Blinden maken vaak gebruik van een schermleesprogramma (screenreader) of een brailleregel om websites te bezoeken. Het grote verschil tussen deze manier van sitebezoek en de gangbare manier, met een grafische browser, is dat een schermleesprogramma of brailleregel de inhoud stap voor stap, van begin tot eind, voordraagt. Het navigeren door deze inhoud wordt seriële navigatie genoemd. Wanneer er gebruik wordt gemaakt van seriële navigatie, is het nodig dat elk element op de pagina een volstrekt uniek ID heeft. IPROX werkt met deze unieke ID's waarmee wordt voldaan aan de webrichtlijnen

Zoekformulier