Hoe maak je de links op je website toegankelijk met Sitebox? Lees in dit artikel meer over de minimale eisen voor overheidsinstellingen en best practises.
Op deze pagina:
- Aanleiding van de richtlijn
- WCAG 2.4.4 Linkdoel (In context) AA
- WCAG 2.4.9 Linkdoel (Alleen Link) AAA
- Tips voor het maken van een goede link
- Belangrijke termen
- Gerelateerde onderwerpen
Dit artikel geeft meer infomatie over de manier waarop je met Sitebox aan de webrichtlijnen kunt voldoen. In het kort: Hoe maak je een goede link met Sitebox?
Wanneer je wilt weten hoe je een link aanmaakt in Sitebox, lees dan het artikel Verschillende soorten links op je webpagina.
Voor meer informatie over de toegankelijkheidseisen bekijk je de pagina's Richtlijnen voor Toegankelijkheid van Webcontent (WCAG) 2.1 of How to Meet WCAG (Quick Reference) op de website van W3C.
Aanleiding van de richtlijn
Wanneer je op je webpagina een hyperlink plaatst, is het belangrijk dat voor iedereen duidelijk is waar deze link naartoe verwijst. Voor het grootste deel van de bezoekers van je webpagina is het linkdoel op te maken uit de content die in relatie tot de link wordt aangeboden. Op een goed gestylde webpagina is in één oogopslag te bepalen welke content bij de link hoort.
Voor de bezoekers die gebruik maken van hulpsoftware in verband met een visuele beperking is dit iets complexer. Daarom is het belangrijk dat de webpagina zo wordt ingericht dat het ook voor hen duidelijk is waar de link naartoe verwijst.
De Web Content Accessibility Guidelines (WCAG) 2.1 schrijven voor op welke manier je ervoor moet zorgen dat het linkdoel duidelijk is voor al je gebruikers. Dit kan op twee niveaus:
- Niveau AA: Het niveau waar overheidsinstellingen aan moeten voldoen. Richtlijnen voor het duidelijk maken van het linkdoel op dit niveau staan in WCAG-criterium 2.4.4 Linkdoel (In context).
- Niveau AAA: Dit niveau wordt over het algemeen gezien als 'Best Practice'. Hiermee maak je in de link zelf duidelijk wat het doel is van de link. Richtlijnen voor niveau staan in WCAG-criterium 2.4.9 Linkdoel (Alleen Link).
WCAG 2.4.4 Linkdoel (In context) AA
Op AA-niveau is het niet nodig dat een gebruiker van hulpsoftware aan alleen de link zelf kan zien wat het linkdoel is. Wel is het belangrijk dat de gebruiker dit kan opmaken uit de door de software bepaalde context van de link.
Je kunt er op verschillende manieren voor zorgen dat er door software bepaalde context wordt gegeven aan een link, maar als content beheerder in Sitebox zijn deze manieren beperkt. Een voorbeeld hiervan is het titelattribuut. Deze kun je met Sitebox niet handmatig toevoegen.
Wanneer je kundig bent met HTML heb je iets meer speelruimte, al zijn er HTML-attributen die niet worden ondersteund door de teksteditor van Sitebox. Daarnaast is het advies om het zo simpel mogelijk te houden voor jezelf en je collega's.
Wanneer je je houdt aan de volgende richtlijnen voldoen je links altijd aan het criterium:
- Een link bevat een linktekst die een beschrijving geeft van de informatie bij die URL:Een pagina bevat de zin "Er was veel bloedvergieten tijdens de middeleeuwen." Waar "middeleeuwen" een link is.
- Een link wordt voorafgegaan door een tekstbeschrijving van de informatie op die URL:Een pagina bevat de zin "Lees meer over de Ierse regering van de Commissie voor elektronisch stemmen op Go Vote!". Hierbij is "Go Vote!" een link.
Volgens de richtlijnen is het belangrijk dat de beschrijving in dezelfde paragraaf staat als de link. Wanneer de link en de beschrijving in één zin staan is dit eigenlijk altijd het geval. Wanneer je meer kennis hebt van HTML kun je met de HTML-editor meer speelruimte creëren. Houdt er wel rekening mee dat de beschrijving niet te lang wordt. - Een link bestaat uit een afbeelding met de juiste alt-tekst:Het logo van de gemeente Juinen is een link naar de webpagina van de gemeenten Juinen. De linktekst van het logo is "Logo van de gemeente Juinen"
- Zowel een pictogram als tekst zijn opgenomen in dezelfde link:Een pictogram van een telefoon en de tekst "Klantenservice van de gemeente Juinen" worden gecombineerd om een enkele link te maken. Het pictogram wordt aangemerkt als decoratief, aangezien het doel van de link al wordt beschreven door de tekst van de link naast het pictogram.
- Een lijst met document titels:Een lijst met boeken is beschikbaar in drie indelingen: HTML, PDF en mp3 (een opname van een persoon die het boek leest). Om te voorkomen dat de titel van elk boek drie keer wordt voorgelezen door een screenreader (één keer voor elk formaat), worden de links per boek als volgt ingesteld: de linktekst voor de eerste link is de titel van het boek, de linktekst van de tweede link 'pdf' en de linktekst van de derde link 'mp3'.
- Een tabel met links:Een reisorganisatie heeft voor een vakantiebestemming een overzicht gemaakt van de auto's die op locatie kunnen worden gehuurd door middel van een tabel. In de tabel zijn de headers voor de rijen en de kolommen op de juiste manier ingesteld voor het soort auto en de verhuurbedrijven. In de cellen staan de links naar de verhuurpagina's van de specifieke auto's. De linktekst voor deze links is de prijs die voor deze specifieke auto's geldt.
National Avis Hertz Coupé v.a. €67/dag v.a. €68/dag v.a. €72/dag Sedan v.a. €68/dag v.a. €69/dag v.a. €74/dag Station v.a. €79/dag v.a. €80/dag v.a. €83/dag
De door de software bepaalde context van de link, namelijk de headers van de kolommen en rijen maken duidelijk waar de link naartoe leidt.
WCAG 2.4.9 Linkdoel (Alleen Link) AAA
Op AAA-niveau is het belangrijk dat een gebruiker van hulpsoftware aan alleen de linktekst zelf kan zien wat het linkdoel is van een link.
Wanneer je je houdt aan de volgende richtlijnen voldoen je links altijd aan dit criterium:
- Een link bevat een linktekst die een beschrijving geeft van de informatie bij die URL:Een pagina bevat de zin "Er was veel bloedvergieten tijdens de middeleeuwen." Waar "middeleeuwen" een link is.
- Een link bestaat uit een afbeelding met de juiste alt-tekst:Het logo van de gemeente Juinen is een link naar de webpagina van de gemeenten Juinen. De linktekst van het logo is "Link naar de website van de gemeente Juinen"
- Zowel een pictogram als tekst zijn opgenomen in dezelfde link:Een pictogram van een telefoon en de tekst "Klantenservice van de gemeente Juinen" worden gecombineerd om een enkele link te maken. Het pictogram wordt aangemerkt als decoratief, aangezien het doel van de link al wordt beschreven door de tekst van de link naast het pictogram.
Tips voor het maken van een goede link
Nu je weet op welke manieren je je link in Sitebox kunt laten voldoen aan de webrichtlijnen, zijn hier nog een paar tips om je links zo goed en duidelijk mogelijk te maken:
Voorkom verrassingen
Wanneer men op een link klikt verwacht men over het algemeen een tekstartikel. Wanneer dit niet het geval is en je bijvoorbeeld rechtstreeks linkt naar een afbeelding of video, is het slim om dat te vermelden in de linktekst:- Jan Smit vertelt in deze video over de nieuwe maatergelen rond gaswinning.
- Het verhaal van Jan Smit over de nieuwe maatregelen rond gaswinning (video).
- Schrijf alsof er geen links zijn
Probeer je tekst niet om linkjes heen te schrijven, maar schrijf je zin en voeg de links later toe aan de geschreven tekst:Dus niet: De website van de gemeente Juinen zet alle maatregelen rond gaswinning op een rijtje. Deze vind je hier.
Maar: De website van de gemeente Juinen zet alle maatregelen rond gaswinning op een rijtje. - Maak de linktekst niet te kort en niet te lang
In het verleden kwam vaak het advies om linkteksten zo kort mogelijk te houden. Natuurlijk kunnen grote stukken onderstreepte en vette of gekleurde tekst storend lezen. Maak je links dus ook niet onnodig lang. Zorg vooral dat de linktekst zo goed mogelijk overeenkomt met de inhoud van het linkdoel:Dus niet: De website van de gemeente Juinen zet alle maatregelen rond gaswinning op een rijtje.
En niet: De website van de gemeente Juinen zet alle maatregelen rond gaswinning op een rijtje.
Maar: De website van de gemeente Juinen zet alle maatregelen rond gaswinning op een rijtje. 
Klik hier!
Met successcriterium 2.4.4 mag je linkteksten als 'lees meer' of 'meld je aan' gebruiken wanneer er voldoende beschrijving wordt gegeven in de door software bepaalde linkcontext. Het advies is om dit niet te doen, maar als je het toch doet kun je teksten als 'klik hier' beter niet gebruiken.
Niet alle gebruikers van je website gebruiken dezelfde middelen om je website te bezoeken. Sommige bezoekers navigeren je webpagina niet met een muis. De tekst 'klik hier' doet vermoeden dat je de link alleen kunt activeren door erop te klikken. Dat is natuurlijk niet zo.- Openen in een nieuw venster
In Sitebox kun je ervoor kiezen om links te openen in hetzelfde venster, in een nieuw venster of in een pop-up venster. WCAG 2.1 successcriterium 3.2.1 On Focus adviseert om links alleen te openen in een nieuw venster wanneer dit echt nodig is.
Belangrijke termen
Alt-tekst
Een alt-tekst is een korte beschrijving van een afbeelding die in de code wordt opgenomen. Mocht de afbeelding om welke reden dan ook niet geladen kunnen worden, dan wordt de alt-tekst getoond als alternatief. De alt-tekst wordt ook voorgelezen door hulpsoftware als alternatief voor gebruikers met een visuele beperking.
Een afbeelding kan in de alt-tekst worden aangemerkt als decoratief. Er is dan geen alternatieve beschrijving nodig.Best Practice
Een best practice is een techniek, werkmethode of activiteit die zich als effectiever heeft bewezen dan enige andere. De gedachte is dat met de juiste werkmethode een project uitgevoerd kan worden met minder problemen, minder onvoorziene complicaties en betere eindresultaten.Context (door software bepaalde linkcontext)
De context is het totaal van aanvullende informatie die in combinatie met de linktekst aan de gebruiker wordt getoond. Welke aanvullende informatie wordt gedefinieerd als context hangt af van de manier waarop deze wordt aangeboden in de code.
Hulpsoftware maakt gebruik van verschillende methoden om de context te bepalen. Deze methodes zijn gebaseerd op de code en niet op visuele queues.Voorbeeld: Een onderdeel van de context is de paragraaf waarin de afbeelding staat. Hiermee wordt bedoeld het stuk tekst dat in de code samen met de afbeelding tussen <p> en </p> staat.
Iets kan er visueel uitzien als één paragraaf. Maar als het in de code opgeknipt is in drie stukken die ieder tussen <p> en </p> staan, is het geen door software bepaalde linkcontext.Hyperlink
Een hyperlink of in het kort 'link' is een verwijzing op een webpagina of in een document naar een specifiek aankomstpunt op/in dezelfde of een andere webpagina of document.Linkdoel
Het linkdoel is de URL waar de link naartoe verwijst.Linktekst
De linktekst is de tekst die zichtbaar is in plaats van de URL van de hyperlink.Titelattribuut
Een titelattribuut wordt ook wel een tooltip genoemd. Dit is het stukje tekst dat tevoorschijn komt wanneer je met je muis op een link gaat staan.
Een link kan verwijzen naar een interne pagina of een pagina buiten de website. Voor doelpagina's buiten de website wordt door Sitebox in het titelattribuut gezet dat de link verwijst naar een externe pagina.
Veel screenreaders lezen niet alleen de link-tekst, maar ook het titelattribuut voor. In veel gevallen is dit dubbelop. Voor het voorbeeld in de afbeelding werd bijvoorbeeld door een screenreader voorgelezen "ondernemen: ondernemen".
Daarom hebben interne links voor websites die gemaakt zijn met Sitebox geen titelattribuut.