Understanding Error Feedbacks, Importance, Impact on Users and WCAG 2.2 Success Criteria to Follow

  

Introduction:

Error messages are those little pop-ups or notifications that tell you something has gone wrong when you're using a website or an app. Sometimes it is bit confusing that in which MAS we have to log the issues regarding to error messages. In this article, we'll talk about why error messages are important and explore simple solutions to make them accessible, and in which WCAG 2.2 success criteria will it falls.

 

Why Are Error Messages Important?

Imagine trying to fill out a form, and when you click 'Submit,' nothing happens. No error message. You're left wondering what went wrong. Error messages help users understand what happened, why it happened, and what they can do to correct it. For people with disabilities, especially those using screen readers, clear and accessible error messages are crucial for a positive online experience.

 

Let's look at four common situations and how to make error messages accessible:

Situation 1: When errors are identified by other visual cues but not presented in text

Sometimes, errors occur, but the user doesn't know because there's no visible notification in text. Fields with errors might turn red, or you'll see a special symbol indicating errors. It is not discouraged to use colours or symbols to show errors, but it's also important to include a written message to explain the same.

Impact on Users: Users who rely on screen readers might miss errors identified only by visual cues, making it difficult for them to understand what's wrong.

Additionally, individuals with colour deficiency would struggle to identify errors if only red highlighting is used for fields with errors.

Possible Solution: To solve this, you can add a visually noticeable error message in text and also make sure it's announced by screen readers. You can have a look on the possible solutions of situation 3 as well.

 

Situation 2: When error feedbacks does not include suggestions to correct them

Unclear error messages can be confusing. It's important to provide specific details about the problem and suggest a solution. This helps all users, especially users with cognitive disability , to understand and address the issue.

Impact on Users: Users, including those with cognitive disabilities, may struggle to understand vague error messages. They might not aware that how to correct them.

Possible Solution: Provide suggestions for fixing the errors. For example, if dates are not entered in the correct format, suggest the correct format as well with the error message.

 

Situation 3: When error feedbacks are not announced by screen reader immediately

Some users rely on screen readers to navigate and understand content. If error messages are not announced, these users won't know about the issues.

Impact on Users: Users who rely on screen readers might miss error messages, making it challenging for them to know about and resolve issues.

Possible Solution: Our main goal is to make sure that when there's an error on the screen, it gets announced by a screen reader immediately. To do this, we can use ARIA attributes like role="alert" or aria-live="assertive", on the container where the error message appears. Another way is to make sure the focus goes to the summary of the errors or on the first form element with an error. When the focus moves, the screen reader will announce the error messages automatically. Additionally, we can set up an alert dialog to notify users about error messages.


Situation 4: When error feedbacks are not associated with the appropriate elements

Errors can happen in forms despite clear instructions. When they do, users need to know, especially those using assistive technology like screen readers. Associating error messages with the specific input fields helps users understanding and correcting errors.

Impact on Users: screen reader users may encounter difficulty in determining the associated errors for a particular form element while navigating using tab key.

Possible Solution: This can be solved by using aria-discribedby to programmatically associate the error message with the input field.

 

WCAG 2.2 Success Criteria for the above mention situations.


Situations

Success Criteria

Situation 1: When errors Are identified by other visual cues but not presented in text

 

Situation 2: When error feedbacks does not include suggestions to correct them

 

3.3.3 Error Suggestion(Level AA)

Situation 3: When Error feedbacks are not announced by screen reader immediately

 

4.1.3 Status Messages(Level AA)

Situation 4: When error feedbacks are not associated with the appropriate elements

1.3.1 Info and Relationships (Level A)

 

That’s all for today.

 

  

Comments

Post a Comment

Popular posts from this blog

Why Accessibility of Digital Learning Materials are essential?

Imagine a student named Noah, known for his brilliance in class. Despite his intelligence, he struggles to grasp the concepts of equations taught by his teacher. The reason? Noah is blind, and he cannot see the blackboard or read the textbooks like his peers. This leaves him feeling isolated and excluded in a classroom where knowledge is meant to be shared equally. So, what’s the solution? One option could be providing braille books, enabling him to read and follow along as the teacher explains. However, braille books are costly, and Noah, who may have lost his sight later in life, might not even be familiar with braille. Another, seemingly perfect solution, is equipping him with a laptop and digital textbooks that he can access using screen readers. But what happens if the digital content isn’t accessible with these screen readers? Now, consider another scenario. Sophia and her friends are excited to take a crash course on generative AI. But Sophia, who is hearing impaired, finds ...
Read more

Accessibility benefits everybody, not only disabled. So, lets create an inclusive world.

          Accessibility is going to benefit each one of us. It is not only benefit people with disability. Let us first understand that what does the word “Accessibility” means? In simple words, accessibility means able to access. According to W3C,  accessibility  “means that websites, tools, and technologies are designed and developed so that people with disabilities can use them. More specifically, people can: perceive, understand, navigate, interact with the Web and contribute to the Web.”. However, accessibility helps all of us. For example, captions are necessary for the people who are hearing impaired, the same can also benefit for the people who are watching the video in a noisy environment. Similarly, alternative text for the images are important for the people who are visually impaired, but at the same time it will help to the people who are viewing the image with low internet connection. The biggest problem is people don’t consider acces...
Read more

Achieving Accessibility (A11Y): 11 Key Points for Creating Accessible Websites and Software

  Imagine if someone handed you a blank piece of paper to read. How would it feel? An inaccessible website or software is just like that blank paper, perhaps with text that isn't printed properly. It’s frustrating and exclusionary. In my previous articles, I've discussed how making digital products accessible is neither difficult nor expensive. Today, I want to discuss 11 simple tips that can make your website and software accessible to everyone. This is particularly important for developers, startups and entrepreneurs in their early stages, as accessibility should be integrated into planning and development processes right from the start. Think of it like adding ramps to a building—it's much easier to include them in the initial layout. Page Title Page <title> is the first thing that screen reader users listen to while navigating the page. Blind users cannot glance quickly at a web page to see what is it about, so they rely on the page title to get that inf...
Read more