Make your web pages digitally accessible
Digitally accessible is a hot topic these days. As a website owner or administrator, you want everyone to be able to read and use your information properly. The goal is that your website is accessible to all people, including those with disabilities.
This means that not only does your website need to be technically sound, but also the content you publish. After all, your content also belongs to the guidelines of WCAG 2.1 to comply. But how do you make your content digitally accessible? And what do you need for that?
Basic knowledge of HTML (Hyper Text Markup Language)
I'm just assuming you have some knowledge of HTML. If not, I recommend that you gain that knowledge. A good source for this is, for example w3 schools. After all, you need that knowledge to be able to structure the content of your webpage.
Good content structure
Before you start working with HTML in the Content Management System (CMS), you first write structured text. You start with a good page title that incorporates words you want to be found on. In the case of this article, these are the keywords “digital” and “accessible.”
The first paragraph
Then, in the first paragraph, you specify what your content is about. Get straight to the point and encourage the visitor who usually has a short attention span to continue reading.
This can be, for example, by means of a conclusion, goal or problem statement about the subject. In short, that first paragraph is important! Write actively, formulate short sentences in simple (spoken) language, and keep your paragraph short. Oh yes, and don't forget to include the keywords in your page title.
You also write the rest of your text, which delves deeper into your topic, in the same way. You structure the paragraphs with subheadings. If you use internal or external links, give them a unique link text, not “Click here” or “Read more.”
Screen reader
A visually impaired visitor uses keyboard shortcuts to navigate through the headlines and links. The screen reader then reads it. Of course, this depends on how you placed the text in the CMS. This is where your knowledge of HTML comes in handy.
What does your HTML look like
The text editor of the CMS has a button, when you click on it, the entered text, including the HTML, becomes visible. Now it's just the question. How do you structure your content in HTML? You divide your content into blocks.
Each block has a heading, namely a heading 2 (h2) with the paragraphs (p) below that you provide with subheadings, the heading 3 (h3). Depending on the length of your content, you can repeat this structure. By the way, don't use more than ten h2 heads and you can use as many of the h3 subheadings as you want.
<h2>Kop</h2>
<p>Paragraaf</p>
<h3>Tussenkop</h3>
<p>Paragraaf</p>
<p>Paragraaf</p>
<h3>Tussenkop</h3>
<p>Paragraaf</p>
<h2>Kop</h2>
<p>Paragraaf</p>
<h3>Tussenkop</h3>
<p>Paragraaf</p>
<ul>
<li>Lijst item</li>
<li>Lijst item</li>
</ul>Now, you may be wondering, where do I enter heading 1 (h1). This is usually the page title that you enter first when you create a new web page in the CMS. Of course, you can use multiple h1s on a page, but that is technically not recommended by the search engine.
Images, audio, and video
Add your footage to your webpage, make sure your image supports the content and describe the image in the alt attribute as shown below.
<img src="/pad/naar/voorbeeld.jpg" alt="Voorbeeld omschrijving van afbeelding">In addition to images, you can also add audio and video, for example a podcast or a video about a product. To make both digitally accessible, place a transcript below the audio and provide subtitles in the video.
Prevent seizures (epilepsy)
Avoid content on your web pages that blink more than three times per second. There is also no alternative solution for blinking content.
Finally, make sure that the page title in the title tag covers the content on your page, and include the important keywords. This is not only good for digital accessibility but also for search engine optimization. In short, as a website owner or administrator, you contribute to an accessible website in this way.
Written by Sandor Stikkelman, front-end designer & developer
Do you want your website to meet the digital accessibility requirements?
We would be happy to see with you what steps you can take to digital accessibility to improve. Take contact up and ask about the options.
Heb je vragen? Of wil je samen sparren?
We denken graag met je mee hoe jouw organisatie digitaal kan versnellen. Of het nu gaat om een UX, technische uitdaging of AI oplossingen. Stuur een berichtje en we nemen zsm contact met je op.
Verder lezen
Nieuwsgierig? Lees onze andere inzichten over webontwikkeling, AI, toegankelijkheid en digitale strategie
.jpg)
