hat do you think of when you think of accessible digital products?

Chances are, you might think of an ugly and bare website - all black-and-white text, not an image in sight.

There’s a terrible myth out there that accessible design is all function and no form. And sadly, there are digital products built on this myth. But it shouldn’t be that way - not by a long shot!

Accessible design can and should be beautiful

Yes, there are ugly and accessible digital products out there - but there are also plenty of ugly and inaccessible digital products out there.

Web design continues to evolve rapidly every year, with designers and developers thinking creatively to bring amazingly beautiful, interactive and accessible digital experiences to the world. Guiding these teams are the WCAG 2.1 Guidelines - an international checklist of features that maximise accessibility for all users.

Accessibility should never be seen as a principle that holds design back. Rather, accessibility is a principle that propels design forward by challenging our preconceptions and allowing everyone to participate equally in our digital world. 

To show just how fun and beautiful accessible design can be, we’ve rounded up four of our favourite examples.

Download the complete Accessibility Checklist

‍

4 examples of beautiful and accessible digital products.

#1 Intopia Digital

Full disclosure: Intopia are good friends of HowToo, having guided us every step of the way in our own accessibility journey. Offering a wide range of services that promote and support accessible digital design, the team at Intopia have applied all their expertise to their own website.

The Intopia website is a fantastic example of beautiful, understated digital design. Intopia have clearly planned for accessibility from day dot, as evidenced by their high-contrast brand colour scheme. This allows Intopia to deliver consistent branding across the site, while also meeting the needs of visually impaired users so seamlessly that most visitors would never notice the intentionality.

Other accessibility features we love include the use of large, serif fonts, effective keyboard navigation and using shape-based highlighting instead of colour-based highlighting.

#2 Study Melbourne: Student Life

If you’re looking for an example of interactivity that’s also highly accessible- look no further than this stunning website by Study Melbourne. Every page is rich, gorgeous and best of all, meets the WCAG 2.1 Level AA standard of digital accessibility.

The Study Melbourne website demonstrates unequivocally that a digital product can be both highly interactive and fully keyboard navigable, with complete screen reader support. Try it for yourself! Work your way through the site using just your Tab and Enter keys on your keyboard to explore how a little planning can result in an interactive and accessible experience.

Other accessibility features that we love to see include the high level of consistency across their use of colours, labels, headings and closed captions.

‍

#3 Xbox Adaptive Controller

Have we surprised you with this one? The Xbox Adaptive Controller isn’t a website, but it is a brilliantly designed, affordable and accessible digital product that opens up a world of possibilities for the use of other digital products.

Around 92% of people with impairments play games, or to put it another way, around one in five people playing games has an impairment. So when Xbox worked with foundation partners and community members to develop and deliver it’s Adaptive Controller, it was a game changer.

The Adaptive Controller features a sleek, on-brand design that looks completely at home next to the Xbox console. The oversize buttons can be easily remapped to a configuration that suits the user. However, the real magic is in the huge number of ports and jacks that it features, allowing users to easily and completely customise it with switches, buttons, joysticks and mounts to match the abilities and strengths of the user.

#4 HowToo

While HowToo’s website is accessible, here we’re going to focus on the HowToo authoring tool. In an industry-first, every eLearning experience created in HowToo can be delivered to WCAG 2.1 Level AA standards, and look stunning every time.

At HowToo, we’ve striven to design accessibility into the very DNA of our product. This means that many of our favourite features are invisible to many of our users, from the way we structure our code to the features we don’t include because they aren’t accessible.

One of the features that assist our learning experiences to be so accessible is our behind-the-scenes Accessibility Checker. When users run the Accessibility Checker, they can instantly see and fix inaccessible elements such as missing text, alt text, captions or transcripts.

Accessible design doesn’t require compromise

As these examples have shown, beautiful, interactive and accessible design is absolutely possible for digital products, and has an incredible power to improve the experiences of an enormous range of people.

‍