WCAG 2.2 AA Partial Audit of the Laren Municipality Website Content

This sub-study pertains exclusively to the content of the website that the organization can enter or modify via the content management system.

This study evaluated 30 of the 55 success criteria of WCAG 2.2 Levels A and AA.

The remaining 25 success criteria relate to the technical aspects of the website and are evaluated in the separate technical sub-study.

Together, these two sub-studies constitute the complete evaluation of the website.

Success criteria assessed in the technical sub-study

The following success criteria were not evaluated in this content study and are covered in the separate technical sub-study:

The study was conducted using a representative sample. Within this sample, the accessibility issues identified were described as specifically as possible. Where possible, recommendations were included to address the issues.

This study does not provide an exhaustive overview of all possible accessibility issues. The findings represent a snapshot of the situation at the time of the study.

WCAG (Web Content Accessibility Guidelines) are internationally recognized guidelines for digital accessibility, based on four principles: Perceivable, Operable, Understandable, and Robust. Measurable success criteria have been established within these principles.
More information: WCAG 2.2 (Dutch translation)

The table below shows, for each WCAG principle and each WCAG level, how many success criteria were tested and how many of those were approved.

• https://www.laren.nl/college-van-burgemeester-en-wethouders
• https://www.laren.nl/robert-van-rijn-voorgedragen-als-nieuwe-burgemeester-van-laren

On several pages, images have incorrect alternative text (alt text). For example, the group photo on the college page describes what can be seen visually, but not what the image depicts. In addition, portrait photos describe only the appearance of individuals, without identifying who is in the image. This also occurs on other pages, such as with the portrait photo of Robert van Rijn. As a result, screen reader users do not know that it is a group photo of the college or which person is depicted in a portrait photo.

Recommendation: 

Provide clear and descriptive alternative text for images: For group photos, describe what the image depicts (for example: “Mayor and city council members”). For portrait photos, always include the person’s name (for example: “Portrait of Robert van Rijn”).

https://www.laren.nl/overhangend-groen

The page includes an image showing examples of properly and improperly trimmed hedges. The text associated with the image (the alt text) is exactly the same as the caption below the image. As a result, the same information is read aloud twice to users of assistive technology, such as screen readers. Since the caption already adequately describes the image, alt text is not necessary.

Recommendation: 

Use an empty alt text (alt="") so that the information isn't read aloud twice.

https://www.laren.nl/strooien-bij-gladheid

The page includes an interactive map showing the snow-plowing routes for the municipality of Laren. This map is embedded via an iframe. Online maps and mapping services are subject to an exception to the accessibility requirements, but this exception applies only to the mapping technology, not to the information provided via the map. The information about the snow plowing routes is currently available only via the map. The page lacks a text alternative that makes this information accessible.The map includes a search function, but this does not constitute a demonstrably accessible alternative. As a result, there is no guarantee that the information is accessible to all users.

Advice

Ensure that the key information from the map (such as which streets are covered by which snow-clearing routes) is also presented in an accessible format, for example through a text-based overview, a table, or a search function that is demonstrably accessible.

https://www.laren.nl/wateroverlast

On the page under the heading "Vertical borehole with infiltration filter," there are two download buttons labeled "Download the maintenance instructions." Both buttons display the form icon instead of the PDF icon. As a result, the accessible name of the buttons is "Download the maintenance instructions form," even though they are PDF files. Blind users who use a screen reader will hear an incorrect label.

Advice

Replace the form icon with the PDF icon. This will ensure that the button's accessible name is correct.

https://www.laren.nl/werkzaamheden-eemnesserweg

The page contains a clickable image of the map. The image serves as a link to a 404 page. The alt text describes the visual content of the map, whereas the alt text should describe the link’s destination. Screen reader users hear a description of the map but do not understand where the link leads.

Advice

First, fix the broken link. Then update the alt text so that the link destination is clear, for example: alt="Preliminary design for Eemnesserweg-West, click for larger view".

https://www.laren.nl/contact

The page features three icons under the headings "Phone Number," "Hours," and "Contact Form." Each icon is accompanied by a text description that a screen reader reads aloud to visually impaired users. The icons for "Phone Number" (a telephone) and "Contact Form" (a house) are purely decorative. The heading above already explains what the section is about. A screen reader first reads the heading and then the icon’s description, which is redundant and confusing. The icon for "Opening Hours" displays the word "OPEN." The current alt text "Icon of a hanging sign with the text 'open'" is too verbose. Only the text on the icon is relevant.

