Annual WebAIM analysis of the top 1,000,000 home pages revealed that around 90% of websites don’t comply with some of the basic web accessibility guidelines. This means that errors were discovered in regards to the text, images, videos, language, links, and other elements found on any of their home pages.
Considering that as much as 15% of the world’s population is diagnosed with some kind of disability, this lack of accessibility is a critical issue that has to be addressed ASAP.
An accessible digital product offers content that can be easily consumed and operated by anyone. Building an accessible solution means you are creating an experience suitable for users who cannot be categorized as “typical” but those who struggle with a type of disability or impairment that prevents them from interacting with your product the way you would expect them to.
However, web accessibility doesn’t only cover permanent or temporary physical constraints. In fact, any digital product that cannot be used as intended (for whatever reason) is considered inaccessible. This could include web content that is not available in users’ area, the font that is too hard to read, elements overlapping on a smaller screen, buttons too small to interact with, and similar issues.
To address these issues, efforts were made to build a set of web accessibility standards, guidelines, and rules that would make digital technology highly inclusive. As a result, several countries have established their own web accessibility laws and regulations, with the most notable ones being the UK’s Equality Act, the US ADA (Americans with Disabilities Act), and the European Accessibility Act established by the EU.
Further worth mentioning are the Web Content Accessibility Guidelines (WCAG) that primarily revolve around 4 main principles which state that accessible content should be: perceivable, operable, understandable, and robust.
Finally, one of the greatest producers of web accessibility standards is The Web Accessibility Initiative (WAI) whose mission is to aid developers in building digital products that will be adapted to the needs of all users. One of their most notable products is the ARIA standard (Accessible Rich Internet Applications) that streamlines the use of apps via assistive technologies.
Accessibility is a particularly important subject in the healthcare industry. This is mainly because the telehealth movement is focused on finding new ways to further improve the opportunities provided by digital health for users who have difficulty operating digital devices due to a permanent or situational disability.
The main idea is to place patients at the heart of care by enabling them to manage all aspects of their health via a website, mobile app, wearable device, and other digital devices to get in touch with healthcare professionals. This would allow them to connect with their physicians and pharmacists easier, keep track of their prescriptions, manage doctor’s appointments, all in an effort to achieve better clinical outcomes.
While most of us associate accessibility in healthcare with opportunities created for people with permanent disabilities in mind (vision, hearing, and speech impairment), the fact is - a person may experience one or multiple disabilities at once that prevent them from using a digital product as it was intended to. With that in mind, when we talk about disabilities, we may refer to ANY of the following:
Users who have poor vision or cannot see at all commonly rely on a braille display, text-to-speech technology, screen magnifier, browser zoom, or high-contrast mode (of the operating system, browser, or website). Most visually impaired combine several of these options at once.
Motor (dexterity) impairments refer to any user who cannot use a mouse or a keyboard but requires a voice-control option or an eye-tracking device. Note that any user can become temporarily physically impaired due to an injury, which is why it is imperative for a digital solution to not rely solely on a pointer-based user interface.
To accommodate people with hearing impairments, it is necessary to include captions and transcripts for every video. This enables them to immerse themselves in the content, sound or no sound. If you think about it, captioned content is the preferred alternative for the majority of users. It is easier to engage with, boosts comprehension, and makes interaction with video content possible at any time.
Cognitive impairments like dyslexia, autism, or ADD may also dictate the approach to design and impose a simpler interface with as few distractions as possible since people with cognitive impairments don’t always understand what is expected of them.
People who are unable to speak are incapable of leveraging voice-controlled devices and require an alternative means of operating.
Firstly, seniors are likely to experience one or more of the previously listed disabilities, since they often come with age. Secondly, they are at a high disadvantage due to their lack of digital literacy skills that prevent them from taking full advantage of (health) technology. Because the desire to embrace telehealth advancements is present among seniors, it is necessary to focus our efforts on developing tools that will boost accessibility and their confidence when it comes to using digital health services.
Socioeconomic hardships are also considered a type of disability as they prevent people who are in a poor financial situation from obtaining up-to-date devices that features the software necessary to run a telehealth application.
It’s crucial to point out that web accessibility provides ease of use for a wider range of users, not just those diagnosed with permanent disabilities. The fact is, the web has become a necessary component in healthcare, entertainment, education, employment, commerce, and many other areas. A web designer’s and developer’s job is to ensure that all users have equal access to the information, regardless of how specific their situation may be.
Most broadly speaking, inclusive websites and apps should leverage (at least) the most common assistive technologies:
The bottom line is, accessibility may just be the key component that converts your leads into users. So what can you do to develop and design a universally accessible product?
Developers have a great responsibility to include web accessibility practices in everything they do, by default. It is of utmost importance for developers to keep in mind the features they plan to build and think how those features will be used by users in different circumstances. It goes without saying that mobile accessibility is imperative, but what else can you take into consideration?
JavaScript is currently leading the way as one of the most popular programming languages, and as such is a building block of many websites, web apps, and mobile applications. However versatile it is, it doesn't come without its caveats. JS can introduce accessibility issues if you don't put in the extra work to make sure every function you implement doesn't impair other elements.
One of the main approaches to keeping accessibility at a high level is to use unobtrusive JavaScript whenever and wherever possible. This way you make sure that all the users get served information on a page regardless of the platform they are on or if they have disabled JS functions or not.
Additionally, think about enabling multi-layer event handlers that would serve as a fail-safe to the standard ones intended for a mouse-operated interaction (eg. mouseout, mouseover, dblcklick). Because some of the users will require different event handlers for the same function, they need to be given alternative access to content via any external input device they are using.
Finally, those who are building React-native apps and want to make them operable by people who use accessibility services should use an accessibility API that works with the platform accessibility API both on iOS and Android devices. An available properties worth giving a second look at include:
Responsiveness has been the buzzword for several years now, meaning that your websites should be designed to adequately resize based on the device people are using to access your pages. For this reason, our advice would be to implement a meta viewport tag that gives browsers instructions on how to scale and control the dimensions of a certain page.
<meta name="viewport" content="width=device-width, initial-scale=1">
But don’t forget that your visually impaired users will want to further zoom in on your content. To let them do so and still be able to interact with the content, set maximum-scale=1 or user-scaleable=no.
Finally, if you opt for a flexible grid, your design will recognize whether the reduced space is due to screen size or because of a greater zoom level. It will appropriately rearrange textual and visual content on the page to keep the usability at the highest level.
Don’t automatically assume that all your users will attempt to access the solution that you build using the latest tech wonder. Apps and software that you build should be compatible with as many iterations of operating systems as possible. Take for instance the Android market statistics that clearly show that only around 20% of users are running their mobile devices on Android 11. More than 30% are still using Android 10, while Android 9.0 Pie is active in 16% of devices, and almost 9% are still running their phones and tablets on 8.1 Oreo.
First to debunk an age-old myth: no, making an accessible website or an app doesn’t mean that it will necessarily be a visually unappealing one. Following the defined universal design standards can help you create an accessible product that is still in line with the company branding, unique, and attractive.
Take into consideration a large number of people who will interact with your content on a touch screen and make the tap triggers large and easy to activate. By bringing the tap size up to 48px and keeping the elements far apart, users are less likely to hit surrounding links by accident. This will produce a more positive experience for everyone, especially users with motor impairments.
Color contrasting refers to the use of shades from the opposing segments of the color wheel, in that way providing enough contrast between different elements. To measure the contrast level, we use the “levels of conformance” grade system and, according to the WCAG 2 standard, the minimum acceptable contrast ratio is 4.5:1. Note that this doesn’t mean that you are limited to the use of only contrasting shades through your website or application. Simply aim to achieve the highest level of contrast in crucial areas (like logos, headlines, and text).
Designing with accessibility in mind requires close cooperation with the content department to ensure that all visual and audio elements come with the corresponding video transcripts and other textual descriptions. As previously mentioned, captioned video proved to be far more engaging and captivating than its non-captioned counterpart, and not just for people with permanent disabilities. Truth be told, users are quite reluctant to play videos with the sound on in the majority of life situations.
Testing to determine whether the product you developed is accessible or not can be performed manually. This would include:
To determine more accurately whether a website or an app meets web accessibility guidelines, developers are advised to scrape the most practical evaluation tools and select the ones that best match the specific project requirements.
It is highly unlikely for you to achieve 100% web accessibility. Unfortunately, some techniques used to address people with one type of disability could make it hard for others to use the app. This means that different accommodations are needed to boost user experience, with accessibility preferences satisfying the needs of a limited number of users. Web accessibility boils down to making the most positive and optimal experience for the broadest user base possible.
Here at Inviggo, we pay close attention to our clients’ and users’ feedback to gain first-hand insight into their challenges. Our experience with building telehealth products enabled us to further recognize the need to follow web accessibility guidelines and are, therefore, ready to tackle any new telehealth challenge that comes our way.
Get this toolkit to guide you through the complex process of evaluating and selecting technology vendors in the health tech sector.