The post Accessible Digital Ready Technology — Future of Work appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

The Product Narratives were developed by the Clinton Health Access Initiative (CHAI) under the AT2030 programme in support of the ATscale Strategy.

Today, over 1 billion people require Assistive Technology (AT) to achieve their full potential, but 90% do not have access to the AT that they need. The report provides market landscapes of 3 areas of digital AT: mobile phones; screen readers; and augmentative and alternative communication (AAC) devices.

The rate of adoption of the digital AT ecosystem is supported by four cross-cutting enablers:

• Awareness of digital AT and its accessibility by users, developers, suppliers, providers, and policymakers;
• Availability of mobile network and internet connectivity;
• The application of universal design and inclusion of accessibility features; and
• Appropriate training in digital AT.

A common set of recommendations focused on improving access to the components and enablers of the digital AT ecosystem emerge from the individual product landscapes is included in this document These recommendations can be viewed as high priority areas for improving access to digital AT in low and middle-income countries.

They include:

• Develop and adopt policies, including legislation, regulations, minimum product standards, and guidelines to support accessibility and uptake of digital AT at global and country levels.
• Support Low and middle-income country governments to increase awareness of digital AT by including digital AT products, such as smartphones and AAC devices, on national assistive product lists.
• Support innovating financing schemes or negotiate pricing agreements to reduce the cost of digital AT to end users.
• Increase availability of training programmes for users, suppliers, and service providers on the importance of digital AT and digital literacy skills.

The Product Narratives will be foundational to identify and invest in interventions required to shape markets and overcome supply and demand-side barriers for priority AT. They are also a key element of the AT2030 methodology helping to identify opportunities for AT2030 and others to test innovative models of what works to improve access to AT with the potential to reach scale, through innovative products, new service delivery models and local capacity.

Download the complete report here

For accessible versions of the report please visit: Product Narrative: Digital Assistive Technology | AT2030 Programme

The post Product Narrative: A Market Landscape and Strategic Approach to Increasing Access to Digital Assistive Technology in Low- and Middle- Income Countries appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Interactions on the Web are getting more engaging and dynamic these days. In this modern web era, UI designers are coming up with rich interactions for users where information is available to them without requiring the page getting reloaded. Gone are the days where users clicked on a link or button and web page had to be reloaded to show the updated content. Now users click on a link  or button and additional content is available for users then and there!

WAI ARIA comes to the rescue!

WAI ARIA provides  a wide range of roles, states and properties which can be utilized to make the rich web interactions available for persons with disabilities. Assistive technology is used by persons with disabilities and to make the information related to dynamic and rich interactions understandable, it is required to convey the information semantically.

Semantics is used to convey information related to a user interface element’s role, states and properties that a user can understand. For example, if a <div> element is used to structure a button then it needs a role of “button” for a user to understand that it is a button that can be clicked. Next it needs a label (property) to understand what is the purpose of the button. If clicking on the button expands or collapses the content then it needs a state to convey this information.

In this post, we will be talking about one of the ARIA state aria-expanded!

aria-expanded is a WAI-ARIA state which is used to show the expandable and collapsible content. It is used to indicate that the element for which it is specified or another element that it controls is expandable or collapsible. As per the ARIA specification, aria-expanded has the following values:

• true: indicates that the element is expanded
• False: indicates that the element is collapsed
• undefined (default): indicates that the element is neither expanded or collapsed

Some of the roles for which aria-expanded state can be specified include button, Link, combobox etc.

Tip: All the leading browsers and screen reader combinations include support for aria-expanded!

Good code example of aria-expanded

On the BarrierBreak website, we have a navigation menu available in responsive mode. The menu is structured using a button and users can expand the menu to view the list of our services. Below code demonstrates how aria-expanded can be used to convey the menu button’s state for screen reader users:

<button id=”opennav” class=”navbar-toggler pull-xs-right mobile-menu col-style-1 active” type=”button” data-toggle=”collapse” data-target=”#mainNavbarCollapse” aria-expanded=”true” aria-label=”Site Navigation Menu”>

<i class=”vertical-align” aria-hidden=”true”></i>

</button>

Bad Code example of aria-expanded

If a page contains a link which opens in a new window, aria-expanded is specified for the link, which is not required. As aria-expanded defines the state of an element and in the case of links opening a new window the state of the link is not required to be conveyed to users. Below is a code example depicting incorrect use of aria-expanded:

<a href=”https://www.barrierbreak.com/accessibility-barrierbreak/” target=”_blank” aria-expanded=”false”>About Us</a>

Adding aria-expanded to the code is not rocket science! Yes, that’s correct but it needs to be implemented correctly. Check it by inspecting the code and most importantly get it tested by persons with disabilities using assistive technology to ensure that is done right!

Want to know more about our accessibility testing or our accessibility subject matter expert services? get in touch with us at sales@barrierbreak.com or Book an appointment with our account management team and we will be happy to help you!

The post aria-expanded: the Good and the Bad appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Dragon is Voice based software so basically, we must provide voice commands to perform various keyboard and mouse interaction.

To know more information on How to start using dragon you can refer to Using Dragon Naturally Speaking to access a website blog.

If you are working in accessibility firm you often come across the need to test the web page using speech recognition tools like dragon. In this blog we will explore some ways of how to navigate and activate some web page elements.

How do we start?

• Check the website for navigation by voice.
• See if you can navigate through all the links/buttons/interactive elements and check if you can activate them.

Tip:
While navigating website to click a button or any other interactive element, say its name preceded by “click”.

For navigating and clicking different web page elements you can either make use of Keyboard interaction command or mouse interaction commands.

Voice Commands for Keyboard interaction:

The following table lists Voice commands for keyboard interaction testing:

Voice Commands for Mouse interaction:

The following table lists Voice commands for Mouse interaction testing:

These are the few basic commands, as you continue testing using Dragon you can explore more commands according to the interactive elements available on the page.

So, let’s get started by testing a page using some of the commands.

Open a web page using Dragon and navigate the page using Tab voice command to check if the interactive elements are keyboard accessible or not? Also check if a particular element is keyboard accessible ,the focus indicator is visible to users so that user can recognize the user’s current position .

Now let’s try some of the voice commands for keyboard and mouse interaction that we learnt in the above table.

Say Click <link name>, for example to activate Home link say click Home.

Say MouseGrid, Dragon will overlay a grid on the screen

Now let’s try the Mouse Grid, using the following commands:

1. MouseGrid
2. < Number of Grid > – Say the number you want to focus on

Repeat the above steps till you are able to  click the required link or button

We have learnt navigating and activation of various web page elements in this blog. In the forthcoming blog we will learn about the various commands to interact with form elements.

Having said that Dragon has a whole list of commands, you need to try them by yourself to explore more and more voice commands and getting well versed with it.

Do let us know what new things you learned with dragon and share your experiences in the comment section.

The post Cheat Sheet – Dragon Naturally Speaking Commands for Web Testing appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

But it was like a dream come true when I began to work with screen readers. Yes screen readers do not rely on mouse. I could perform all activities only by my keyboard that someone could do with a mouse. Isn’t that cool??

Though at first I found it difficult and tiring job as I had to navigate to entire page with the arrow keys. But as I explored more I found many keystrokes that helped in scanning through a page through heading, quickly jumping to links, finding the form field etc.

Now Screen readers such as NVDA, JAWS and many more is been a part of my day to day job. But sometimes I too get confused with some of the keystrokes. So I always keep a Cheat sheet for screen reader commands handy with me!

So I thought of sharing it with the community so that users can access a webpage with ease.

Navigating Using both Jaws and NVDA:

The following table lists JAWS and NVDA commands for accessing website:

Keystrokes to read content:

Now let’s find out the commands for navigating with tables!

Keystrokes to read Table:

The following table lists JAWS and NVDA commands for reading Tables:

Now let’s find out the commands for interacting with Web forms!

Keystrokes to interact with Form Fields:

The following table lists JAWS and NVDA commands for reading Web forms:

Tip : Instead of remembering multiple keystrokes for various elements in JAWS, there is one master keystroke “Insert+F3”.

Hope this cheatsheet will make your life easier  and do share your experiences of using the above commands!!

The post Cheat Sheet – Screen Reader Commands for JAWS, NVDA – Web appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Thankfully assistive technology exists to help low vision users browse the web irrespective of the font size, color contrast etc. used on different web pages. Screen magnification software is available for different operating systems to help low vision users to enlarge the computer screen to access and explore any website on their own. Among different screen magnifiers that I have tried over the years, such as Magic, Windows in-built screen magnifier etc. I personally use “ZoomText”, a useful and easy to access screen magnifier cum screen reader software.