Advice

Set the alt attribute for the icons under "Phone Number" and "Contact Form" to an empty value (alt=""). Change the alt text of the opening hours icon to alt="OPEN".

https://www.laren.nl/werkzaamheden-eemnesserweg

The page features two renderings of the future Eemnesserweg. The images include alt text that describes their visual content, while there is also a caption providing the same information. As a result, a screen reader user hears both the alt text and the caption, effectively receiving the same information twice.

Advice

Update the alt text so that it simply indicates that the image is a view, for example: “View 1 of Eemnesserweg” and “View 2 of Eemnesserweg.” This makes it clear that these are two different images without repeating the description.

https://cuatro.sim-cdn.nl/larend4944f/uploads/Aanvraagformulier%20subsidie%20inwonersinitiatieven%20Laren.pdf?cb=a-ORkAMP

The PDF document features the Laren Municipality logo at the top. This logo is not tagged as an image and is therefore ignored by screen readers.

Advice

Tag the logo on page 1 as an image and provide a text alternative, such as "Laren Municipality Logo." Include the text alternative in the source file, and then re-export the document as a PDF. On subsequent pages, tagging the logo is unnecessary and even undesirable, as it can disrupt the reading flow. Mark the logo there as an artifact.

https://www.laren.nl/

On the homepage, under the heading “Or are you looking for...”, there is a list of twelve links, such as News, Municipal Taxes, and Moving. Visually, this appears as a list. However, in the code, these links are not formatted as a list. As a result, assistive technology cannot recognize that it is a list. In the footer, under the heading “Follow the municipality,” there are two links to social media (Facebook and Instagram). These links are placed within a p element, even though they visually form a list. Consequently, the list structure is not defined programmatically, and assistive software cannot determine that this is a list with multiple items.

Recommendation: 

Place the links in an unordered list.

• https://www.laren.nl/bekendmakingen-en-verordeningen
• https://www.laren.nl/duurzaam

On several pages, the heading structure is incorrect, which means that the content hierarchy is not properly conveyed to assistive technology. On the "Announcements and Ordinances" page, the page title (h1) is immediately followed by several h3-level headings, such as "Announcements," "Ordinances," and "Announcements in Your Neighborhood or District." The h2 level is missing, causing the structure to skip a step.On the Sustainability page, the heading “Laren Sustainable” is formatted as h2. The underlying items, such as “Insulation Campaign” and “Energy Project,” are also formatted as h2. As a result, it is not clear that these items fall under “Laren Sustainable.” This makes it harder for screen reader users to understand the page’s structure and navigate it.

Recommendation: 

Ensure that the heading structure is logical and sequential, without skipping any levels. On the “Announcements and Regulations” page, use h2 headings instead of h3. On the “Sustainability” page, keep the heading “Laren Sustainability” as an h2 and assign a lower heading level to the subheadings.

• https://www.laren.nl/koninklijke-erepenning
• https://www.laren.nl/crimineel-gedrag

Op meerdere pagina’s zijn opsommingen visueel als lijst weergegeven, maar niet als lijst in de code opgemaakt. Op de pagina koninklijke-erepenningstaat onder de kop “Overzicht Koninklijke erepenninghouders” een opsomming van erepenninghouders die is opgebouwd als één alinea met regelafbrekingen <br>. Hierdoor kunnen hulptechnologieën niet herkennen dat het om een lijst gaat. Ook onder de kop “Hoe werkt de aanvraag?” zijn de vijf stappen visueel genummerd, maar in de code opgemaakt als losse alinea’s met handmatige nummering. Daarnaast is de bijlagenlijst onder stap 2 niet genest binnen het bijbehorende stap-item, waardoor de hiërarchische structuur niet programmatisch bepaald kan worden.Op de pagina crimineel gedrag zijn de vier opsommingsitems onder de kop “Wat moet u doen” eveneens opgebouwd als één alinea met regelafbrekingen (br). Hierdoor kan hulpsoftware niet aangeven dat het een lijst betreft of uit hoeveel onderdelen deze bestaat.

Recommendation: 

