Training volgen? Bekijk onze trainingen op www.theinternetacademy.nl.

Auteur: Jaap van de Putte Met bijdragen van: Ab Bertholet (Ab&Co), Tom Hessels (Bartimeus), Tim van Schie (Stichting Accessibility), Gerard Copinga (Stichting Accessibility), Sandra Uittenbogaart (Taal & Tekst) Versie:

6 juni 2014

Uitgever:

The Internet Academy

Dit e-book wordt regelmatig bijgewerkt. De laatste versie vind je op www.theinternetacademy.nl/handboek.

Copyright (C) 2015 Drs. J.W.B. van de Putte Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.3 or any later version published by the Free Software Foundation; with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A copy of the license is available on http://www.gnu.org/licenses/fdl.html.

Inhoudsopgave 1. Verantwoording.................................................................. 9 2. Inleiding.........................................................................11 3. Hoe mensen lezen op het web.............................................. 13 3.1 Mensen lezen langzamer en onrustiger...............................................13 3.2 Mensen lezen in een F-vorm............................................................13 3.3 Mensen scrollen echt wel als het interessant is.....................................14 3.4 Eenvoudige teksten zijn goed voor iedereen........................................15 3.5 Zoekmachines zijn net mensen......................................................... 16

4. Principes van goed webschrijven...........................................17 4.1 Schrijf voor de taak van de bezoeker.................................................17 4.2 Maak je teksten kort......................................................................18 4.3 Zet de belangrijkste informatie bovenaan............................................20 4.4 Gebruik verzorgde spreektaal...........................................................21 4.5 Kies de woorden van de bezoekers....................................................23 4.6 Maak teksten scanbaar....................................................................24 4.7 Zorg voor zelfstandige webcontent....................................................25 4.8 Bespreek één onderwerp per pagina..................................................27 4.9 Link naar andere content................................................................27 4.10 In 10 stappen naar een goede structuur van je webtekst.......................28

5. Toegankelijkheid voor mensen met een functionele beperking.....29 5.1 Online toegankelijkheid is voldoen aan WCAG...................................... 29 5.2 Mensen met een beperking.............................................................. 29

Pagina 4

5.3 Browsen met een screenreader.........................................................30 5.4 Je website aanpassen..................................................................... 33 5.4.1 Zorg voor tekstalternatieven...........................................................33 5.4.2 Maak alles bereikbaar met het toetsenbord.........................................33 5.4.3 Maak de vormgeving toegankelijk.....................................................33 5.4.4 Gebruik eenvoudige taal................................................................34 5.5 Toegankelijkheid in perspectief........................................................34 5.5.1 Usability.................................................................................... 35 5.5.2 Findability.................................................................................35 5.5.3 En waar moeten we nu voor kiezen?...................................................36 5.6 Webtoegankelijkheid geborgd in richtlijnen.........................................37 5.6.1 Start van het internet...................................................................37 5.6.2 Start van het W3C........................................................................37 5.6.3 WCAG 1 en Webrichtlijnen 1............................................................ 37 5.6.4 WCAG 2.0...................................................................................37 5.6.5 Webrichtlijnen 2..........................................................................38

6. Content invoeren met een CMS............................................. 39 6.1 Vorm gescheiden van structuur......................................................... 39 6.2 De WYSIWYG-editor van het CMS.......................................................40 6.3 Wat de editor niet mogelijk moet maken............................................. 41 6.4 Wat de editor wel moet kunnen........................................................41 6.5 Tekst invoeren via de editor.............................................................41 6.6 Afbeeldingen positioneren............................................................... 42 6.7 Meer weten over de richtlijnen voor editors........................................42

7. Richtlijnen voor webredacties..............................................43 7.1 Indeling richtlijnen........................................................................43 7.2 Structuur.....................................................................................43 7.2.1 Zet de belangrijkste informatie bovenaan...........................................43 7.2.2 Geef iedere pagina een titel die de kern van het artikel samenvat.............44 7.2.3 Plaats onder de titel een lead (samenvatting)......................................46 Pagina 5

7.2.4 Kies één onderwerp per artikel........................................................48 7.2.5 Gebruik visuele ankerpunten...........................................................48 7.2.6 Gebruik korte en informatieve tussenkopjes........................................49 7.2.7 Gebruik opsommingen...................................................................51 7.2.8 Gebruik een pagina-index bij lange webpagina's....................................55 7.2.9 Zorg dat informatie lineair is...........................................................56 7.3 Betekenisvol opmaken.................................................................... 56 7.3.1 Gebruik kopopmaakprofielen voor koppen........................................... 57 7.3.2 Sla bij de kopregels geen niveaus over...............................................57 7.3.3 Gebruik een apart opmaakprofiel voor de opmaak van de samenvatting.......58 7.3.4 Gebruik vet om nadruk te leggen op woorden of zinsdelen.......................58 7.3.5 Gebruik een [Enter] om naar een nieuwe alinea te gaan..........................59 7.3.6 Gebruik bij opsommingen de opsommingsopties van de teksteditor............60 7.3.7 Vermijd quick & dirty-opmaak..........................................................62 7.4 Taal............................................................................................ 62 7.4.1 Schrijf taakgericht. Zorg voor relevantie............................................62 7.4.2 Houd het kort..............................................................................62 7.4.3 Gebruik verzorgde spreektaal..........................................................63 7.4.4 Kies de woorden die de bezoekers gebruiken........................................ 63 7.4.5 Beperk het gebruik van beeldspraak..................................................64 7.4.6 Geef aan als 2 of meer woorden in een andere taal zijn..........................64 7.4.7 Gebruik geen superscript of subscript................................................67 7.4.8 Gebruik MathML voor formules.........................................................67 7.4.9 Gebruik cijfers bij getallen bij specifieke informatie.............................68 7.4.10 Rangtelwoorden.........................................................................69 7.4.11 Gebruik afkortingen zo weinig mogelijk............................................69 7.4.12 Gebruik het blockquote-element voor zelfstandig geplaatste citaten.........70 7.5 Afbeeldingen................................................................................ 72 7.5.1 Soorten afbeeldingen....................................................................72 7.5.2 Geef elke betekenisvolle afbeelding een kort tekstueel alternatief............73 7.5.3 Gebruik geen alt-tekst bij niet-informatieve afbeeldingen.......................74 7.5.4 Plaats een langere beschrijving als dat nodig is.....................................75 7.5.5 Gebruik liever geen afbeeldingen van tekst.........................................77 7.6 Hyperlinks................................................................................... 79 7.6.1 Gebruik relevante inhoudswoorden in de linktekst.................................79 Pagina 6

7.6.2 Houd de linktekst kort................................................................... 81 7.6.3 Open geen nieuwe vensters of tabs....................................................81 7.6.4 Zorg dat hyperlinks duidelijk te herkennen zijn....................................82 7.6.5 Maak duidelijk als het een externe link is........................................... 82 7.6.6 Beschrijf bij een aanklikbare afbeelding het doel in de alt-tekst...............82 7.7 Downloads en e-mailadressen........................................................... 83 7.7.1 Gebruik downloads voor print of archivering........................................ 84 7.7.2 Zorg dat downloads toegankelijk zijn................................................. 84 7.7.3 Bied downloads ten minste ook in een open standaard aan.......................85 7.7.4 Open downloads in hetzelfde venster/tab...........................................85 7.7.5 Meld bij downloads het type bestand en de grootte............................... 86 7.7.6 Vermeld in e-maillinks het volledige e-mailadres.................................. 86 7.8 Tabellen...................................................................................... 86 7.8.1 Bij een 2-kolomstabel is extra opmaak niet nodig..................................87 7.8.2 Gebruik het th-element en scope-element voor rij- en kolomkoppen...........87 7.8.3 Gebruik afkortingen bij lange rij- en kolomlabels..................................89 7.8.4 Geef tabellen een titel..................................................................89 7.8.5 Geef complexe tabellen een beschrijving in de vorm van een summary........90 7.8.6 Vermijd het samenvoegen van rijen en kolommen..................................90 7.9 Video..........................................................................................90 7.10 Audio........................................................................................ 91

