Last Updated on August 15, 2024
An Accessible Website is More Than Just a Responsive Website
This topic is huge. I won’t try to do it justice because there are specialists in the area of Accessibility who are much better qualified than I am to talk about it. Close to home, there is my friend Anne-Mieke Bovelett, and of course all the people at the Web Accessibility Initiative.
Web Accessibility – What is it?
Web Accessibility Resources and Information
Why is it important to make websites accessible to all users?
What is the difference between accessibility and usability?
Is responsiveness part of accessibility?
How can you make your website accessible to anyone?
How to Make Your WordPress Site Accessible
How does Accessibility fit into my Online Marketing?
Accessible means websites people can use
Accessible means search-engine-friendly content
Accessible means design-friendly fonts and colours
Accessible means project-friendly, sustainable thinking
I do want to talk about Accessibility briefly because it is, in my opinion, very connected with the sustainability, and agility of websites and other online applications that we create. As well, if we want to talk about clean and hygienic marketing, we need to talk about accessible, long-lasting marketing.
Accessibility is also the law.
Is your website Data Protection compliant? What about Accessibility compliant? Businesses will need to comply with the EAA by no later than June 2025. Not only EU businesses – any business website that has traffic from the EU. Just like GDPR.
The European Accessibility Act (EAA) seeks to remove accessibility barriers to a range of goods and services traded in the internal market. It will make it easier for persons with disabilities to find accessible products and services.
You can find more information on the law right here: https://web-directive.eu/
Web Accessibility – What is it?
Let’s talk about how we can offer accessible content, starting with our websites.
Web Accessibility is another word for barrier-free web design. Accessible web design means that websites are designed in such a way that they can be used and perceived by all users, not only people with physical disabilities.
Accessibility means creating websites and mobile (web) applications in such a way that more people can use them without restriction. That also means people can use your website or app regardless of the device or size of the device. (See Responsive Web and Device Agnostic)
„Accessibility“ usually refers to people with special needs. However, the large and growing number of older users of our website also benefit from barrier-free web offerings. Not to mention anyone who has tried to access our website on their legacy mobile device – in the dark, in the rain, holding a baby etc. Let’s call these situations the „outside-the-perfect-situations“.
„Handsfree“ includes voice-activated devices like Alexa and Siri. Accessibility here means our context (our hands are full) does not exclude our being able to use the application. In the event of an emergency, we will be very grateful for this accessibility consideration.
„Leave no one behind“ also applies to web design.
Accessible web design is very simple to understand. An accessible website is accessible to all users and all devices without restrictions. These websites have the following characteristics:
- + People with special needs (and outside-the-perfect-situations) have easy access to the information.
- + Web design and navigation are user-friendly.
- + There are no restrictions on the device with which the visitor accesses the website.
As we move into the year 2023, you might think most websites are accessible. That is sadly still not the case.
„Across the one million home pages, 50,829,406 distinct accessibility errors were detected—an average of 50.8 errors per page. The number of detected errors decreased by 1.1% since the February 2021 (51.4 errors/page) analysis. „Errors“ are WAVE-detected accessibility barriers having notable end user impact, and which have a very high likelihood of being WCAG 2 Level A/AA conformance failures.“
WebAIM https://webaim.org/projects/million
Web Accessibility Resources and Information
The World Wide Web Consortium (W3C) is an international consortium in which member organizations, permanent staff, and the public work together to develop web standards.
The Web Accessibility Initiative (WAI) is an area within the W3C in which several working groups and interest groups are concerned with barrier-free access to the Web and its content. The WAI, which was founded in 1997, aims to make the World Wide Web „accessible to as many people as possible.
WCAG.com is your essential online resource for understanding and applying the Web Content Accessibility Guidelines (WCAG), advancing web accessibility and improving your users’ experience. You’ll find up-to-date, reliable resources related to accessible design, coding and content.
The European Web Accessibility Directive (Directive (EU) 2016/2102) has been in force since 22 December 2016 and provides people with disabilities with better access to websites and mobile apps of public services.
The WebAIM Millions is an annual, automated accessibility analysis of the home pages of the top one million websites currently on the internet.
„Did you know that if you type #a11y in the search bar of your favorite search engine, you find tons and tons of great resources about online accessibility?“
Anne-Mieke Bovelett Accessibility & Possibility Advocate annebovelett.eu
Why is it important to make websites accessible to all users?
In our digital world, access to websites is becoming synonymous with access to information. Access to things allows us to participate in society. Access to information and education are basic human rights. As our world becomes more digital, access to the websites and apps in which goods, services, and information are found might also be considered a human right.
If websites and web apps are accessible to all users and all devices without restrictions, the world has the opportunity to be a very democratic place.
„The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.“
Tim Berners-Lee The Inventor of the World Wide Web
What is the difference between accessibility and usability?
At the centre of accessibility is the goal of making the right content accessible in a clear and understandable way, and doing so with seriousness and credibility. This serves the user’s interest efficiently, effectively and satisfactorily.
Although your website might be accessible according to the guidelines established by the WCAG, your website may not be usable. Usability means the quality, satisfaction, and efficiency a person experiences when using your website.
On the other hand, a website can be considered usable but may ignore accessibility guidelines.
„A strict focus on accessibility as a scorecard item doesn’t help users with disabilities. To help these users accomplish critical tasks, you must adopt a usability perspective.“
Jakob Nielsen of the Nielsen Norman Group
Is responsiveness part of accessibility?
We have tried to link usability and accessibility through Responsive Design, i.e. in simple terms the mobile suitability of the website.
Theoretically, it’s possible to build a website that complies with WCAG, i.e. is accessible, but has not been designed and implemented responsively. This still happens today with older websites, when responsive design was not yet an issue.
The opposite case (responsive but not accessible) is unfortunately even the rule. Mobile devices are very often taken into consideration, while barriers are not.
Responsive Web Responsive web design (RWD) or responsive design is an approach to web design that aims to make web pages render well on a variety of devices and window or screen sizes from minimum to maximum display size to ensure usability and satisfaction. Ethan Marcotte coined the term responsive web design—and defined it to mean fluid grid / flexible images / media queries—in a May 2010 article in A List Apart. (Wikipedia)
Device Agnostic Not tied to a particular device. Same as „machine independent.“ The term generally refers to software that runs on multiple platforms such as a Java application. It also refers to websites that are as readable on mobile devices as they are on desktop computers. (PCMag)
How can you make your website accessible to anyone?
Unfortunately, we often still design websites and web applications in ideal situations. We use large screens, in quiet offices, with perfect lighting. Most of our users will not access our website in these situations.
According to Statcounter, only 22% use a screen with a 1920 pixel resolution, only 17% use iOS, and 65% use a Chrome browser.
A website should be accessible to everyone. However, this is only possible if you rely on an easy-to-read font, subtitles in videos or alternative texts for images. Otherwise, you might unknowingly exclude part of your target audience.
Here’s what you should keep in mind when designing your accessible website
In order to design your website barrier-free and in accordance with the WAI guidelines, you should pay attention to the following things:
- + Strict separation of content, structure and design: this allows for a problem-free update of the content afterwards without interfering with the design and vice versa.
- + Scalability: specify units of measurement for fonts, areas and spacing, etc. in relative terms (em or %). Since some users use the function of browsers to enlarge fonts, etc., even at 200% enlargement, the content should still be easily readable and recognizable.
- + Responsiveness: website should be easily readable on all devices. – Adhere to a meaningful structure: use headings h1-h6 correctly. Only one main heading (h1) is followed by an h2, which in turn is followed by either another h2 or an h3.
- + Basic HTML terms: These should always be used (e.g., for including custom styles via style specifiers).
- + Navigation: Moving through the website should be easy and simple to understand. For people who cannot use a mouse, navigation should also be possible via keyboard.
- + Contrast ratio: Use high-contrast colours – pay attention to sufficient contrast between foreground and background colours (especially important for texts with small font sizes).
- + Short and understandable sentences: Use simple sentence structure and avoid foreign words as much as possible.
- + Acronyms and abbreviations: Mark them with the HTML element abbr.
- + Meaningful metadata: Fill in title tags and meta descriptions.
- + Text alternatives/image descriptions: alt attributes should always be filled in for images and forms, as read-aloud applications need them for the speech output of the content; the title attribute is equally important, especially for links.
How to Make Your WordPress Site Accessible
by Joe A Simpson Jr. Front-end Web Developer and Section 508/Accessibility Advocate, Metro (Los Angeles) greengeeks.com/webinars/how-to-make-your-wordpress-site-accessible/
How does Accessibility fit into my Online Marketing?
Accessible means websites people can use
Our websites should be fast, simple, and answer the needs of our users. They should be easy to use, regardless of context. That means they should be accessible. Regardless of who your visitor is, what device they use, where they are, or what they are doing – even when we are not able to physically access the device.
Everyone, not just users with special needs, can benefit from accessibility features. Vision impaired, low dexterity and power users all benefit from keyboard shortcuts. Captions and transcripts are essential to deaf users, but also help language learners. https://developer.chrome.com/docs/extensions/mv3/a11y/
Accessible means search-engine-friendly content
Accessible websites don’t exclude the rest of our online marketing. The content of your website can be made accessible to people in other countries, using other languages via the SERPs found in search engines. That means access to your market, language, and most importantly to the needs and the search intent of your audience.
Accessible means design-friendly fonts and colours
„Just type your name in one or two fonts, leave it black and white. It’s so simple because it’s the highest contrast. You’re not going to have any accessibility issues. And it’s going to be clean.“
Rhonda Negard Fat Dog Creatives
Accessible means project-friendly, sustainable thinking
„Sustainability means taking a holistic perspective on social, environmental, and economic issues. The Agile Manifesto can be leveraged for increasing sustainability. For example, when focusing on business people and developers working together, explore the target group and ensure that you embrace accessibility.“
https://www.infoq.com/articles/agile-manifesto-sustainability
Why is accessibility so important?
The web is probably the most important resource for many aspects of life: education, government, commerce, healthcare, recreation, and more.
It is important that the web is accessible to provide equal access and opportunity for everyone. An accessible web gives everyone the opportunity to participate more actively in society.
The web offers the possibility of unprecedented access to information and interaction to those who experience barriers in traditional media.
Barriers in the use of print, audio-only, or visual-only media can be overcome through accessible, digital technologies.
„So, why do we say accessibility is (important for) marketing? Simple. Excluding 26% of your potential visitors is not just an awful thing to do on a humanitarian level; it’s terrible for marketing and sales.“
Anne-Mieke Bovelett Educational Marketing 101: School Is In, Chapter 8 „Accessibility is Marketing“
With thanks for the image to Daniel Ali https://unsplash.com/@untodesign_