Infosys experts share their views on how digital is significantly impacting enterprises and consumers by redefining experiences, simplifying processes and pushing collaborative innovation to new levels

« PrivacyNext - Privacy Experience for your Tester | Main

Infosys Nia Chatbot Platform and WCAG Compliance

Introduction

How does one design an interface?

When web accessibility by physically challenged people are brought into equation, it brings many parameters into play as that population consists of deaf, dumb, blind, mentally challenged, etc. How do we take care of their needs too while building or maintaining websites or Products? What about the often-forgotten left-handed people?

Will adding read-aloud option in the website say that we are catering to blind people's needs? First, they should be made aware that indeed there is such an option available and where it is available. But unless it becomes a universal guideline and all websites by default have this option, this will lead to the list of challenges already faced by these people as they might observe this only in few websites.

Have you noticed that shirt buttons for ladies and gents are placed differently? Well, what about left-handed people!!! Should there be a different consideration for them, or will this still be fine for them? How do we bring variants within Products by considering this point too? Lots to ponder about but do you think that at least Software Product Companies are spared in this regard. Ever wondered on whether developers take a conscious note while developing digital content to be accessed in digital devices like laptops, tablets, mobiles as by default they are mostly skewed towards right-handed people 😊 There is this classic example of YouTube's videos recorded by left handed people were shown upside down.  

This is where guidelines come to rescue, and we shall see more on it below.

What is Web accessibility?

Web accessibility is providing access to the information available on the internet to people with disabilities. This is applicable to any kind of disability, hearing impairment, visual imparity, speech, cognitive disorder or disabilities caused due to aging factors. In the most generic terms, access will enable them to interact, share, navigate and contribute to the Information Technology available to everyone. People with disability should enjoy equal access to the web and should be given the space to do everything which people without a disability can do.

 

The Web Content Accessibility Guidelines (WCAG) were created by the non-profit World Wide Web Consortium (W3C) and is the most accepted and popularly followed Universal guideline for web accessibility. WCAG consists of a series of guidelines for making web content accessible. WCAG 1.0 was introduced in 1999, and has since been superseded by WCAG 2.0, published in 2008. WCAG 2.0 is organized into four universal design principles and consists of three levels of compliance. A decade later, WCAG 2.1 guidelines were published which had all success criteria of 2.0 and additional ones for mobile accessibility, people with low vision and people with cognitive and learning disabilities.

 

The levels of Compliances are

1)   Level A (Minimum Accessibility Requirements)

2)   Level AA (More Involved Accessibility Requirements)

3)   Level AAA (More Comprehensive Accessibility Requirements)

Even though there is no mandate to adhere to any compliance level, websites that adhere to 'Level AA' are generally considered to be compliant.

The Americans with Disabilities Act (ADA) became law in 1990. The ADA is a Civil rights law that prohibits discrimination against individuals with disabilities in all areas of public life, including jobs, schools, transportation, and all public and private places that are open to the general public.

The Department of Justice (DOJ) looks to the World Wide Web Consortium (W3C) for guidelines to follow regarding how to regulate ADA compliant websites. The W3C has created the Web Accessibility Initiative (WAI) to lead the web to its full potential to be accessible, enabling people with disabilities to participate equally on the web.

There is one more which is 508 Compliance and refers to a Federal law.

One can learn more on the differences among these 3 in this link.

Rest of the World too follow these WCAG guidelines and are at various compliance levels in terms of adoption. As noticed with any other guidelines, this too has a limitation as certain rules are misleading or confusing.

 

Mobile accessibility

There are no separate guidelines for accessing mobile content as most user interface patterns are similar for desktop/laptop and mobile devices but one is supposed to refer to these guidelines.

 

What it is its relevance for Product Companies?

Product Companies focus towards building viable Products that meet Consumer's needs but at the same time remain profitable too. Over a period, CSR (Corporate Social Responsibility) arm turns up and fulfil Social responsibilities too.  But the basic principle should be to see how as an Organization, one can be inclusive in all its communications be it internal or external. Everybody is aware of Success mantra "Customer is King" and efforts are put to make "The King" happy but it's equally important to make internal Customers like Employees happy too.