Bijlage 1: Belangrijke termen..................................................92 Bijlage 2 Infographic alternatieve tekst afbeelding.......................95

Pagina 7

1. Verantwoording Centraal in dit e-book staan de richtlijnen voor het toegankelijk invoeren en beheren van content. Met content bedoelen we teksten, afbeeldingen en multimedia zoals flashbanners, video en audio. De informatie in dit e-book is afkomstig van een aantal bronnen: • Webrichtlijnen, versie 2: http://versie2.webrichtlijnen.nl/norm/20101224 • WCAG 2.0: www.w3.org/TR/WCAG20 • www.webaim.org • www.nngroup.com, de website van de Nielsen Norman Group Wij hebben ook veel kennis vergaard vanuit de LinkedIn-groepen “Webrichtlijnen” en “Webredactie en de Webrichtlijnen”. Om toegankelijke content te kunnen bieden is meer nodig dan een goede webredactie. Voorwaarden voor toegankelijke content zijn een goede technische inrichting van de site en een goed CMS. Op deze aspecten gaan we in dit e-book niet verder in. Dit e-book wordt regelmatig bijgewerkt. Heb je een feedback? Stuur deze naar [email protected]. Jouw reactie is welkom. Het e-book is verschenen onder de zogenaamde GNU Free Doc License. Dat houdt onder andere in dat je het recht hebt het e-book te kopiëren, uit te printen en te verspreiden zonder dat je licentiekosten verschuldigd bent, mits je de auteur(s) vermeldt. Dit e-book is gratis te downloaden. Je kunt bij ons ook een geprinte versie bestellen. Deze leveren wij tegen onkostenvergoeding. Wij verzorgen ook cursussen, workshops en lezingen. Je kunt ons bereiken: • via de website: www.theinternetacademy.nl/contact • per mail: [email protected] Wij hopen dat dit e-book bijdraagt aan de webtoegankelijkheid in het algemeen en aan jouw bedrijfsvoering in het bijzonder. Pagina 8

2. Inleiding Dit e-book is ontstaan vanuit het perspectief van toegankelijkheid. Toegankelijk schrijven betekent het inrichten van je content, zodat ook mensen met een beperking er gebruik van kunnen maken. Waar we al snel achter kwamen is dat toegankelijk schrijven ook vindbaar schrijven is. En ook begrijpelijk schrijven. En daarmee ook gebruiksvriendelijk schrijven. Alle richtlijnen die in dit e-book staan zijn goed voor alle type bezoekers, zelfs de robots van Google. Je hoeft je schrijven niet aan te passen aan een blinde, of aan een zoekmachine (die ook blind is) of aan een hoogopgeleide doelgroep. De regels blijven hetzelfde. Het leveren van toegankelijke content wordt ook steeds meer de norm. Op verschillende manieren is toegankelijkheid in verschillende sectoren verplicht geworden: • Overheden Gemeenten, waterschappen, provincies en de rijksoverheid moeten zich aan de toegankelijkheidsrichtlijnen houden. • HBO-instellingen en universiteiten • Bij HBO-instellingen en universiteiten is digitale toegankelijkheid opgenomen in het accreditatiestelsel. • Banken en verzekeraars Banken en verzekeraars moeten van de Algemene Financiële Autoriteit hun informatie in eenvoudig Nederlands aanbieden. Veel organisaties zien de toegevoegde waarde van toegankelijke content. Toegankelijke content is vooral geoptimaliseerde content, die vindbaar is en sterk gericht is op de eisen die nu en in de nabije toekomst aan ons gesteld worden, zoals het gebruik op smart phones en tablets. Door informatie toegankelijk aan te bieden is de kwaliteit van de informatievoorziening ook beter. Centraal in dit e-book staan de richtlijnen die wij ontwikkeld hebben en die we de Webredactierichtlijnen noemen. Als je deze webredactierichtlijnen toepast voldoe je redactioneel volledig aan de nieuwe Webrichtlijnen, versie 2.

Pagina 9

Het e-book besteedt ook aandacht aan een aantal aspecten die belangrijk zijn voor ons begrip van het lezen op het web. Het eerstvolgende hoofdstuk gaat over hoe mensen nu eigenlijk lezen op het web (ze lezen niet, ze scannen ook niet, maar ze hoppen). Daarna bespreken we onze 5 algemene principes van goed schrijven. In de hoofdstukken daarna staan we eerst stil bij wat toegankelijkheid op het web eigenlijk betekent. In hoofdstuk 8 komen we uit de kern van dit e-book, de webredactierichtlijnen. Als je dit e-book gebruikt in een eigen training, dan kun je de volgende indeling aanhouden: • Hoofdstukken 3, 4 en 5 tot en met paragraaf 5.4 voor mensen voor wie het webschrijven niet hun hoofdactiviteit is, bijvoorbeeld decentrale webredacteuren. • Alle hoofdstukken voor mensen die dagelijks voor het web schrijven. Er zijn veel handige tools om zelf je content te testen. Dit was opgenomen in dit ebook, maar we hebben ze verplaatst naar een eigen e-book: het e-book Webtechniek.

Pagina 10

3. Hoe mensen lezen op het web 3.1 Mensen lezen langzamer en onrustiger Het lezen vanaf een beeldscherm is moeilijker dan het lezen vanaf papier. Niet alleen leest het langzamer - ongeveer 10 tot 30 % langzamer - maar het blijkt ook moeilijker om de concentratie en aandacht vast te houden. Mensen lezen onrustiger vanaf een beeldscherm. Het lezen van een internetpagina voegt nog een dimensie toe, want op een webpagina is ook vaak veel afleiding. Meer hierover kun je vinden in het artikel "Reading Online or on Paper: Which is Faster?" van Sri H. Kurniawan and Panayiotis Zaphiris. Deze kenmerken resulteren in een bepaald leesgedrag: • Mensen lezen vluchtiger en oppervlakkiger. • Mensen lezen niet een hele tekst, maar hoppen van ankerpunt naar ankerpunt door de tekst heen. Ankerpunten zijn bijvoorbeeld tussenkopjes, hyperlinks en opsommingen. • Mensen lezen globaal. Ze proberen aan de hand van trefwoorden in de tekst zo snel mogelijk te bepalen of de tekst relevant is voor hen.

3.2 Mensen lezen in een F-vorm Hoe mensen precies een pagina scannen is uitgebreid onderzocht via zogenaamd eye-tracking-onderzoek. Hierbij wordt gekeken naar de oogbewegingen bij het lezen. Uit dit onderzoek komt naar voren dat we webpagina’s vaak lezen in een Fvormig patroon (www.useit.com/alertbox/reading_pattern.html).

Pagina 11

