Why Making Design Accessible to Everyone Is Even More Important Now
OutSystems released a new version of our integrated development environment (IDE), Service Studio, at the end of July 2021. Before the release, we’ve shared a month of content on how our User Experience (UX)/ User Interface (UI) Team tackled this project while building and implementing their very own Product Design System to create a delightful experience for all users.
As part of this series, we showed you how we used data to elevate our product’s look and feel, and spoke to our UX/UI Team about design systems in general and the one they helped create at OutSystems, and explained what a UX engineer is and does.
Here, we focus on accessibility when designing a software product.
If you’re reading this you’re probably curious about what accessibility is. In this blog post, we’ll explain why it is even more important now with Covid-19 lockdowns, the accessibility in our tools, and in apps generated with OutSystems.
So, first things first.
What Is Accessibility?
Accessibility is when applications, tools, and technologies are developed and designed to be used by everyone.
This includes people with disabilities, whether they are visual, auditory, speech, physical, cognitive, or neurological, as well as temporary impairments, like a sports injury, age-related limitations like deteriorating eyesight, or even situational limitations like direct sunlight reflecting on a screen. ( Disabled people make up 15% of the global population.)
Because it is important to make the web accessible to all of us, online accessibility laws have been widely adopted across the globe, requiring that businesses, governments, and academic institutions ensure all their websites, applications, and documents are fully accessible.
Why Is Accessibility Even More Important Now With Covid-19?
With the pandemic, the majority of countries were forced to lock down, and businesses and services were forced to adopt an online model as a way to keep business continuity. People with disabilities were disproportionately affected, as challenges included access to information, social distancing, and other recommended guidelines.
Suddenly, during this period, everything had to be done digitally, and this really highlighted the issue.
Things like ordering groceries, paying the bills, or even accessing some health services became a stressful experience for many as websites or apps were not adequately prepared.
In addition to this, a big number (and growing) of companies were forced to adopt remote working, running their operations on digital services and interacting with their workforce using online collaborative tools, which in turn, need to be accessible too.
Now, as vaccines become available a new challenge looms. Many of the websites used to schedule a vaccination online are not screen reader compatible, thus making it nearly impossible for the visually impaired to use them.
Accessibility In Our Tools
There is general agreement that worldwide 8% of men and 0.5% of women have a color vision deficiency. Caused by many factors, this deficiency is the inability to distinguish certain shades of color.
And, as far as types of color blindness, the 8% of color-blind men can be divided approximately into 1% deuteranopes (people with green blindness), 1% protanopes (people with red blindness), 1% protanomalous (people with trouble differentiating between red and green) and 5% deuteranomalous (people green-weak).
OutSystems exists to give every organization the power to innovate through software, by providing a powerful platform where a small development team can build and deploy mission-critical applications. And with great power comes great responsibility. We have to make sure that our tools would be easy to use by anyone.
With our Mac IDE redesign, we carefully selected our color palette to ensure the necessary text contrast ratios and also that a contrast ratio of 3:1 is provided in our icons, as guided by WCAG 2.1 AA.
We used color blindness simulators and conducted tests with some of our very own OutSystems developers, who are color blind, in order to refine and validate. Additionally, system icons convey important information, so we made sure each icon is accompanied by either assistive text or aria-label.
Accessibility In Apps Generated With OutSystems
OutSystems uses visual development which dramatically increases the speed at which applications can be created, and we could see how relevant this is within the Covid context with contract tracing, symptom detection, staff safety, testing locations with accurate information, and now vaccination scheduling applications being created at lightning speed.
It’s therefore crucial that applications that are built with our platform are easily made accessible, and we are taking strides towards that.
To ensure that developing accessible applications with OutSystems is faster, we’ve revisited our UI framework to meet all WCAG 2.1 AA requirements and rules, we reviewed our color palette, and replenished our UI patterns with default compliance for contrast ratio on typographic elements, icons, and content placeholders; semantic tags; pre-configured ARIA roles to work with assistive technology, and built-in keyboard navigation.
We’ve also tested these ready-to-use accessible patterns with a variety of assistive technology, in mobile and desktop devices. We used manual and automated tools for accessibility testing. We want to make sure accessibility testing tools are widely adopted in our apps.
Additionally, we are also providing development guidelines, actions, and documentation to help developers make their content compliant. We created global developer enabled features. All these best practices are documented in the Live Style Guide application to make it easier to share, reuse, and scale accessibility throughout your applications, consistently.
Originally published at https://www.outsystems.com.