Convert these bullet points into actual lists in the code. Use an unordered list (ul) for bullet points and an ordered list (ol) for numbered steps. Also, make sure that nested lists (such as the attachments under step 2) are properly nested within the corresponding list item, so that the structure is correctly conveyed to assistive software.

https://www.laren.nl/contact

Under the heading "Visiting Addresses" on the page, there are two locations listed: "BEL Combinatie" and "Brinkhuis Laren." The names of the locations appear as plain text in a paragraph without any structural elements to indicate that they are two separate locations. A screen reader user cannot recognize the two locations as separate items or navigate directly to them.

Recommendation: 

Give "BEL Combinatie" and "Brinkhuis Laren" their own h3 headings so that the structure is clear and users can navigate directly to them.

https://cuatro.sim-cdn.nl/larend4944f/uploads/Aanvraagformulier%20subsidie%20inwonersinitiatieven%20Laren.pdf?cb=a-ORkAMP

The PDF document contains several visual headings, but none of them are tagged as headings. These include the document title on page 1 and the section headings "Part A: An Idea for Your Neighborhood" (page 1), "Part B: Contribution Toward AED Costs" (page 2), and "Part C: Form Signature" (page 3). All of these texts are marked as regular paragraphs (P) in the tag structure. As a result, people who are blind and use a screen reader cannot navigate using headings and do not get an overview of the document structure.

Recommendation: 

Adjust the formatting styles in the source file so that the headings are formatted as heading styles (Heading 1, Heading 2, and so on). Then export the document again as a PDF.

https://cuatro.sim-cdn.nl/larend4944f/uploads/Aanvraagformulier%20subsidie%20inwonersinitiatieven%20Laren.pdf?cb=a-ORkAMP

In the three tables in the document, the first cells in the input rows are marked as header tags (TH). These are empty input cells that do not serve as headers. Screen readers announce these cells as headers, which is confusing for users.

Recommendation: 

Tag the input cells in the data rows as regular data cells (TD). Make this change in the source file, and then export the document again as a PDF

https://cuatro.sim-cdn.nl/larend4944f/uploads/Collegebesluitenlijst%20Laren%2010%20maart%202026.pdf?cb=_TlKpWzA

The PDF document contains no tags and therefore has no defined structure. As a result, assistive technologies, such as screen readers, cannot identify which parts are headings, lists, or other structural elements. Images are also not interpreted correctly.

Recommendation: 

Add the appropriate tags to the document so that assistive technology can recognize its structure and internal relationships. For example, you can indicate which sections are headings. In many cases, this can be resolved by re-exporting the document from the source file (e.g., in Word or InDesign) to PDF, with the option for tags or labels enabled. Because the document currently contains no tags, other success criteria, such as 1.1.1 and 1.3.2, cannot be assessed. Please note that adding tags may reveal new accessibility issues.

https://www.laren.nl/werkzaamheden-eemnesserweg

The instruction “Click on the image to view the preliminary design more clearly” is unclear because it is not clear which image is being referred to. Only users who can see the page can determine this. Because the text and the image are not linked in the code, screen reader users cannot make this connection.

Recommendation: 

Replace the instruction with a text link directly next to the image, for example: "View the preliminary design in a larger view." This way, the action is equally accessible to all visitors, and the separate instruction is no longer necessary

https://cuatro.sim-cdn.nl/larend4944f/uploads/Aanvraagformulier%20subsidie%20inwonersinitiatieven%20Laren.pdf?cb=a-ORkAMP

PDF documents need to have a proper title in their file properties, and this document title should be displayed instead of the file name. The PDF document {URL} does have a proper title, but it is not displayed in the title bar.

Recommendation: 

Make sure the title is set correctly in the PDF’s file properties. Ideally, you should do this in your source file. Alternatively, open the PDF in a suitable editor, such as Adobe Acrobat Pro. Go to the document properties. Check that the title is correctly saved in the document information. Also make sure this title is displayed instead of the file name. Then save the document again to confirm the changes.

https://cuatro.sim-cdn.nl/larend4944f/uploads/Collegebesluitenlijst%20Laren%2010%20maart%202026.pdf?cb=_TlKpWzA

The PDF document does have a title listed in its file properties, namely “Anonymized document.” However, this title does not adequately describe the document’s content. For PDF documents, it is important to include a clear and descriptive title that accurately reflects the document’s content.

Recommendation: 

