Xpanxion - Techvision : One of its kind Collaboration for Digital Inclusion!! #GAAD

Xpanxion - Techvision : One of its kind Collaboration for Digital Inclusion!! #GAAD

Xpanxion - Techvision : One of its kind Collaboration for
Digital Inclusion!! #GAAD

On Thursday, May 18 2017, the SRC team
(that is working on Accessibility projects) from Xpanxion visited Techvision
office to get better insights into the way Assistive Technology is used to find
Accessibility issues. The occasion was Global Accessibility Awareness Day.
Every year third Thursday of month of May is celebrated as the Global
Accessibility Awareness Day. So this was the perfect moment to get deeper
insights into Accessibility and share Accessibility knowledge to have the
passion instilled among the developer and tester community.

Techvision is currently training a couple
of BCA (Bachelor of Computer Applications) second year students on
Accessibility. These students along with Siddhant (Cofounder-Techvision)
demonstrated screen reader software like JAWS and NVDA on Windows OS along with
Voice Over on iPhone.

Welcome and brief round of introduction

In all 6 members had arrived from Xpanxion
team which included Pravin Labade (Program Manager), Mukesh Deshmukh (Associate
Leader-QA), Deepali Kakade (QA), Shivam Kataria (QA), Shilpa Sarkar (QA) and Niraj
Chavan (UI Engineer). Everyone got introduced to one another including Krishna
Brahmakshatriya and Gaurav Ahir (visually challenged students) who are being
trained by Techvision on Accessibility development and testing.

Accessibility Vs Assistive Technology

Soon after the round of introductions, Techvision
team started the session. Screen reader was compared with wheel chairs to
explain the concept of Assistive Technology. On the other hand, user interface
of applications was compared with buildings to explain Accessibility. Following
table can clarify what was covered.

Type of challenge

Assistive Device/Technology

Accessibility Implications

Vision Impairment (Complete blindness)

Screen reader

User Interface of applications (mobile, desktop,
web)

Physical impairment (motor impairment)

Wheel Chairs

Buildings, Platforms, Pavements, etc

Understanding Screen Reader (live demonstration)

Later NVDA (Non-Visual Desktop Access) and
JAWS (Job Access With Speech) screen reader was demonstrated. Visitors were
explained the following.

  • How a screen reader identifies user interface controls?

  • Number of parameters that are conveyed by a screen reader regarding a focused control. Eg. control type, control name, state of control and added description of control.

  • How screen reader software relies on keyboard focus to relay out information.

  • How to access information that is not navigable by keyboard alone using NVDA as well as JAWS.

After demonstrating the desktop based
screen reader software, Xpanxion team was shown smart phone based screen
reader. Voice Over screen reader on iPhone was used for this demonstration. One
of the Xpanxion team member was given a smart phone with Voice Over service
enabled to type on screen. The volunteer was finding it difficult to type but
still managed it with multiple taps.

Then the Screen Curtain feature of Voice
Over was enabled to black out the screen. Well, this feature doesn't turn off
the screen but as a completely blind doesn't need a screen, such a user has an
option to dim the screen and save on battery usage. With this option enabled,
the volunteer was directly put in the shoes of the end user. He was forced to
first touch and explore the screen to find the letter he had to type. It was
thus understood that touch, explore and double-tap to interact was the way to
interact with smart phones.

How to test a web page for accessibility issues (Live
Demonstrations)

Importance of Page Title and Page Structure for
Accessibility

Xpanxion team were then shown how JAWS is
used to check web page accessibility. Krishna showed a registration page of a
well-known ticket booking website where it was difficult for him to even find
the main content area where the registration form was present. Krishna
explained that for a screen reader user whenever a page first loads in browser,
there are three options available to quickly find the main content.

  1. Find a heading level 1 on the page which is expected to be at beginning of main content.

  2. Find landmark regions on the page that identify main landmark region.

  3. Find "Skip to main content" link at top of the web page which enables jumping to main content of the page.

The web page that Krishna demonstrated
didn't have any of the above mechanisms to find the main content.

Additionally, all the web pages on that
website had same page title. Siddhant and Krishna together explained how page
title plays an important role in maintaining accessibility. Care should be taken
that every page within a website must have a unique page title.

Importance of Custom Widget Accessibility within Forms

It was then Gaurav who drew attention of
everyone present as he showed another web page which was accessible as far as
page title and page structure are considered. But the same page had issue with
widgets used in forms. This was another privately run web application that
allows end users to rent out or sell property. Visitors were shown following
issues.

  • A link didn't act like a link (visit a web page). Instead it was acting like a popup button (showed a list of popup options). Of course the control type conveyed was incorrect.

  • Additionally, the options within the popup weren't keyboard accessible. Even these options didn't convey the correct role to screen reader.

It was explained that how web developers
make use of existing HTML controls and build custom widgets. In the process,
they forget to convey the same meaning to people using Assistive Technologies.

Siddhant then demonstrated an offline
example of custom checkbox widget which made use of tick mark and cross mark
images to denote checked and unchecked state respectively. It was shown how
making use of proper ARIA attributes takes care of such scenarios and gives
screen reader users the same experience that is given to sighted users.

Accessibility of sliders on Desktop and Touch Screen
Devices

When it came to testing slider, a page was
seemingly accessible as the slider didn't play with the keyboard focus but kept
playing with the position of the slide being displayed. A screen reader was
able to simply read the slides as sequential pieces of content. But when it
came to testing the same slider on a touch screen device, trying to touch and
explore content within a slide was extremely difficult. As an attempt was made
by Siddhant to read content of first slide, the slide beneath the exploring
finger changed and didn't give him enough time to read the content of the
displayed slide. Siddhant informed that Accessible Design involves considering
all types of input and output mechanisms. It is necessary for widgets like
sliders to have facility to stop or pause the content so that a screen reader
user gets enough time to understand the content.

Take-Away

At end of session, everyone had a lot to
learn. Pravin and Mukesh asked quite a few questions and also shared their
experiences. With facts coming forward from these interactions, it was
understood that there is a huge potential market out there that is isn't yet
tapped. E-commerce, E-banking, E-governance and many more applications have
still a larger user base to reach out to.

The interaction was fruitful and both
Xpanxion and Techvision now aim at taking Accessibility to next level. Not just
talk about how important it is but also ensure that it is implemented in live
projects. After all, Dnyaneshwar Nerkar (Cofounder-Techvision) quotes
"Accessibility is an opportunity for the management, developer and tester
to contribute to the society sitting at the desk and doing your job with
additional care."