Web Accessibility and Tensorflow.JS

Coming from a social science background, I was always interested in technology that improves lives and empowers underrepresented communities. I switched careers into Software Engineering in order to impact more lives through technologies I could help build. Having spent many years doing research on diversity and inclusion, it never crossed my mind to consider people with disabilities until a meeting I had at my previous work. A blind engineer talked about a smart-cane his team had built and how it impacted his life. This was my “aha!” moment and from that fateful day, my mind was set on building accessible applications with an inclusive design.

[Source Images: iStock]

So what is web accessibility and what does it mean for users?

W3C defines web accessibility as designing and building websites, tools, and technologies for people with disabilities. It enables them to perceive, understand, navigate, interact and contribute to the Web. Web accessibility includes all disabilities such as auditory, cognitive, neurological, physical, speech, and visual which can be temporary, permanent, or situational.

For users, having a web-accessible app means:

  • Keyboard-Friendly: this is one of the most important features because many assistive technologies rely on keyboard-only navigation.
  • Alt-Text: using the alt text to describe the image accurately. This feature is especially important for those with visual impairments.
  • Subtitles and transcripts: video contents should include subtitles and online transcriptions to help those with hearing impairments.
  • Color Control — use colors that are compatible and easy to notice such as setting a dark color against a light one. Generally, black text on a white background is the best practice. Practicing smart color choices is important for those with color blindness.
  • Keep your Content Simple — use simple straightforward language. Use headers to structure the content so it is easier to understand and digest. This also improves flow. Include periods in between abbreviations. For instance, using B.Y.O.B (bring your own bottle) instead of BYOB helps screen readers to recognize abbreviations. Additionally, describe your links. Instead of using “click here,” add a detailed description “checkout our game on Youtube and play it here.”

Why is having a web-accessible app or inclusive design important?

As of 2019, more than 20% of people in the United States have some type of disability. According to the American Community Survey, only 21.6% of these disabled users access the web, the other 42.1% are unable to do so. This is a huge segment of the population who are being ignored.

Additionally, 34% of the U.S population is over the age of 50. With an aging population comes more need for the web to be more accessible and intuitive. Web accessibility is not only inclusive but also improves communication and creativity for users with or without a disability.

Research conducted by the governance committee of Section508.gov in the USA revealed that when a company or an organization doesn’t have an accessible website, 71% of people with disabilities leave that website immediately. So it isn’t only a matter of inclusivity, it has solid commercial benefits.

What is the issue with web development?

Although it is illegal by law, many sites and tools are developed with accessibility barriers making them difficult for disabled people to use. Based on a survey conducted by Phenom People, a talent experience management company, “eighty-nine companies in the Fortune 100 failed to meet at least one of six basic standards to make careers websites accessible.” One of the main issues is people creating these products do not take into consideration the needs of the disabled community.

Enhancing accessibility can seem to be a difficult task for many companies as implementing these enhancements needs full commitment from management. When management ensures policies are put in place to make sure websites are accessible and inclusive, developers will comply.

There are one billion-plus people with disabilities around the world, and there is plenty of work to be done. Creating new tools could help integrate a segment of our population that has often been left out of daily life activities and I believe machine learning has a big role to play in this.

From: https://www.tensorflow.org/js

How can Tensorflow.js help with web Accessibility?

Tensorflow.js is an open-source machine learning library for developing, training, and using machine learning models in the browser. The latest developments made in machine learning will make web accessibility simpler for developers.

Here are some of the features I believe Tensorflow.js can offer to make web access more inclusive:

Facial Recognition — Facemesh model can eliminate the use of passwords.

Image Recognition — MobileNet, an image classification model that can be used for detection, embeddings, and segmentations. This model can assist the visually impaired by implementing image recognition.

Language Translation and Captioning — Automated Speech Recognition (ASR) algorithms help create captions and subtitles for videos. This ensures that those with trouble hearing are able to interact with videos. Speech Recognition pre-trained model can help implement this.

Additionally, machine learning could improve real-time translations. Handpose models that detect palm and hand-skeleton can be vital in building a translation machine learning app.

Voice recognition — analyzes video and audio content to transcribing the audio through natural processing.

As you can read from above, machine learning is one of the fastest-growing industries. These features are only a select few that Tensorflow.js has to offer as there will be more features to come in the future.

I have been guilty myself of not making web-accessibility a top-priority during development. However, with this knowledge, I will proceed forward to make my creations all-inclusive. I hope that you will join me

Special thanks to Jennifer Yang, Kirstie Rodriguez, and Dahyun Lee

Software Engineer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store