Set a meaningful and descriptive title that accurately reflects the document’s content. It is best to do this in the source file (such as Word or InDesign) before exporting to PDF. In Adobe Acrobat Pro, verify that the title is correctly entered in the document properties, and then save the document again to apply the changes.

https://www.laren.nl/wateroverlast

On the page, under the headings "Vertical well with infiltration filter" and "Relief well," there are links labeled "Watch the video," each of which links to a different YouTube video. The links cannot be distinguished based on the link text alone. In a screen reader's link list, these identical entries appear without any indication of which video is being referred to.

Recommendation: 

Make the link text descriptive by specifying the topic of each video, for example, "Watch the video on vertical drilling," "Watch the video on cleaning the sand trap," and "Watch the video on the relief well"

https://www.laren.nl/contact

On the page, under the heading "phone number," there is a link labeled "14 035." This short number appears on its own in a separate paragraph with no surrounding text. It does not describe the purpose of the link. In a screen reader's link list, blind users will hear only this number, without any context about what the link does or where it leads.

Recommendation: 

Edit the link text so that the destination is clear, for example, "Call 14 035".

https://www.laren.nl/

The homepage features an H2 heading that reads "Or are you looking for...". This heading does not describe the section's content; instead, it asks a question. As a result, users who navigate by headings cannot tell what this section contains.

Recommendation: 

Replace the heading with a descriptive title that indicates what the section contains, such as "Frequently Asked Questions" or "Popular Topics."

https://www.laren.nl/overhangend-groen

The heading “Be prepared for this” on this page does not clearly describe the section’s topic. Even within the context of the page, the meaning remains unclear. As a result, users who navigate by headings cannot tell what to expect in this section.

Recommendation: 

Use a descriptive heading that reflects the topic of the paragraph, such as "Regular maintenance prevents inconvenience."

https://www.laren.nl/werkzaamheden-eemnesserweg

On the page, the heading "Questions?" is too generic to describe the section's topic. The heading appears above a paragraph containing specific contact information for questions about the construction work on Eemnesserweg. Screen reader users who navigate by headings cannot determine what this is about based on "Questions?" alone.

Recommendation: 

Make the heading more specific, for example: "Questions about the work."

https://www.laren.nl/openingstijden

The heading directly below the page title contains no text and therefore does not describe a topic or purpose. Users who navigate using headings will encounter an empty heading.

Recommendation: 

Enter a descriptive text in the title field of the opening hours component in the CMS, such as "Civil Affairs Counter."

Step 1: Contact form for Laren
https://www.laren.nl/form/contactformulier-laren/contactformulier-laren-0

The h1 and h2 tags on step 1 of the form are virtually identical: the h1 reads "Contact Form - Laren" and the h2 reads "Contact Form Laren." The h2 does not describe the content of the step; it merely repeats the form name.

Recommendation: 

Replace the h2 with a descriptive step title that explains what is required in this step. For example, "About this form."

https://www.laren.nl/contact

The page contains a button labeled "Fill out the contact form." A screen reader reads this button as "Fill out the contact form form." The extra word "form" is not visually visible (the screen only displays an icon), but it is included as text in the underlying code.

Advice

Remove the icon from the button. The text "Fill out the contact form" is sufficient as a CTA button.

The website offers a high-contrast version. This can be enabled using a "contrast switch." This success criterion has been fully tested in high-contrast mode. The high-contrast version is considered an alternative to the standard version.

This may cause contrast issues in the standard version. These issues have not been further evaluated.

Advice

We recommend ensuring that the standard version also includes sufficient color contrast in all text. This improves the website’s accessibility for visitors with visual impairments.

Texts with sufficient color contrast are also easier for all readers to read. This makes reading less taxing, requires less energy, and is (subconsciously) perceived as more enjoyable. As a result, readers are more likely to take action.

The high-contrast version can then be used to provide "enhanced contrast," thereby meeting the WCAG 1.4.6 Enhanced Contrast success criterion (Level AAA).

A high-contrast version is available on the website. It can be enabled using a "contrast switch." This success criterion has been fully tested in high-contrast mode. The high-contrast version is considered an alternative to the standard version. As a result, there may be contrast issues in the standard version. These have not been further evaluated.

Advice

Ensure that the standard version also provides sufficient color contrast for all graphic elements. This improves the website’s accessibility for visitors with visual impairments. The high-contrast version can then be used to provide “enhanced contrast.”