ZoomText is basically an integrated computer software program for visually impaired persons specially designed for low vision persons. It is developed by Ai Squared and available on Windows 7/8/10 versions as well as on MAC. It is available in two editions:

• ZoomText magnifier
• ZoomText magnifier/reader which includes a built-in screen reader.

For the purpose of this blog, I will be working with ZoomText 2018 version with Windows 10 operating system.

I prefer to use ZoomText features with the following settings:

• As I have 60% vision impairment, I prefer to access computer on 4x zoom level because I can read, scroll and navigate through the screen easily at this level.
• The toolbar has a checkbox below “zoom level” to switch between current zoom level and 1x view without closing any application which helps me to save time while browsing the web.

I like to use large yellow pointer scheme, green circle cursor scheme and thin red rectangle focus scheme which helps me know where my focus is and to avoid losing focus.

Now that we have explored various features of ZoomText, let’s move ahead and find out about different command keys available for ZoomText. ZoomText has different command keys which are easy to learn and are quite handy for browsing any webpage with a keyboard.

Hotkeys and their functions!

Let’s go through some basic ZoomText hotkeys:

Tip: Click on “ZoomText” application menu button and then select “command keys” to activate ZoomText command keys window!

ZoomText with its variety of features is helping visually impaired persons in performing various tasks on the web easily and comfortably with lesser strain on the eyes. It helps users to navigate interactive elements like links and buttons quickly on a webpage, fill an online form, to send email, to view text displayed using images clearly and many more.

Along with all good features stated above there are couple of limitations that I have come across, which are listed below.

• Sometimes user loses focus while navigating with a keyboard.
• I don’t find its panning to be smooth as compared to Windows in-built magnifier.

Even though ZoomText has several features and it helps low vision users browse the web easily, in few of the situations stated below, I find it difficult to browse the information on web:

• Tooltips or popovers displayed when users hover over an element with a mouse are difficult to read because they tend to disappear when users try to move their mouse pointer over them in order to read the information as the hover is removed.
• Dynamically updating content when a link or button is clicked.
• Content displayed using poor contrast between foreground text, icons, graphs or charts with their background.
• Small size font used to display text created as an image.

I have used ZoomText on both; Windows and MAC and I find ZoomText on MAC has a better visual experience as compared to Windows in terms of clarity and brightness!

After all it can be said that assistive technology software like ZoomText makes browsing websites more easy, comfortable and quick for low vision users. Having worked with different screen magnifiers, my personal pick is ZoomText on a MAC device that has a handy interface, clear visual effect and a variety of useful features! Do share your experience if you have used ZoomText.

The post How can low vision users browse the web using ZoomText? appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Having worked with multiple screen readers over the years has always excited me as it gives me one more option to explore. Especially screen readers that are bundled with the operating system as we do not have to install additional software in order to use our computer.

In the past, have already tried my hands with VoiceOver on Mac, ChromeVox on Chrome Book, TalkBack on Android and VoiceOver on an iPhone, so decided to try my hands on Narrator for Windows.

Let’s start with the basics of Narrator.

Narrator Basics

Press Windows Logo key + Control + Enter to turn Narrator on and off!

As soon as we launch Narrator, the QuickStart guide begins. The purpose of QuickStart is to help users learn basics of Narrator quickly. This is certainly a good-to-have feature when you are learning Narrator but later on it is something that users will get annoyed with. Microsoft has done the right thing by providing users with an option to prevent it from starting automatically each time Narrator is launched.

Simply select the checkbox “Don’t show this guide again” to prevent the QuickStart guide from starting automatically. One can turn it back on by selecting the “Learn Narrator basics with QuickStart” link available in Narrator Settings.

Just like any other screen reader, Narrator also has a key assigned to it which is referred to as Narrator key”. In fact, Narrator has two keys!

By default, both Caps lock and Insert keys function as Narrator keys. We can change the Narrator key any time from the Narrator Settings.

We can also lock the Narrator key so we do not have to press it for every keyboard shortcut!

Press Caps lock + Z to lock the Narrator key.

Tip: Press Ctrl key to silence Narrator temporarily.

The following table lists few of the basic Narrator commands for accessing information:

Tip: Press Caps lock + F2 to show the commands for interacting with the current item!

Having learnt the basic commands of Narrator, let’s now move ahead and find out how to browse the web using Narrator.

Narrator works pretty well with Microsoft’s Edge browser. So let’s get started!

Reading web pages

By default, Narrator switches to Scan mode while reading web pages using Edge. One can toggle Scan mode On/Off by pressing Caps lock + Spacebar in any application.

Narrator remembers the previously used Scan mode setting for an application and switches to it when you launch the application again. For edit boxes on the web, Scan mode is turned off automatically to help users type the text with ease.

Another important option that Narrator offers to its users is to work with different views. There are 11 views that users can chose from:

• Items
• Characters
• Words
• Lines
• Paragraphs
• Headings
• Links
• Form fields
• Tables
• Landmarks
• Suggestions

To cycle through different Narrator views press Caps lock + Up Arrow or Caps lock + Down Arrow

Switching between different views is especially helpful if you are using Narrator on a touch screen device. Yes that’s right, Narrator also supports touch screen gestures!

Along with reading text, Narrator identifies different web page elements, such as headings, lists, links, images, tables, form fields, etc. to help users access and interpret the information with ease. The following table lists down the commands to access different web page elements.

Apart from the above one can press number keys 1 to 9 on the Numeric row to jump to the headings at different levels on a web page. Yes, that’s correct 1 to 9 headings! Narrator gives options to jump to headings at level 7, 8 and 9 which are not commonly used on the web.

Just like any other screen reader, Narrator also provides users with several commands for accessing tabular information. So let’s find out the commands for accessing tables using Narrator.

Reading tables with Narrator

Tip: Press Caps lock + Ctrl + F to find text on a web page!

All in all Narrator has matured in to a useful screen reader option for users with visual impairments and is certainly a useful option not only to browse the web but also test web pages for accessibility!

The post Browsing the web using Narrator appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Being an equal opportunity employer ourselves and with approx. 65% of our staff comprising of persons with different types of impairments, procuring any solution for our offices has always been an interesting task. We have employees with wide range of impairments from hard-of-hearing to deaf, low vision to blind, as well as people with mobility and learning impairments. We take special care to ensure everything that we procure is inclusive to all and it was no different when we decided to procure a Biometric Time & Attendance System.

A Biometric Time & Attendance System is used across offices to login an employee’s in, out time and manage attendance as well as leaves etc.

We started with checking out different biometric systems and analyzed them for the modes of input to how the output is rendered. While different systems were analyzed, we involved our staff members with different types of impairments in the demonstration session to try out the system to make sure that we procured the system that will work for all the employees.

We finally decided to go with Biomax – Biometric Time & Attendance System to be installed at our different offices!

A lot of research and analysis was put in in procuring the system so we decided to share the learnings with the community at large through this post!

In this blog post, we’ll be discussing what all points need to be considered while procuring a Biometric Time & Attendance system that will be accessible for all the employees.

A Biometric Time & Attendance system usually comprises of:

• A scanner to take the finger impression
• A keypad to enter the password,
• Display screen showing the output and
• A punching card

Checklist before buying a biometric machine:

• Does the machine provide audio feedback for visual information displayed on the screen?
• Is there a dot on number “5” of the keypad to orient visually impaired people?
• Are textual and visual alerts used to supplement information displayed using color alone??

Audio feedback, dot on number “5”   as well as supplementing color with textual and visual alerts will aid your visually impaired employees use the machine independently!

• Does the machine provide textual messages for each sound alert?

This is required to assist employees with hearing impairments as they can follow the textual message and use the machine independently!

• Check if successful and unsuccessful attempts are indicated through different colors, i.e. green for a successful attempt and red for an unsuccessful attempt.

This will help employees with learning impairments quickly understand the feedback!

• Check if the machine offers more than one method of input, such as:
  • Placing the finger on the scanner
  • Type using the keypad or
  • Punch a card

This will aid employees with mobility impairments and even those with dry fingers!

Hope the above points will help many organizations in procuring accessible Biometric Time & Attendance Systems for their employees!

Do share how your organization has addressed accessibility in attendance systems.

