If you are familiar with the field of website design and development, you must have heard about the concept of “Accessibility” in website design. Accessibility is a key concept in website design that has a significant impact on user experience.
Why is accessibility important and how can it help improve the user experience of a website?
Website accessibility means creating an environment for all people, with all their limitations.
Imagine you have an incredibly beautiful website full of content. Can you claim to have a successful website if people with visual, hearing, or mobility disabilities can’t use it effectively? Accessibility is an important principle in website design, which is also very important from a commercial point of view. By having an accessible website, you will reach a wider audience.
In this article, we will examine the concept of accessibility in website design and its importance.
Table of Contents
What is accessibility in website design?
Accessibility means that the website can be used by anyone with any restrictions and special conditions. This limitation may be disability and physical limitations, or environmental limitations such as people who have slow internet access or only use mobile phones. By observing the principle of accessibility in website design, all audiences can use the website and its features equally, regardless of their conditions.
The importance of observing the principle of accessibility is such that it has become a law in some countries. And if a website doesn’t follow it, it will be in trouble. In other words, respecting the accessibility of websites, apart from being the right thing from a moral and human point of view, is also considered as a legal requirement in some areas.
Some of the countries that have considered website accessibility as a legal issue include:
- United States
- European Union
- Canada
- Australia
- England
What are the limitations and disabilities in accessibility?
There are many different types of disabilities and limitations, and people with disabilities are as diverse as ordinary people.
According to the World Health Organization (WHO) report on disability and health, more than one billion people, that is, about 15% of the world’s population, have some type of disability. These numbers show that these one billion people should have access to the web like everyone else, and as a result, designing websites should be accessible to them.
1. People with vision problems
People with vision problems include the blind and visually impaired. The World Health Organization has estimated that 258 million people worldwide have vision problems: 39 million are blind and 246 million are visually impaired.
This number represents a significant population of users (almost the size of the population of the United States of America). Many people with vision problems use special software and screen magnification features. Most browsers and operating systems today have these capabilities. Some users also use Screen Reader software that plays digital texts for them. Some examples of Screen Reader software are:
- JAWS and Dolphin Screen Reader (for Windows).
- Free products like NVDA (for Windows), ChromeVox (for Chrome browser), and Orca (for Linux OS).
- Software built into the operating system such as VoiceOver (for macOS, iPadOS, iOS), Narrator (for Windows), ChromeVox (for Chrome OS), and TalkBack (for Android).
2. People with hearing problems
Deaf and hard-of-hearing people comprise a significant number of users. According to the World Health Organization, 466 million people worldwide have hearing problems.
The best way to provide accessibility for these people is through text alternatives. Videos must have subtitles and for audio content, text must be provided.
3. People with mobility problems
These people have movement problems that may include physical issues or neurological/genetic disorders that lead to weakness or loss of control over body parts. For example, some people may have difficulty performing manual tasks such as using a mouse. This type of disability may be due to old age and also due to hardware limitations, for example, some users may not have a mouse.
Some common solutions for website accessibility for people with mobility problems are:
- Using the keyboard: The most common way is to allow users to work with the website with keyboard keys such as Tab, Enter, and Space.
- Use of simple navigation: Websites should have simple and keyboard-friendly navigation. This navigation should allow users with mobility problems to easily move around the site.
- Using Responsive Design: By using responsive design, the website automatically changes the size of the user’s screen and provides a better accessibility experience for people with mobility problems.
4. People with cognitive problems
Cognitive problems refer to a broad set of disabilities. From people with intellectual disabilities who have limited abilities to elderly people who have memory problems. People with mental disorders such as depression and schizophrenia as well as people with learning problems such as dyslexia and attention deficit hyperactivity disorder are included in this group. But what is important is that despite the wide variation in clinical definitions of cognitive problems, these people have similar problems in functioning. These problems include not understanding the content properly, inability to remember how to perform tasks, and confusion when working with the website.
The best strategies for website accessibility for people with cognitive disabilities include the following:
- Providing content in different ways such as playing text with audio or video,
- Comprehensible and simplified content
- highlighting important content,
- Minimize irrelevant content or ads.
- integrated design and navigation on the web page,
- Dividing processes into several stages and using progress indicators,
- Facilitating the authentication process of entering the website and minimizing it so that security is also maintained.
- Facilitating the process of completing forms by providing error messages and simply recovering errors.
Important points in compliance with accessibility
- Using HTML tags and elements:
The first step to comply with website accessibility is for the site designer to use HTML tags and elements such as titles, paragraphs, links, images, tables, and forms, etc. correctly.
- Provide alternative text:
If images and videos are used on the website, they must be replaced with text. Alt text is a description of the image or video content.
- Site navigation features:
This step refers to elements such as links and menus for easy website navigation. The website designer should make sure that all links work properly and menus are available so that all users can easily navigate the website.
- Test and evaluation:
At this stage, the website designer should test the website using accessibility testing tools and with people with accessibility problems. For example, ascertain whether the website is accessible to people who are blind or have physical disabilities.
Some of the website accessibility testing tools are:
- WAVE Web Accessibility Evaluation Tool
- ax DevTools
- Pa11y
- axe-core
- io
- Site improvement Accessibility Checker
5. Publication of the accessibility statement:
The site designer must publish an accessibility statement on the website. This statement shows that you care about accessibility and respect users with accessibility issues. You have also taken steps to increase the accessibility of the website.
Introducing two technologies used in website accessibility
The importance of website accessibility is so high that in addition to the tools introduced in this field, technologies and techniques have also been created to improve website accessibility.
1. ARIA
ARIA (Accessible Rich Internet Applications) is a technology that is used in websites to help people who have problems accessing the website. This technology is an intermediary between the user interface of dynamic websites and a screen reader (or other assistive devices for disabled people).
ARIA can provide the screen reader with the role of each element and the relationship between them on a page of the website, so that the purpose and, as a result, the function of each element can be determined for the disabled user. In this way, they also easily interact with dynamic websites.
2. Accessibility API
Websites and browsers use Accessibility APIs to increase accessibility. These APIs provide the semantic and structural information of the website so that Assistive Technologies (ATs) can provide this information in an understandable form for users with access problems. Each operating system (such as Windows, MacOS, Linux, etc.) has its Accessibility APIs through which it provides communication accessibility information.
Accessibility APIs provide information about HTML elements and website content in the form of an “Accessibility Tree”. This access tree includes information such as element names, texts, links, and website structure. This information is used semantically by ATs.