Disclaimer: These are tips and suggestions around best practices for accessible in-app communication—every in-app message requires proper configuration to ensure accessibility standards are met.
Pendo has been hard at work over the past year investing resources in accessibility features in order to give our customers the tools they need to build accessible in-app communication. We’ve focused on accessibility features for our web-based guides and the Resource Center, so that our customers are able to make their own products more accessible for their end users.
After months of working to build and refine our web accessibility features, we’ve learned a lot about what it takes to build accessible in-app communication.
What is content accessibility?
At a high level, web accessibility means that “websites, tools, and technologies are designed and developed so that people with disabilities can use them.” It means people of all abilities can understand, navigate, interact with, and contribute to the web.
By extension, content accessibility means that the messages you send to users meet these same principles—to help ensure that your content is accessible to everyone, regardless of ability.
Accessibility is a continuous journey; industry guidelines regularly change and improve just as the tools and opportunities to build out accessible content become more robust. Creators and owners of digital products and services would be well-served to embark on this journey with an understanding that accessibility efforts should be ongoing. In order to empower users to fully engage with and take advantage of your product or service, it’s important to regularly evaluate and improve your content, with the goal of empowering every user to fully engage.
In-app communication tools (like those that allow you to create in-app guides) serve as an extension of your product. So, it is crucial to invest in a tool that enables your teams to easily and consistently create accessible in-app content and curate the best possible experience for all users. Wondering what you should look for in an in-app communication provider? Let’s break it down.
Best practices for in-app content accessibility fall into two main categories: What your guide provider offers automatically, and what your team can configure during the guide building process.
1. Guide provider requirements
Let’s start with the requirements you should expect your in-app guidance provider to have invested in on the backend in order to automatically create a more accessible in-app content experience.
Accessible code framework: The underlying code an in-app message is built on needs to be aligned with accessibility standards. There are certain requirements for grouping, labeling, and focus that cannot be fixed by an end user if they aren’t in place from the start.
Tools can be designed improperly, requiring someone utilizing assistive technology (such as a screen reader) to navigate past your entire app before they are able to interact with a guide. To fix this, your own engineers would have to build accessible code from scratch to compensate for the vendor not meeting requirements natively.
The ability to support multiple types of content: Different types of content within your in-app message are governed by different accessibility guidelines. Your guide provider should provide accessible-aligned code to support text, images, video, and a range of poll responses.
Keyboard navigation: Being able to smoothly navigate in-app messages with keyboard navigation (rather than touching a screen or using a mouse) is a crucial component of content accessibility, but is not something that every in-app communications provider offers natively. Proper keyboard navigation captures focus on the right elements in the right order within the in-app message itself, so a user can tab through the message, reminder, or poll properly. Having the framework to do this—and the configuration capabilities to turn it on—is extremely important.
Image scaling and page zoom capabilities: In-app guide content should be scalable as users zoom (Web Content Accessibility Guidelines specify at least 200%). Underlying code needs to support image scaling and dynamically resizing components based on zoom. If not, the content may not meet accessibility guidelines or will, quite plainly, just look bad. Without these capabilities, teams may need to use engineering resources to build multiple guides with different proportions.
2. Guide building capabilities
Next, let’s break down the capabilities your in-app communication provider should offer that will give your teams the tools they need to build accessible in-app content.
Add descriptive labels: There are two types of descriptive labels that can be added to an in-app message to help screen readers communicate the message properly to users: Alt Text and ARIA labels. Your in-app communication provider should make these descriptive labels available so that your team can utilize them as they create in-app messages.
Turn on autofocus: Autofocus allows an author to specify that a particular element should automatically take focus when the in-app message is displayed. For the best guide experience, in-app messages should have “autofocus” turned on (provided your in-app guidance provider gives you this option). Autofocus on a guide step traps focus for assistive technology until the message is dismissed. By turning this on for in-app messages you can ensure that the user is seeing the right information, and dismissing it only once they’ve reviewed it.
Check your color contrast ratio: WCAG provides a standard for the color contrast of guide elements. Sufficiently contrasted colors make it easier for assistive technologies to distinguish between the elements of an in-app message.
Use badge-activated messages (when you can): In-app messages that are activated by clicking a badge are easier for assistive technologies to register than automatic pop-ups or messages targeted to an element on a page, because they give the user the option to trigger them or not. Whenever possible, place such messages in line with the rest of your app code to ensure that the badge can be tabbed to in logical order with keyboard navigation and not loaded at the end of the page.
Accessibility best practices
Investing in an in-app guidance strategy is crucial for driving adoption, user satisfaction, and effective use. However, unless your communication is accessible to all users, you risk excluding important members of your user community.
Here are a few accessibility best practices we’ve found helpful at Pendo:
- Establish your own internal accessibility best practices for your designers and content creators
- Build accessible themes, components, and layouts—and enforce their use
- Test communications and guides using screen readers and audit tools in preview and staging environments
- Make a company-wide commitment to accessibility to ensure all functionality and all content is accessible to all users
When it comes to creating accessible in-app content, finding the right solution is a key first step. But, as with any toolset, an understanding of the “why” and the importance of accessibility for your users, your product, and your business is also vital. By investing in an in-app communication tool committed to the principles of accessibility and taking the time to teach your entire organization about the importance of accessibility, you’ll be well on your way to creating an accessible environment for every one of your users.