Product Companies make releases on a periodic basis based on their roadmaps. Their websites are accessible publicly in applicable cases and hence there is default obligations for them also to adhere to these guidelines and add any local flavor (based on cultural differences) to it if possible. If there is any tool which will be used by its Employees to build a Product then, it's imperative that relevant guidelines are followed there too.

 

WCAG Compliance and Infosys Nia Chatbot Platform

Infosys Nia Chatbot Platform helps Enterprises to build Chatbots according to their needs and consists of Chatbot Studio, which is an internal tool used to create and maintain bots, Chatbot Application which is used by end users. Bots can be built in various languages with many front-end channels and can integrate with all back-end applications. It supports building text and voice-based bots.

We make periodic Product releases and are striving to meet success criteria of WCAG 2.1 guidelines which will take care of ADA Compliance.

 

Web accessibility for Bot Studio

Bot Studio is mainly for bot configuration and an admin utility. Will voice based interface be useful in this case? It's better to have this provision at all levels and controlled through parameterization. Assuming that hardly a physically challenged person will be an admin, or a bot designer is again making a mistake of ignoring inclusivity!!!

For making Bot Studio ADA Complaint, we are referring the standard guidelines.

In the previous release 1.7.5.0, we had incorporated the below guidelines:

  •  Resize Text (1.4.4): Text must be able to be resized up to 200% without negatively affecting the ability to read content or use functions. (Level AA)
  • Keyboard (2.1.1): All content and functions on a website must be accessible by keyboard only (i.e. no mouse). (Level A)
  • Focus Visible (2.4.7): Any "user interface control" that receives focus from a keyboard user should indicate that focus on the current selected element (e.g. add a visible border around a text link). (Level AA)


Resize text: 

All studio screens are now responsive up to 200% browser zoom, except 'Decision Tree Hierarchy view'. People with low vision, low-contrast vision, or otherwise less-than-perfect vision can now use zoom in browser to have a better studio experience.

 

The below screenshot is at 200% zoom size. We can see the menu icon at the right side instead of navigation bar. This is how the screens are made responsive.

Resize text.png



 

Keyboard:

Improved user experience by enhancing keyboard accessibility support on all screens. It is now possible to create a bot using keyboard alone without using mouse.

Following options in Studio which earlier used to work on mouse hover have been modified to click event to support keyboard accessibility:

  • User Role dropdown in Navbar
  • Menu in Chat window
  • Bulk Ignore and Bulk Approve dropdown in Review Screen

 

Focus visible:

Any element which receives focus from keyboard is easily recognized with outlines. So, now we can easily understand on which element the current focus is present.

In the below screenshot, we can see focus is present on Home link on the navigation bar.

Focus visible.png


In our latest release 1.8.0.0, we have adhered to the following guidelines.

  • Sensory Characteristics (1.3.3):  Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, size, visual location, orientation, or sound. (Level A)
  • Headings and Labels (2.4.6):  Headings and labels describe topic or purpose. (Level AA)
  • Consistent Navigation (3.2.3): Navigational mechanisms that are repeated on multiple Web pages within a set of Web pages occur in the same relative order each time they are repeated, unless a change is initiated by the user. (Level AA)
  • Consistent Identification (3.2.4) : Components that have the same functionality within a set of Web pages are identified consistently. (Level AA)
  • Error Identification (3.3.1): If an input error is automatically detected, the item that is in error is identified and the error is described to the user in text. (Level A)

 

Sensory characteristics:

Tooltip has been added for all elements to ensure accessibility to information and textual information has been added for production and design environments such that the elements are not reliant on a single sensory ability.

Sensory characteristics.png

 

 

Headings and labels:

Provided clear headings for all the pages in the Studio and provided descriptive help information for better understanding of functionality of any screen.

Headings and labels.png

 

 

Consistent Navigation:

Provided clear and understandable navigation menu throughout the Studio screens. Cancel buttons have been provided to reset form values on the screens.

 

 

 

Consistent navigation:

Provided clear and understandable navigation menu throughout the Studio screens. Cancel buttons have been provided to reset form values on the screens.


Consistent navigation.png

 

Consistent identification:

Studio maintains consistency in icons/elements used for the same functionality at different screens.

 

 Error identification:

Clear and descriptive validation for every form field has been provided. Provided clear identification for required fields for all the forms.


Error identification.png








Web accessibility for Chatbot Application

This is an end user interface wherein configured bot can be accessed. Since this part falls under the purview of Clients who make use of this, they need to take care of compliance in case any default Product offering is customized, or visual elements are built according to their needs.

 

Mobile accessibility

While Studio is accessed via Desktop/Laptop, Bot Application developed can be accessed via mobiles and even an advanced feature available in Studio named, Document Comprehension once configured, made available in Bot Application can be accessed via mobile in an offline mode.


Applicability of guidelines in Studio vs. Application

Should there be differences in the way these guidelines are made use of in studio and application? Yes, as the target audience is different but to avoid the pitfalls, control the functionalities via parameterizations wherever possible.

  1.  A voice-based application is of better usage compared to studio since the number of end users are far more compared to those who develop and maintain bots and would be helpful to get queries answered via voice commands rather than configuring bots via commands which is also complex to achieve.
  2.  Screen zooming or use of colour to highlight action completion will be more useful in application compared to studio.
  3. Keyboard usage would be more in studio compared to application.


Conclusion

Inclusivity needs to become ingrained in everyone's minds and not just in Organization's Vision statements or in Product guidelines portals, so that we become sensitive people and look out for ways to adhere to it in all our acts. As digital adoption is set to grow at an exponential pace soon, more and more adherence to such guidelines would be beneficial to one and all.

With respect to Nia Chatbot Platform, web accessibility is a continuous journey and we will be taking this forward in future releases too.


References

https://adata.org/learn-about-ada

https://www.webfx.com/blog/marketing/what-is-ada-compliance/

read://https_www.searchenginejournal.com/?url=https%3A%2F%2Fwww.searchenginejournal.com%2Fwebsite-accessibility-compliance%2F374878%2F%23close

https://siteimprove.com/en/accessibility/ada-compliance-website/

https://www.ameexusa.com/sites/default/files/users/user467/ADA_v1-White%20paper.pdf

https://www.wuhcag.com/wcag-checklist/

https://mayecreate.com/blog/what-does-ada-compliant-mean/

https://www.digitalauthority.me/resources/ada-compliance-website/

https://ada-compliance.com/

https://www.webfx.com/blog/marketing/what-is-ada-compliance/

https://www.interactiveaccessibility.com/services/ada-compliance

https://www.w3.org/WAI/standards-guidelines/wcag/

https://www.interactiveaccessibility.com/services/508-compliance

https://www.ada.gov/regs2010/2010ADAStandards/Guidance2010ADAstandards.htm

https://www.w3.org/WAI/standards-guidelines/mobile/#:~:text=There%20are%20not%20separate%20guidelines,WAI%20Guidelines%20Apply%20to%20Mobile

https://www.w3.org/TR/mobile-accessibility-mapping/

https://vimm.com/accessibility-ada-wcag-2-0-508-refresh-mean/

https://www.w3.org/TR/WCAG20/

https://www.webfx.com/web-design/ada-vs-508-compliance.html/

https://www.w3.org/WAI/standards-guidelines/wcag/new-in-21/ 


Authors


Kavitha Sundararajan

Kavitha Sundararajan, Senior Consultant working with iCETS Unit especially in Large Transformation Deals team and handles multiple activities like interactions with various stakeholders, developing marketing Strategies and building Product roadmaps.


Shazia Bavalla

Shazia Bavalla, Technology Analyst, was a full stack developer for Infosys Nia Chatbot Platform, involved in developing many features in the platform. 

Post a comment

(If you haven't left a comment here before, you may need to be approved by the site owner before your comment will appear. Until then, it won't appear on the entry. Thanks for waiting.)

Please key in the two words you see in the box to validate your identity as an authentic user and reduce spam.