Afbeelding 1: F-vormige patronen bij het lezen van een webpagina. Bron: Jakob Nielsen's Alertbox, F-Shaped Pattern For Reading Web Content Hieruit concluderen we het volgende: • De tekst bovenaan is het belangrijkst. • Het begindeel van een kop is belangrijk. Mensen lezen vaak alleen het linkerdeel.

3.3 Mensen scrollen echt wel als het interessant is Mag je zo schrijven dat mensen moeten scrollen om alles te kunnen lezen? Het antwoord is: ja, scrollen is niet erg. En, mensen bekijken websites bijvoorbeeld op iPad's en mobiele telefoons, dus is er weinig te zeggen over wanneer mensen moeten scrollen. Zorg dat het belangrijkste bovenaan staat. Als ze het interessant vinden lezen ze echt wel verder. Plaats dus bij voorkeur alle informatie over 1 onderwerp ook op 1 pagina. Dat heeft de volgende voordelen: • Mensen kunnen direct doorlezen en hoeven niet te klikken voor een nieuwe pagina. • Bij het printen of bij het opslaan staat ook alles in 1 printversie of in 1 bestand. • Zoekmachines indexeren die ene pagina sterker, want het hele onderwerp staat op één pagina.

Pagina 12

3.4 Eenvoudige teksten zijn goed voor iedereen Jakob Nielsen heeft onderzocht wat de verbetering is in het lezen van een tekst wanneer deze vereenvoudigd is (zie www.useit.com/alertbox/20050314.html). Interessant in zijn onderzoek is dat hij dit onderzoek gedaan heeft bij laaggeletterden én hooggeletterden. De algemene gedachte is vaak dat het vereenvoudigen van taal niet nodig is voor hooggeletterden, sterker nog, schertsend wordt het soms afgedaan als jip-en-janneketaal, die alleen maar leidt tot irritatie. De resultaten van het onderzoek van Nielsen staan in onderstaande tabel. Succesvolle afronding taak ('Succes Rate') Originele webpagina

Herschreven webpagina

Laaggeletterden

46 %

82 %

Hooggeletterden

68 %

93 %

Originele webpagina

Herschreven webpagina

Tijdsbesteding taak ('Total Task Time') Laaggeletterden

22,3 minuten

9,5 minuten

Hooggeletterden

14,3 minuten

5,1 minuten

Tevredenheid* ('Satisfaction'), schaal: 1-5 schaal, 5 hoogste score Originele webpagina

Herschreven webpagina

Laaggeletterden

3,5

4,4

Hooggeletterden

3,7

4,8

Tabel 1: Resultaten onderzoek laaggeletterdheid, bron: Jakob Nielsen

De conclusies zijn: • Een vereenvoudigde tekst wordt beter begrepen (success rate ofwel effectiviteit) • Een vereenvoudigde tekst wordt sneller gelezen (total task time ofwel efficiëntie). • Het vereenvoudigen van taal leidt tot een beter begrip van de tekst (satisfaction). • Genoemde verbeteringen gelden voor laaggeletterden én hooggeletterden. Pagina 13

Met andere woorden: het vereenvoudigen van teksten is goed voor iedereen.

