Group Created with Sketch.
Curated Resources

7 Resources to Embody Your Brand Values With Digital Accessibility

At first glance, website accessibility issues like contrast ratios, keyboard functionality, hover states, and other areas of web content accessibility guidelines (WCAG) compliance may feel overly technical and in the weeds. But digital accessibility goes far beyond how a website looks and functions—it’s also a tangible demonstration of your organization’s values and essential to maximizing visibility, reach, and impact. Because, if equity and empathy are important to your brand, it’s hard to demonstrate this if your website isn’t usable by the very people you want to engage or stand with.

For your brand to resonate with audiences, your digital presence should be fully aligned with the values you want to embody. So, rather than looking at WCAG 2.1 guidelines as technical jargon, a legal box to check off, or an added expense in your website redesign, remember that designing for accessibility is about how you show up in the world. After all, your website is probably the most visible ambassador for your brand.

As the lead of Constructive’s engineering team, making sure that we write clean, performant code—all that technical jargon—is a big part of what I do. But our work is always centered on what the experiences we create say about the organizations that we work with and how they engage audiences online. So, whether you’re a nonprofit communications manager with little technical background or an experienced developer, here are some resources that the team and I curated to demystify digital accessibility and deepen your understanding and appreciation of how it can make a difference for your organization.

Abel Thomas, Director of Technology

Accessibility: Usability for Every Ability 

Before covering the best ways to improve digital accessibility, it’s good to start with a primer (or refresher!) on the topic. In documenting their design system, the US Government does an excellent job explaining the fundamentals.

6 Web Accessibility “Quick Wins”

Everybody loves quick wins! Here, developer Phiter Fernandez outlines a few simple and important ways to implement accessibility features, alt text, labels input fields, and more.

The Importance of Alt Text 

Websites are often loaded with images—and they play a crucial part in telling a story. Alt text is an often overlooked part of ensuring that they’re available to everyone, not just sighted users. While time consuming to create for a full website, alt text greatly improves the user experience—and search engine optimization.

Understanding Keyboard Accessibility 

It’s easy to forget that not everyone uses a mouse or trackpad to browse online. Here’s a great overview of the keyboard browsing experience, explaining its importance and the specifics with a focus on designing for people with mobility issues, one hand, no hands, or even those who just have modified keyboards.

Accessible Color Standards [Video]

Accessibility is also important when choosing brand color systems—way before a website is even coded. Una Kravets from Google Chrome Developers breaks down the importance of color contrast and demystifies the color standards required for WCAG A, AA, and AAA compliance

A Beginner’s Guide to HTML Accessibility 

Though backend choices may seem invisible on the frontend, they directly impact your site’s functionality. Deeper into the technical weeds, this guide teaches accessibility concepts at the code level and provides standard keystrokes to optimize the keyboard testing process.

The A11Y Project

Dedicated to digital accessibility for all, longstanding independent group A11Y is one of the best resources for everything from books and podcasts to conferences and meetups in the accessibility design space—both for beginners and dedicated experts.

More Constructively Curated

Transparency and Your Project’s Success: 5 Resources

6 Resources to Turn Your Strategic Plan into Design 

Adopting Digital Design Systems to Strengthen Your Nonprofit’s Brand: 8 Resources 

Copied to clipboard http://...