Making your website accessible is not easy! If you have ever looked into it, you already know that it can be quite overwhelming. Are you unsure about what an accessible website is? This blog briefly explains what it means. When you know how important accessibility is, you would want to start optimizing as soon as possible. Below I have prepared a step-by-step plan for you, so that your website becomes a lot more accessible!
A lot of information comes from these scans. Some areas for improvement will be technical, leave these improvements to your website builder. Fortunately, there are also “quick wins” that you can adjust yourself:
- Adjust color contrasts. Make sure there is enough contrast everywhere so that everything on your site is easy to read. Check your contrast here .
- Adjust alt tags. Ensure that all images have appropriate alternative text.
- Adjust headings. Make sure that headings always end with one.
- Use descriptive links. Make sure the links describe where they lead. For example not: Click here , but: Read about us here.
- Do not use autoplay. Make sure that no videos play automatically, that can be found annoying for screen readers.
After implementing these points, you can test your website again and see how your website has already been improved!
Keyboard testing can be described as testing the keyboard functionalities on your website. This functionality is put into place for people who only use their keyboard to navigate the web.
- Test this by clicking on tab. To navigate back use tab + shift. Check here which elements have an outline and which do not. Additionally, check that there are no places where you get stuck, such as a pop-up that you can no longer click away. That can be frustrating for the user.
- Create a design for a clear outline or color change. Then ask your website builder to implement these points on your website.
Screen reader testing
Screen readers are important for people who cannot visually view the content. Always keep this in mind when testing! The screen reader is built in as a standard on Mac computers. There are several free screen readers available for Windows such as NVDA .
How does this work? Start testing by pressing Command + F5 . This activates Apple's voice-over. To start using NVDA's voiceover use Control + Alt + N .
When running a test, you go through different elements of your website to check whether they are being read correctly. Pay particular attention to whether forms are read out correctly and whether it is clear what must be completed here. Below is an overview of shortcuts to make testing easier. Are you stuck somewhere? Then ask your website builder for help.
Turn off voice over
Command + F5 (2x)
Insert + Q
Pause and resume
Voice over help
Control + Command + H
Insert + 1
Click on link
Control + option + space
A zooming test is done specifically with people who zoom into their screen a lot, to make the text easier to read in mind.
To test this, zoom in via the browser. Check if:
- No elements overlap
- Content is still legible
- Whether the keyboard navigation and screen reader still work.
After all these steps, your website should be a lot more accessible! Can't figure something out? We are happy to help you, please feel free to contact us .