The post What Equal Opportunity Employers should look for in a Biometric Time & Attendance System? appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Alex has a love for numbers and finding answers through data. We were studying economics at the same university. One day, I noticed this guy talking away to his computer and not really using the keyboard. It got me intrigued. As we became friends, I got to know that Alex had very little mobility in his arms and he was using his speech to control the computer!

Alex uses Dragon Naturally Speaking and he makes it feel so simple and easy, that I just had to learn it.

So, let’s explore how Dragon Naturally Speaking works on the Web.

Dragon Works with multiple browsers, for the purpose of this blog we will be working with Internet Explorer.

Whenever we launch a browser for the first time after installing Dragon NaturallySpeaking, a prompt appears stating to install Dragon Web Extension. It will enable Commands that allow you to click Web page elements, such as buttons and links, navigate as well as access all the content and functionalities.

Let’s start with opening the browser, to open the browser give the command Open Internet Explorer. Now that we have opened the browser, let’s go ahead and open a website and say the following commands:

1. Go to the Address Bar.
2. Dictate the Web address. (For example, www.barrierbreak.com)
3. Go.

Now to navigate through the page, whether it is to a link, button or form controls, use the following commands

• Tab – To navigate from one element to another
• Click < link name > – To directly activate a link
• Page Up or Page Down – To go up and down a page

Tip:
If the computer is idle for some time, Dragon will go to sleep, give the command “Wake up” and Dragon will be ready to go!

So want to have some fun, find a few more Dragon Voice Commands in the table below:

Can we give mouse commands using Dragon? Yes, we can!

Let’s understand how Dragon uses a concept called the MouseGrid before we actually try it. The MouseGrid breaks up the screen into a transparent three-by-three grid over the screen with the sections numbered one through nine. Notice, that each grid has been assigned a number.

Now let’s try the Mouse Grid, using the following commands:

1. MouseGrid
2. < Number of Grid > – Say the number you want to focus on

You can repeat the process as many times as you need. When the grid area becomes too small to display numbers, you will be able to click the required link or button.

When the MouseGrid is enabled, we can use voice command “Click” to restrict the mouse movement and activate the element.

Using the MouseGrid, we can also access elements on a page that cannot be focused using the Tab command.

Navigating a web page using Mouse Grid is a tedious process but fun to perform!

Why don’t you give it a try and share your views on using speech recognition!

The post Using Dragon Naturally Speaking to access a website appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.

Shilpi Kapoor, Founder of Barrierbreak quotes, “Our innovation team is actively involved in designing new ways to find solutions to the various challenges that people with disabilities are facing and are now focusing on AI (Artificial Intelligence) and ML (Machine Learning) to improve the lives of people with disabilities. 6 by 6 app aims to make life more easier and independent for people with visual impairment. Its available for free and includes 3 tools – currency detector, light detector and magnifier. Like every startup we look forward for your feedback to better the experience.”

The 1st release of 6 by 6 app includes 3 tools:

Currency Detector

Finding it difficult to identify whether you have a 10, 50, 100 or 500 rupee note? Here is the currency detector for you. The app 6 by 6 has been specially designed for people with visual impairment to help them detect currency. The app currently supports Indian Rupee. Follow these steps to help you better currency detection:

• Hold the Currency between 5-6 inches from the Phone.
• Hold the currency in your hand, holding the note open works well, you can also hold it in your hand or place it on a surface. Why don’t you give it a try!
• Tap on the screen to get an accurate prediction.

Light Detector

The light detector feature of 6 by 6, helps you know whether the light is on in the room or not. It helps you identify the intensity of light around you with a single tap on your mobile.  If you are close to the light source, the phone will vibrate. Ensure that you do not cover the proximity sensor located at the top of your device (near the front camera).

Magnifier

Do you find it difficult to read the small print of a menu in a restuarant or the price tag of a product in a shop? Turn your mobile into a magnifier with the help of 6 by 6. Select the Magnifier option, zoom in and magnify by just extending the slider all the way to the right. Its that simple! Tap on the Freeze button to get a snapshot image of the currently focused camera output.

Simple and easy to use, download the 6 by 6 app today and try out these amazing features.

Send us your feedback or email us at 6by6@barrierbreak.com with suggestion so we can improve the experience for you.

The post Launch of 6 by 6 – A toolkit of solutions for the blind and visually impaired people appeared first on Leader in Offshore Accessibility Testing | Section 508 Compliance | WCAG Conformance | BarrierBreak.