Accessibility is usability

Blast from the #PatternPast! This article was formerly located on our old WordPress blog. It was originally written by Stacy McAuliffe and published on March 16, 2018.

The power of the web is in its universality. Access by everyone regardless of disability is an essential aspect.

-Tim Berners-Lee, W3C Director and inventor of the World Wide Web

Good design isn’t good enough

Great user experiences don’t just happen; they’re designed, tested and refined with the user in mind. Designers aim to build products that are easy to use and understand. But when our designs neglect accessibility, we’ll always fall short.

Millions of people live with disabilities that affect their use of technology. The goal of software accessibility is to remove barriers and create inclusive product experiences that work for everyone, regardless of physical ability. So, how can we build accessibility into the foundation of our design practice?

Becoming inclusive by design

PatternFly provides Red Hat designers and developers with a set of consistent patterns and visual design elements that can be applied across products. With its guidelines, standards, and code, PatternFly makes it possible to scale usable and consistent design across the entire company.

While PatternFly does offer some accessible components today, the team is doubling down on efforts this year to help make Red Hat products more universally accessible. The first step? Understanding the needs and experiences of users.

Meeting Governor Morehead School

Governor Morehead School (GMS) in Raleigh, North Carolina serves the special needs of visually impaired students. In November of 2017, Red Hatters Jenn Giardino and Sara Chizari from PatternFly and Mark Caron from the customer portal team collaborated along with other Red Hat associates to host a workshop at Red Hat’s Raleigh site, where GMS students used assistive technologies like screen readers to interact with Red Hat products and PatternFly components. The results were illuminating.

“When we put our designs in front of people and observe them, … we learn what we can do to make the designs more usable,” said Jenn. ”Being able to put our UIs in front of these students and watch them interact, we figure out what information they’re trying to get out of the application, and what they’re using to navigate the page.”

It’s information we would never get without the help of the Governor Morehead School. And information that changes the way we think about building truly accessible products.

Challenging our assumptions

“I came in with this assumption that screen reader users would use the tab key on their keyboards to navigate a page.” said Jenn. “And so, if it’s keyboard accessible and everything has a text label, it’s going to be accessible to a screen reader user.”

While keyboard accessibility is still important, and having adequate text for purely visual elements is also crucial, this assumption about how a screen reader user accesses a web page didn’t match what the team observed.

“The screen reader is a layer on top of the application — it provides its own set of keys for interacting with page contents, and its own methods for navigating a page. A screen reader user might start by scanning a list of page headings to get an idea of the overall content of the page. If the user knows they need a link, they’ll pull up the list of page links,” she said. “So it puts huge emphasis on writing semantic HTML and having a solid information architecture. If the HTML elements we choose don’t align with the users’ expectations, we could be hiding huge sections of content from them. We’d never know that if we hadn’t had the opportunity to test it.”

What’s next

Over 10 weeks, Jenn, Mark, and Sara will continue to work with the GMS students to test products and components for accessibility, gaining new and valuable insights from this student community. And the team is committed to expanding their research moving forward.

Like everything Red Hat, PatternFly is an open source project and we encourage everyone to contribute.

To hear more from the Red Hat team about the work being done with GMS, check out Mark Caron’s post on Medium and take a peek at the video from Life at Red Hat.

Have a story of your own? Write with us! Our community thrives on diverse voices — let’s hear yours.