3.5 Zoekmachines zijn net mensen Er zijn nogal eens discussies tussen redacties en marketeers over voor wie de teksten nu geschreven worden: voor mensen of voor de zoekmachines. Een feit is dat zoekmachines enorm belangrijk zijn voor een site. Een misvatting is het echter om te denken dat teksten voor mensen en zoekmachines verschillen (zie Zie het www.2useit.nl/uu/schrijven-voor-mensen-en-voor-zoekmachines.php . De wijze waarop zoekmachines teksten indexeren is in de loop van de jaren ook enorm veranderd en verbeterd. Een deel van het misverstand is daar wellicht op gebaseerd, namelijk omdat mensen zich baseren op de technieken van enkele jaren geleden. Zoekmachines gebruiken wiskundige algoritmes om teksten te indexeren. Deze algoritmes worden voortdurend aangepast. Daarbij streven ze ernaar om de teksten te indexeren zoals "mensen" ze waarderen (zie www.google.com/support/webmasters/bin/answer.py? hl=nl&topic=15260&answer=35769#1). Het heeft dus geen zin om een tekst vol te stoppen met trefwoorden enkel met als doel een betere indexatie. Dat kan zelfs contra-productief werken, omdat Google dit kan beoordelen als “over-optimalisatie” en daarmee een lagere indexering kan toekennen. Wel zinvol is het om te zoeken naar de woorden die geassocieerd worden met het onderwerp van de tekst. Dat is zinvol, omdat zoekmachines ook gebruik maken van LSI (zie hierboven in een van de vorige paragrafen). Zo zijn er meer parallellen tussen het schrijven voor mensen en voor zoekmachines. Ergo: het maakt niet uit voor wie je schrijft. Goed schrijven kent dezelfde spelregels voor mensen én voor zoekmachines.

Pagina 14

4. Principes van goed webschrijven Goed schrijven is volgens ons meer dan toegankelijk schrijven. Het gaat om content voor het web die begrijpelijk en prettig is voor iedereen. En daarnaast ook optimaal geschikt is voor zoekmachines. We bespreken hier een aantal basisprincipes van goed schrijven voor het web: • Schrijf voor de taak van de bezoeker • Maak je teksten kort • Zet de belangrijkste informatie bovenaan • Gebruik verzorgde spreektaal • Kies de woorden van de bezoekers • Maak teksten scanbaar • Zorg voor zelfstandige webcontent • Link naar andere content • Bespreek één onderwerp per pagina

4.1 Schrijf voor de taak van de bezoeker Mensen komen niet voor informatie op jouw site, maar omdat ze iets willen doen. Ze hebben een taak, bijvoorbeeld achterhalen wanneer het huisvuil wordt opgehaald. Dat betekent dat de informatie die je op de site plaatst in de eerste plaats relevant moet zijn voor de taak die de bezoeker met de site heeft. Stel vast met welke taak jouw bezoeker op jouw site komt en richt je tekst in op zijn vragen. (Meer weten over taakgericht schrijven? Zie The Stranger's Long Neck van Gerry McGovern.) Mensen zoeken niet naar informatie (“Informatie over paspoorten”), maar hebben een taak waarvoor ze op de site zijn (“Paspoort aanvragen”). Zorg dat in ieder geval in de titel en de samenvatting antwoord wordt gegeven op de vraag van de bezoeker. Wanneer je schrijft voor de taak van de bezoeker is de content relevant voor de bezoeker. Relevante content is wellicht het belangrijkste waar je op moet letten bij het beheren van de content van een site. En informatie is relevant als het aansluit op de taak van de bezoeker.

Pagina 15

Hoe vind je nu de taken van de bezoeker? Gerry McGovern geeft in zijn boek “The Stranger's Long Neck” aan dat elke website slechts 3 tot 5 toptaken heeft. Veel sites hebben hun site onvoldoende ingericht op de toptaken. Gevolgen zijn volgens McGovern: • Menu's en links zijn verwarrend. • Zoekresultaten zijn slecht. • Informatie is verouderd. Het is daarom goed om informatie die niet behoort tot de taken van de bezoeker te verwijderen. Deze informatie staat de andere informatie in de weg in menu's en zoekresultaten. Vaak lukt het niet om deze informatie goed te onderhouden, waardoor er verouderde en soms onjuiste informatie op de website staat. Een idee van de taken die wel belangrijk zijn kun je vinden door dit na te vragen in jouw eigen organisatie. Medewerkers die klantcontact hebben weten vrij goed wat belangrijke items voor bezoekers zijn. Check vervolgens in de site of die informatie eenvoudig te vinden is. In veel gevallen zul je merken dat daar nog het nodige te verbeteren is.

4.2 Maak je teksten kort Als je schrijft voor de taak van de bezoeker, geef je alleen die informatie die echt nodig is voor de taak. In feite doet alle extra tekst afbreuk aan de taakgerichtheid van je tekst. Een site die dit heel goed heeft opgepakt is www.gov.uk: alle teksten zijn gericht op de toptaken, andere teksten zijn verwijderd. Ook zie je op de site dat ze alle concurrende informatie op een webpagina hebben weggehaald. Dus alleen in de rechterkolom informatie die echt gerelateerd is aan de taak. Verder hebben ze meestal geen menu. En vooral gewoon weinig tekst. Zie als voorbeeld het screenshot hieronder.

Pagina 16

Afbeelding 2: www.gov.uk (jan 2014) Kort betekent: • korte artikelen • korte zinnen

Pagina 17

Een pagina hoeft niet per se kort te zijn. Als de informatie nodig is, plaats het liever wel op 1 pagina. Scrollen is niet erg, maar het moet voor de bezoeker wel zinvol zijn.

4.3 Zet de belangrijkste informatie bovenaan Omdat mensen op een webpagina vluchtig lezen is het belangrijk dat de boodschap zo snel mogelijk duidelijk wordt. Dat kan door de belangrijkste informatie bovenaan te zetten, onder andere door een beschrijvende titel en een goede samenvatting bovenaan. Dit principe is bekend vanuit het schrijven van persberichten en ook hoe kranten geschreven zijn. Kranten weten dat mensen “koppensnellen”. Lezers willen door de voorpagina van de krant te scannen direct weten wat er speelt in de wereld. Voor het web is dat niet anders. Deze manier van schrijven wordt de omgekeerde piramidevorm genoemd (zie afbeelding hieronder). Dit houdt in: • De belangrijkste boodschap staat bovenaan. • Na de kernboodschap komt ook belangrijke informatie, maar die is een uitbreiding van de inhoud die bovenaan staat. Als men geïnteresseerd is kan men de details hier lezen. • De lezer kan op elk moment stoppen met lezen en heeft op elk moment de boodschap begrepen.

Pagina 18

Afbeelding 3: Schrijven volgens de omgekeerde piramide

4.4 Gebruik verzorgde spreektaal Eenvoudig taalgebruik is goed voor iedereen. In hoofdstuk 3 hebben we laten zien dat een vereenvoudigde tekst beter is voor laaggeletterden én hooggeletterden. Eenvoudig Nederlands is vergelijkbaar met verzorgde spreektaal. Dus de taal die we gebruiken bij het spreken is in grote lijnen ook de taal die we kunnen gebruiken bij het schrijven. Maar wat is nu een eenvoudige tekst? Een manier om de complexiteit in te schatten is door gebruik te maken van het Europees Referentiekader. Het Europees Referentiekader kent 6 niveaus van taalgebruik. Voor het lezen zijn dat deze niveaus:

Pagina 19

A1 Ik kan vertrouwde namen, woorden en zeer eenvoudige zinnen begrijpen, bijvoorbeeld in mededelingen, op posters en in catalogi. A2 Ik kan zeer korte, eenvoudige teksten lezen. Ik kan specifieke voorspelbare informatie vinden in eenvoudige, alledaagse teksten zoals advertenties, folders, menu's en dienstregelingen en ik kan korte, eenvoudige, persoonlijke brieven begrijpen. B1 Ik kan teksten begrijpen die hoofdzakelijk bestaan uit hoogfrequente, alledaagse of aan mijn werk gerelateerde taal. Ik kan de beschrijving van gebeurtenissen, gevoelens en wensen in persoonlijke brieven begrijpen. B2 Ik kan artikelen en verslagen lezen die betrekking hebben op eigentijdse problemen, waarbij de schrijvers een bepaalde houding of standpunt innemen. Ik kan eigentijds literair proza begrijpen. C1 Ik kan lange en complexe feitelijke en literaire teksten begrijpen, en het gebruik van verschillende stijlen waarderen. Ik kan gespecialiseerde artikelen en lange technische instructies begrijpen, zelfs wanneer deze geen betrekking hebben op mijn terrein. C2 Ik kan moeiteloos vrijwel alle vormen van de geschreven taal lezen, inclusief abstracte, structureel of linguïstisch complexe teksten, zoals handleidingen, specialistische artikelen en literaire werken. Tabel 2: Europees Referentiekader, onderdeel lezen Eenvoudig Nederlands is taalniveau B1 (Bron: Kees ter Beek, Toegankelijke teksten op toeslagen.nl?). Dit taalniveau is voor 80 % van de Nederlanders begrijpelijk. Ook mensen met weinig scholing begrijpen taal op dit niveau. Teksten blijken echter vaak op een hoger niveau aangeboden te worden: het aanbodniveau is meestal C1, twee niveaus hoger dan het optimale niveau. Op www.accessibility.nl/kennisbank/tools/leesniveau-tool is een toets die een indicatie geeft van het taalniveau van een tekst. De tool kijkt naar woordlengte, zinslengte en woordfrequentie. Zoals bij de tool zelf ook is te lezen, geeft de tool niet meer dan een globaal idee van de technische leesbaarheid van de site. Want er zijn meer punten die van belang zijn voor de leesbaarheid, zoals de taakgerichtheid, de structuur en de schrijfstijl van een tekst. De tool is vooral illustratief en vanuit die optiek vaak een "eye-opener" bij het bespreken van een tekst.

Pagina 20

4.5 Kies de woorden van de bezoekers Mensen scannen vluchtig of een tekst aansluit op wat zij zoeken. Bewust en onbewust blijft hun blik hangen bij woorden die ze bewust en onbewust associëren met het onderwerp dat zij zoeken. Een onderwerp is voor iemand nooit beperkt tot één woord. Mensen hebben een wolk van woorden die geassocieerd zijn met een bepaald onderwerp. Neem bijvoorbeeld iemand die informatie zoekt over slapeloosheid. Dit onderwerp is niet afgegrensd tot het woord slapeloosheid, maar hij zal tal van woorden associëren: slapen, bed, spanning, nacht, koffie, enzovoort. Deze manier van associëren wordt Latent Semantic Indexing (LSI) genoemd. LSI is voor het eerst in de jaren 50 en 60 in de neurolinguïstiek als verschijnsel beschreven. "Latent" refereert aan het feit dat deze associaties vaak onbewust aanwezig zijn, "semantic" betekent dat het om inhoudelijke gerelateerde woorden gaat. Wat is nu het belang van LSI voor jou als schrijver? We weten dat mensen vluchtig een webpagina beoordelen op relevantie. Bij deze beoordeling gebruiken ze LSI. Ze kijken dus niet alleen naar 1 of 2 specifieke trefwoorden, maar hebben een wolk van geassocieerde woorden waarmee ze zoeken naar de relevantie van de tekst. Het is daarmee van belang om niet alleen enkele specifieke trefwoorden te gebruiken, maar juist ook de woorden te gebruiken waarmee mensen het onderwerp zullen associëren. En dat zijn vaak alledaagse woorden. En geen ambtelijke woorden of organisatie-eigenwoorden.

Pagina 21

Afbeelding 4: Iemand zoekt naar “twitter” ...

Afbeelding 5: ... en associeert dit bewust en onbewust met heel veel andere woorden.

Een voorbeeld. Wij zochten op een gemeentesite naar de tijden waarop vuilnis werd opgehaald. Via de zoekfunctie zochten we op vuilnis, maar vonden niets. Uiteindelijk blijkt dat het afval heet. Door in de tekst bij het vuilnis ook het woord afval te gebruiken zal dit meer herkenning oproepen bij de bezoeker. En het wordt beter gevonden in zoekmachines.

4.6 Maak teksten scanbaar Vaak wordt geschreven dat mensen op het web een tekst scannen, maar wij noemen dat liever hoppen. Scannen suggereert toch een snelle, maar lineaire actie, terwijl een lezer in feite met schokjes door een tekst gaat. Het lezen is sterk reactief: lezers reageren steeds op bepaalde wijzigingen in de lay-out van de tekst. De punten waar de lezer stopt met scannen en start met lezen zijn de visuele ankerpunten. De lezer hopt van ankerpunt naar ankerpunt. Ankerpunten zijn: • titel • eerste alinea bovenste alinea('s) • subkopjes • opsommingen Pagina 22

• •

hyperlinkteksten afbeeldingen

Aangezien mensen bij het scannen zoeken naar relevante trefwoorden (LSI) is het van belang dat de ankerpunten relevante trefwoorden bevatten. Een hyperlinktekst met "klik hier" is om die reden niet geschikt, beter is met inhoudswoorden te verwijzen naar het onderwerp, bijvoorbeeld "medicijnen tegen slapeloosheid". Metaforen in subkopjes zijn bijvoorbeeld ook niet geschikt. Hoe creatief deze wellicht zijn vanuit schrijversperspectief, al scannend slaat de lezer ze snel over.

4.7 Zorg voor zelfstandige webcontent Een groot verschil tussen een krant en een website is dat de content op een website op allerlei manieren getoond wordt. In een krant niet: het papier ziet er bij iedereen hetzelfde uit. Als er een titel staat met een grote foto erbij is voor iedereen die layout hetzelfde. Anders is het met webcontent. Een artikel wordt als microcontent op andere plekken ook weer gepubliceerd, bijvoorbeeld (zie afbeelding hieronder): • als titel en samenvatting • als losse titel bij een nieuwsblok • als RSS-feed • als titel met een foto

Pagina 23

Afbeelding 6: Voorbeelden van microcontent op De Telegraaf.nl Een titel van een bericht moet daarom begrijpelijk zijn zonder verdere context. Hetzelfde geldt voor een samenvatting of voor een paragraaf. Zelfs tot op zeker hoogte voor een alinea. Dit bedoelen we met het principe van zelfstandige content. Een groot voordeel van het schrijven in zelfstandige eenheden is dat de teksten goed herbruikbaar zijn (www.useit.com/alertbox/writing-reuse.html). Zo kan een tekst op meerdere plekken in de site gebruikt worden. Voor nieuwsachtige berichten speelt dit nog meer. Deze berichten kunnen bijvoorbeeld ook als RSS verspreid worden. Teksten worden zo geschreven dat ze herbruikbaar zijn. Moderne Content Management Systemen sluiten daar ook bij aan door informatie niet in pagina's op te slaan, maar in andere eenheden, die op meerdere plekken in de website en eventueel in andere websites bruikbaar zijn (bijvoorbeeld als RSS).

4.8 Bespreek één onderwerp per pagina Mensen bepalen al scannend of een webpagina interessant is. Die beslissing wordt vaak al genomen op basis van de titel. Het is moeilijk om in één titel twee Pagina 24

onderwerpen te benoemen. Het is ook moeilijk om de samenvatting zo te schrijven dat er twee onderwerpen duidelijk naar voren komen. Door toch twee onderwerpen in één artikel op te nemen is de kans groot dat de lezer één van de twee onderwerpen niet opmerkt. Ook voor Google is het beter om één onderwerp op één pagina te plaatsen. Het advies is daarom: bespreek slechts één onderwerp per pagina. Een site die dit toepast is de Wikipedia. Elke uitweiding naar een ander onderwerp wordt elders neergezet en via een link wordt daarnaar verwezen.

4.9 Link naar andere content Het web is ooit gemaakt door Tim Berners-Lee door 2 systemen aan elkaar te knopen: • het internet • systeem van hyperlinking Sommige websites vergeten deze 2e component van online, namelijk het via links verbinden van je content aan andere of je eigen content. Vooral bij grote sites van gemeenten of van uitgevers (de ouderwetse e-book die online gegaan zijn) zie je dat hyperlinks in de tekst vaak ontbreken. Het wel gebruiken van links naar andere content heeft veel voordelen: • De gebruiker help je zo om verder te komen bij de content die hij zoekt. • Je hoeft informatie niet dubbel op te nemen, je linkt gewoon naar de pagina waar het staat. • Zoekmachines waarderen het als je linkt naar andere sites. Je laat immers daarmee zien dat je midden in de wereld van het web staat! Verderop in dit e-book leggen we nog uit je goede links schrijft, maar in het kort al even het belangrijkste: • Plaats de link op betekenisvolle woorden. • Hou de link kort

4.10 In 10 stappen naar een goede structuur van je webtekst Hieronder hebben wij in 10 punten opgesomd hoe je komt tot een goede structuur van je webtekst. De punten zijn ook handig als checklist.

Pagina 25

•

Het artikel

1. Bepaal het onderwerp. Kies per artikel één onderwerp. 2. Zorg voor zelfstandige, herbruikbare tekstblokken. 3. Bouw het artikel op met een titel, een lead en een body, tenzij het artikel daar te kort voor is. In dat geval kunnen de lead en de body worden samengevoegd tot 1 of enkele alinea's. •

De titel

4. Maak de titel kort en duidelijk. Vat het artikel samen in de titel. Ook zonder lead of afbeelding moet de titel duidelijk zijn. 5. Gebruik relevante inhoudswoorden. De belangrijkste woorden staan aan het begin. •

De lead

6. Maak een samenvatting van het artikel. Deze samenvatting vormt de lead. De lead is geen introductie, zoals je vaak ziet in (lange) gedrukte teksten. 7. Zorg dat de essentie van de lead in de eerste 150 tekens staat. De lead zelf mag langer zijn. •

De body

8. Bouw de body op uit kleinere onderdelen, bijvoorbeeld alinea's en paragrafen. Elk onderdeel gaat over 1 subonderwerp. 9. Zorg voor ankerpunten die snel scannen faciliteren. De ankerpunten zijn tussenkopjes, opsommingen en hyperlinkteksten. 10. Kies relevante inhoudswoorden in de ankerpunten. Plaats de belangrijkste informatiewoorden aan het begin (“front-loaded”). En misschien nog een 11e stap: hou het kort. Schrap woorden en zinnen die niet nodig zijn. Wij zien regelmatig teksten die tot een kwart gereduceerd kunnen worden.

Pagina 26

5. Toegankelijkheid voor mensen met een functionele beperking Toegankelijkheid van websites gaat over de toegankelijkheid van het web voor mensen met een beperking. Dat is dus een heel specifieke betekenis. Toegankelijkheid richt zich op inclusie, namelijk dat iedereen de kans moet krijgen om volwaardig deel te nemen aan onze maatschappij.

5.1 Online toegankelijkheid is voldoen aan WCAG Online toegankelijkheid is vastgelegd in internationale richtlijnen, de Web Content Accessibility Guidelines. Als je zegt dat je website toegankelijk is, dan geef je daarmee min of meer aan dat de website voldoet aan deze richtlijnen.

5.2 Mensen met een beperking Mensen met een beperking hebben minder mogelijkheden ten aanzien van gedrag of activiteiten [1]. Het aantal mensen met een beperking varieert van 1 tot 4 miljoen in Nederland, afhankelijk van de definitie. Het gaat bijvoorbeeld om: • blinden en slechtzienden • kleurenblinden • doven en slechthorenden • mensen met een motorische beperking • laaggeletterden • dyslectici • mensen met problemen in het verwerken van informatie, zoals mensen met niet-aangeboren hersenletsel, ADHD-ers en autisten • ouderen met vaak meerdere (kleinere) beperkingen • mensen met hippopotomonstrosesquippedaliofobie (angst voor lange woorden) Hoe groot deze groep is, is voer voor statistieken. In ieder geval is het een grote groep en is het voor grotere organisaties moeilijk vol te houden dat ze deze mensen niet in hun doelgroep hebben. Voor deze mensen is het belangrijk dat websites voldoen aan enkele eisen, zodat zij die websites ook kunnen gebruiken. 1

http://mens-en-samenleving.infonu.nl/pedagogiek/84742-het-verschil-tusseneen-stoornis-beperking-en-een-handicap.html Pagina 27

Een bijzondere groep vormen mensen met een verstandelijke beperking. Deze beperking stelt zoveel extra eisen aan een website dat het aanpassen van een algemene site niet toereikend is. Als een site zich richt op deze doelgroep is het nodig om daar een aparte vorm en inhoud – en dus een aparte website - voor te kiezen.

5.3 Browsen met een screenreader Blinden en ernstig slechtzienden kunnen geen beeldscherm gebruiken. Zij hebben dus iets anders nodig om de informatie van een webpagina te krijgen. Zij gebruiken

Afbeelding 7: Blinde man met brailleleesregel daarvoor een schermleesprogramma of screenreader, zoals Jaws of Supernova. Met een screenreader wordt de tekst van een website uitgevoerd als spraak. Aan een screenreader kan een brailleleesregel (zie afbeelding hierboven) worden gekoppeld, waarmee de spraak wordt uitgevoerd als braille. Het lezen van braille is complex. Veel blinden, zeker degenen die op latere leeftijd blind geworden zijn, beheersen geen braille en zijn aangewezen op de iets langzamere en soms minder handige spraakuitvoer.

Pagina 28

Spraakuitvoer wordt door veel meer mensen gebruikt. Behalve door blinden en slechtzienden wordt het bijvoorbeeld ook gebruikt door dyslectici. Een groot nadeel van spraak- en braille-uitvoer is dat de gebruiker het overzicht mist. Wanneer je een pagina kunt zien. zie je ook wat belangrijk is. Je ziet waar het menu staat, waar de (primaire) content staat, waar het nieuwsblok staat en waar de zoekfunctie te vinden is. Blinden missen dat overzicht. Om toch overzicht te krijgen kunnen ze direct bepaalde informatie opvragen: • koppenlijst (heading list, zie afbeelding hieronder): een lijst met alle kopregels, dus de h1, h2 enzovoort • linklijst (link list, zie afbeelding hieronder): een lijst met alle hyperlinkteksten Wanneer de headings goed zijn toegepast krijgt iemand met spraak-/braille-uitvoer snel een goed beeld van de inhoud van de pagina. Uiteraard is het dan ook belangrijk dat de teksten betekenisvol zijn (dus bijvoorbeeld niet "Wat heeft u er aan?", maar "Helderder beeld door LED-technologie"). Met een link lijst krijgt iemand snel overzicht van de inhoud, met name als iemand nog verder wil zoeken. Ook hierbij is het nodig dat de linkteksten betekenisvol zijn: 10 keer "klik hier" helpt dan niet, wel een tekst als "specificaties beamer 123".

Pagina 29

Afbeelding 8: Voorbeeld koppenlijst (headings list) (software JAWS)

Pagina 30

Afbeelding 9: Voorbeeld linklijst (link list) (software JAWS)

5.4 Je website aanpassen Om het mogelijk te maken dat mensen met een beperking je website goed kunnen gebruiken moet de website daar op aangepast zijn. In grote lijnen zijn de belangrijkste aanpassingen: • Zorg dat afbeeldingen en andere niet-tekstuele content die betekenis overbrengen een tekstalternatief hebben. • Maak alles bereikbaar met het toetsenbord. • Zorg dat de vormgeving geschikt is, bijvoorbeeld voldoende contrast • Zorg voor eenvoudige taal 5.4.1 Zorg voor tekstalternatieven Als je plaatjes gebruikt om betekenis over te brengen, dan moet je deze afbeeldingen een alternatieve tekst geven. Alleen dan worden de plaatjes ook begrepen door iemand die werkt met een screenreader. Nog een voordeel: zoekmachines zoals Google hebben dan ook de informatie. Wij leggen dit uit in paragraaf 7.5 (Afbeeldingen).

Pagina 31

5.4.2 Maak alles bereikbaar met het toetsenbord Probeer eens je website te gebruiken zonder muis: kun je overal bij? Kun je bijvoorbeeld het menu openklappen? En kun je een video starten, stoppen en ook daarna weer verder browsen in je website? Het toegankelijk zijn van je website met een toetsenbord is een van de belangrijkste eisen voor een toegankelijke website. En dus makkelijk zelf te testen! 5.4.3 Maak de vormgeving toegankelijk Voor toegankelijkheid gelden ook een aantal eisen in de vormgeving van de website: • Zorg voor voldoende contrast tussen tekst en achtergrond. Als minimale norm geldt een contrastratio van 4,5:1 tussen tekst en achtergrond. Ook in afbeeldingen is het belangrijk dat er voldoende contrast is. Meer hierover kun je vinden hoofdstuk 8, Zelf toetsen van je content. • Breng geen betekenis over met kleur alleen. Denk bijvoorbeeld aan mensen met kleurenblindheid. • Sommige mensen hebben ook baat bij een rustige webpagina. Voor laaggeletterden is het prettig als de lay-out rustig is, want het lezen zelf is al inspannend genoeg. Ook mensen met een autistisch spectrum stoornis (ass) of mensen met ADHD hebben baat bij een rustige lay-out. • Verduidelijk de informatie op je website met icoontjes en andere afbeeldingen. 5.4.4 Gebruik eenvoudige taal De Stichting Lezen en Schrijven schat het aantal laaggeletterden op 1,5 miljoen mensen. Daarbij is de grens een taalvaardigheid gelijk aan groep 8 van de basisschool. Het vereenvoudigen van taal is dus belangrijk voor een grote groep. Zoals in het voorgaande hoofdstuk is uitgelegd is het vereenvoudigen van taal goed voor elke lezer, dus het aanpassen van de taal is sowieso zinvol. Ondanks video, afbeeldingen en animaties is veel informatie nog gewoon tekst. Een beperking in het beheersen van de Nederlandse taal is een grote belemmering in het goed kunnen gebruiken van websites. Een beperking in de taal kan komen doordat Nederlands niet je moedertaal is, maar er zijn ook veel autochtone Nederlanders die laaggeletterd zijn. Verder zijn er nog meer taalbeperkingen, zoals dyslexie en afasie, een taalstoornis na hersenletsel. Pagina 32

Ook de ouderen vallen onder deze categorie: zij hebben minder goede ogen, een minder goede handfunctie en een tragere verwerkingssnelheid.

5.5 Toegankelijkheid in perspectief Zodra het gesprek over toegankelijkheid gaat verzuchten sommige websiteeigenaren dat er wel meer is dat belangrijk is voor hun site. En ze hebben helemaal gelijk. Naast toegankelijkheid zijn er nog 2 aspecten belangrijk voor websites (zie afbeelding hieronder), namelijk: • usability: ofwel de gebruiksvriendelijk en bruikbaarheid van een site • findability: de vindbaarheid van de site in zoekmachines

Afbeelding 10: Driehoek usability, findability en accessibility 5.5.1 Usability Usability is niet met één Nederlands woord te vertalen. Het is het beste te vertalen met gebruiksvriendelijkheid en bruikbaarheid. Usability is een vaag begrip, net zo vaag als bijvoorbeeld kwaliteit. De International Standards Organization definieert usability als volgt [2]: 2

ISO DIS 9241-11, Guidance on usability Pagina 33

Usability is de mate waarin een product door bepaalde gebruikers in een bepaalde gebruikersomgeving kan worden gebruikt om bepaalde doelen effectief, efficiënt en naar tevredenheid te bereiken. In grote lijnen gaat het er om dat een site doet wat hij moet doen. Dat de site efficiënt en effectief antwoord geeft op de vraag van de bezoeker. En dat de bezoeker daarna tevreden is. 5.5.2 Findability Waar het bij usability om mensen gaat, gaat het bij findability om de niet-menselijke bezoekers van een site, namelijk zoekmachines. Zoekmachines – in Nederland vooral Google – zijn niet meer weg te denken van het internet en genereren bij vrijwel elke site veel bezoek. Bij veel sites zorgen de zoekmachines voor 50 % of meer van alle bezoek. Naast externe zoekmachines gaat het ook over interne zoekmachines, zoals SOLR. Globaal hanteren die dezelfde zoekalgoritmen. 5.5.3 En waar moeten we nu voor kiezen? Zowel usability, accessibility als findability stelt elk zijn eisen aan een website. Waar moeten we nu voor kiezen? Voor veel mensen zal usability het belangrijkst zijn, immers iedereen wil graag dat de gewone bezoeker de website gebruikt en waardeert. Anderen zullen ook de findability bijzonder belangrijk vinden, want veel sites “leven” van het verkeer dat de zoekmachines hun brengen. Het goede nieuws is dat de 3 sets van richtlijnen niet strijdig met elkaar zijn. Een betere toegankelijkheid draagt ook bij aan een betere usability en aan een goede findability. Een voorbeeld: een plaatje heeft een alternatieve tekst. Bijdrage aan accessibility? Als iemand het plaatje niet kan zien, krijgt hij toch de informatie die het plaatje overbrengt. Bijdrage aan usability? Als de plaatjes niet worden getoond – bijvoorbeeld omdat iemand mobiel browst en plaatjes heeft uitstaan - dan krijgt hij toch de informatie over de afbeelding.

Pagina 34

Bijdrage aan findability? De alternatieve tekst voegt relevante informatie toe aan de tekst. Dit draagt bij aan een betere vindbaarheid van de pagina.

Pagina 35

5.6 Webtoegankelijkheid geborgd in richtlijnen 5.6.1 Start van het internet Als startpunt van toegankelijkheid nemen we het ontstaan van het World Wide Web in 1989. In dat jaar maakt Tim Berners-Lee de eerste webpagina door het systeem van hyperlinking te combineren met het internet. (Wil je hier meer over lezen, lees dan Weaving the Web van BernersLee.) De kracht van zijn uitvinding is dat de informatie op het web bereikbaar (toegankelijk) is op elke computer, ongeacht de gebruikte hardware en software. Hij beschrijft Afbeelding 11: dit als volgt: Tim Berners-Lee “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.” 5.6.2 Start van het W3C In 1994 wordt het W3C (www.w3.org) opgericht om standaardisatie binnen het internet tot stand te brengen. Directeur van het W3C wordt Tim Berners-Lee. Het W3C is een samenwerkingsverband van verschillende organisaties en individuen. 5.6.3 WCAG 1 en Webrichtlijnen 1 In 1999 publiceert het W3C de Web Content Accessibility Guidelines (WCAG). Doel van WCAG is het waarborgen van de toegankelijkheid van internetsites voor mensen met een functiebeperking. WCAG 1.0 bestaat uit 14 richtlijnen, met elk 3 toetsingsniveaus. Nederland voegt enkele aanvullende kwaliteitscriteria toe aan WCAG en komt zo tot de Webrichtlijnen. 5.6.4 WCAG 2.0 Het W3C publiceert in december 2008 WCAG 2.0. WCAG 2.0 volgt na 9 jaar WCAG 1.0 op. WCAG 2.0 is gelaagd gebouwd met principes, richtlijnen, succescriteria en technieken. Bovenaan staan de 4 principes, afgekort met het acroniem POUR: • Perceivable (waarneembaar): informatie en componenten van de gebruikersinterface moeten waarneembaar zijn. Pagina 36

•

•

•

Operable (bedienbaar): componenten van de gebruikersinterface en navigatie moeten bedienbaar zijn. Understandable (begrijpelijk): informatie en de bediening van de gebruikersinterface moeten begrijpelijk zijn. Robust (robuust): content moet voldoende robuust zijn om betrouwbaar geïnterpreteerd te kunnen worden door een breed scala van user agents, met inbegrip van hulptechnologieën.

Elk principe kent een aantal richtlijnen, in totaal 12. Vervolgens heeft elk principe weer een aantal succescriteria. Deze succescriteria zijn uiteindelijk de criteria waarop de toegankelijkheid getoetst wordt. Een succescriterium hoort bij een bepaald niveau van conformiteit: level A, level AA en level AAA. Level A is de minimale toegankelijkheid. 5.6.5 Webrichtlijnen 2 In het najaar van 2010 zijn de nieuwe Webrichtlijnen opgesteld. Daarin zijn de WCAG 2.0-richtlijnen integraal opgenomen. En er is nog een principe toegevoegd: • Universeel: Creëer content die betekenisvol, voor iedereen bruikbaar, uitwisselbaar en duurzaam is. Voor overheden geldt de verplichting voor niveau AA.

Pagina 37

6. Content invoeren met een CMS Het invoeren van webcontent gaat in vrijwel alle gevallen met een Content Management Systeem (CMS). Bij het verkeerd invoeren ontstaan vaak toegankelijkheidsproblemen. Het is daarom belangrijk dat dit goed gebeurt. Hiervoor heb je een professionele webredactie nodig die ook kennis heeft van HTML. Het is ook van belang dat het CMS het maken van goede content faciliteert. Dit kan doordat het CMS bepaalde invoer en opmaak juist wel of niet mogelijk maakt.

6.1 Vorm gescheiden van structuur Een belangrijk uitgangspunt van de Webrichtlijnen is dat de opmaak en de structuur van teksten gescheiden is. De scheiding kan verkregen worden door alle opmaak van teksten in aparte bestanden te plaatsen, de zogenaamde Cascading Style Sheets. Een webpagina is geschreven in de opmaaktaal HTML. HTML geeft structuur aan de inhoud van de tekst. Een titel boven een tekst heeft bijvoorbeeld een bepaalde HTML-opmaak:

Dit is de titel.

De opmaak van deze titel wordt gedefinieerd in een zogenaamde stylesheet of voluit: de Cascading Style Sheet, afgekort tot CSS. In de CSS kunnen we bijvoorbeeld aangeven dat het opmaakprofiel h1 groot en vet moet zijn (zie het voorbeeld hieronder). In de browser worden het HTML-bestand en het CSS-bestand samengevoegd tot een webpagina.

Pagina 38

Afbeelding 12: HTML en CSS Het idee om structuur en opmaak te scheiden is logisch: zo staat alle informatie over structuur in de HTML en alle informatie over vormgeving in de CSS. De CSS van een website is enigszins te vergelijken met de opmaakprofielen in een tekstverwerker. Ook daar kun je instellen dat teksten standaard een bepaalde opmaak krijgen. Wanneer een website wordt gebouwd bespreekt de webbouwer samen met de webeigenaar welke opmaak er voor de teksten wordt gekozen. Deze afspraken worden vastgelegd in de CSS. Wanneer je als webredacteur ontevreden bent over de opmaak van een bepaalde stijl dan kun je binnen jouw organisatie afspreken dat de lay-out van die stijl wordt gewijzigd. De webbouwer verwerkt dit weer in de CSS.

6.2 De WYSIWYG-editor van het CMS Voor het invoeren van content gebruikt de webredacteur de editor van het CMS. Tegenwoordig is dat een invoertool die werkt volgens het WYSIWYG-principe: What You See Is What You Get. Dat betekent: wat je op het invoerscherm ziet is gelijk aan wat er op de site verschijnt. Ook dit principe zul je kennen van jouw tekstverwerker. Onderstaand een voorbeeld van zo'n WYSIWYG-editor.

Pagina 39

Afbeelding 13: WYSIWYG-editor

6.3 Wat de editor niet mogelijk moet maken Een editor bevat niet de volgende mogelijkheden: • onderstrepen • lettertype • lettergrootte • letterkleur • sub- en superscript • uitvullen (icoontje: ) • doorhalen (tenzij er een goede reden voor is)

6.4 Wat de editor wel moet kunnen De editor dient wel het volgende te ondersteunen: • het gebruik van opmaakprofielen en wel de volgende: ◦ kopstijlen: kop 1 (tenzij in het CMS de titel apart wordt ingevoerd), kop 2, kop 3, eventueel kop 4 ◦ standaard alineastijl ◦ samenvatting • vet (met HTML-tag strong) en cursief (met HTML-code em) • opsommingen, ongeordend en geordend • taal Het is ook belangrijk dat het CMS een zogenaamde HTML-modus kent. In de HTMLmodus wordt de WYSIWYG-editor vervangen door een venster waarin je de HTMLcode ziet en HTML kunt invoeren. Dat is handig als er met het kopiëren van tekst extra code is meegekomen, die niet meer verwijderd kan worden. In de HTML-modus kun je die code wel weghalen.

6.5 Tekst invoeren via de editor Vaak worden teksten vanuit een ander programma – bijvoorbeeld Word – gekopieerd en vervolgens in de editor geplakt om de tekst voor de website te gebruiken. Iedereen die dit wel eens gedaan heeft zal ook gemerkt hebben dat dat vaak mis gaat. Vanuit het tekstverwerkingsprogramma wordt allerlei code meegekopieerd die Pagina 40

er voor zorgt dat de tekst er op de website niet goed uitziet. Hoe kun je nu gemakkelijk teksten plakken in de editor? Er zijn verschillende mogelijkheden, maar we geven de voorkeur aan het gebruik van de HTML-modus van de editor. Dat werkt als volgt: 1. Kopieer de tekst, bijvoorbeeld uit een tekstbestand of een webpagina. 2. Ga via het CMS naar de pagina die aangepast moet worden. 3. Klik in de editor op het icoontje om naar de HTML-modus te gaan. In de editor in de vorige paragraaf is dit het icoontje editor het icoontje

, en in onderstaande

4. Plak alle tekst in het venster. 5. Ga weer terug naar de gewone WYSIWYG-weergave. 6. Maak daar de tekst verder op door opmaakprofielen toe te passen en waar nodig vet en cursief voor nadruk toe te voegen.

6.6 Afbeeldingen positioneren De editor van je CMS geeft je verschillende mogelijkheden om afbeeldingen links, midden en rechts te positioneren, maar er is maar 1 goede manier. ## nog uitwerken – alt-tekst – geen titel FCK editor en TinyMCE

6.7 Meer weten over de richtlijnen voor editors Bovenstaande opsommingen over wat de editor wel en niet moet kunnen zijn slechts enkele voorbeelden. De precieze richtlijnen staan beschreven in de ATAG-richtlijnen, eveneens uitgegeven door het WAI van het W3C.

Pagina 41

7. Richtlijnen voor webredacties Je kunt nog zo'n goed CMS gebruiken, of de content uiteindelijk voldoet aan de Webrichtlijnen staat of valt met de redacteur die deze content invoert. Daarmee komen we op de eigenlijke inhoud van het e-book, namelijk het toegankelijk invoeren van content.

7.1 Indeling richtlijnen We hanteren bij het bespreken van de richtlijnen de volgende indeling: • Structuur • Betekenisvol opmaken • Taal • Afbeeldingen • Hyperlinks • Downloads • Tabellen • Video en audio Met content bedoelen we 3 verschillende vormen van inhoud: • teksten • afbeeldingen • video en audio, inclusief Flash-banners

7.2 Structuur Elke tekst heeft een bepaalde structuur. Het heeft een titel, tussenkopjes en bepaalde woorden of zinsdelen hebben extra nadruk. Het web is bij uitstek het medium waar informatie direct duidelijk moet zijn. Surfende bezoekers zitten niet te wachten op een lang intro, maar willen direct lezen waar een pagina over gaat. De bezoeker wil de pagina snel scannen om de relevantie te bepalen. Om dat te bereiken brengt de redacteur structuur aan in de teksten. 7.2.1 Zet de belangrijkste informatie bovenaan Het lezen vanaf het web is heel anders dan het lezen vanaf papier. Een belangrijk verschil is dat mensen bij het lezen van een webpagina gelijk willen weten waar een tekst over gaat. Zet daarom het belangrijkste bovenaan. Begin met een titel die Pagina 42

beschrijft waar de pagina over gaat. Direct daarna een samenvatting, die kort en krachtig de boodschap vertelt. Er zijn ook uitzonderingen op deze regel, zoals bij teksten die een instructie bevatten of die een overzicht van verschillende onderwerpen behandelen. In dat geval is de bodytekst niet van belangrijk naar minder belangrijk geschreven. Maar dat geldt wel voor de titel en de lead: deze staan boven de body en beschrijven het belangrijkste van de pagina. 7.2.2 Geef iedere pagina een titel die de kern van het artikel samenvat Bovenaan een webpagina staat een titel. Deze titel vat kernachtig de inhoud van de webpagina samen. De titel bevat relevante trefwoorden, woorden die de bezoekers gebruiken. We hebben het hier over de titel die bovenaan een pagina staat. Deze hoort opgemaakt te zijn met een h1-element. Opmerking: de "titel" is een enigszins verwarrende term voor websites. Er is namelijk ook een andere titel op een pagina, namelijk de titel die zichtbaar is in het venster van je browser en die opgemaakt is met het HTML-element