To start our journey on improving accessibility in mobile apps we first take a look what needs to be done. Whether we're looking at an existing application or a new project we have a suite of tools available at hand that can help us.
Chapters in this series:
In this series we will take a look at a sample CookBook app, analyze its weak points considering accessibility and deal with them one by one. Our sample app has a few screens - showcasing collections, content displaying and editing, works on both phone and desktop, has support for localization and dark mode.
The code of the app is available on GitHub.
MAUI Advantages
Looking at how MAUI works we can immediately see that it's very beneficial in terms of available tooling. Since it easily can deploy apps to Windows, Mac, Android and iOS and uses native controls on each platform - we can take advantage of tools that are available to native apps without compromises and when we encounter a problem look at solutions that are native to individual platforms.
We will look at these automatic checking tools that we have at our disposal in this chapter:
- Visual Studio Accessibility Checker
- Accessibility Insights for Windows
- Android Accessibility Scanner
- iOS Accessibility Inspector
There are more tools available on each platform once we get deeper into testing so we'll also explore VoiceOver on iPhone, TalkBack on Android and Narrator on Windows in one of the next chapters.
It's important to emphasize that no single tool catches everything - each of them is designed for different aspects of accessibility and looks at the app from a different point of view so it's a good idea to combine them when we analyze our application - therefore it's good that we have access to all of them.
Visual Studio Accessibility Checker
Starting our journey on Windows and directly in our development environment, we can use Visual Studio Accessibility Checker.
This is a tool that is built-in into Visual Studio. It shows up once we launch our application in debug mode and lives in the "Live Visual Tree" window.
Once we launch an app and navigate to a page that we want to test, we just need to click the Scan for Accessibility Issues button and it shows us a list of errors that are present on the page.
This tool is designed to work with XAML-based applications including .NET MAUI so it can point us to the exact file and line where an error is coming from.
The Visual Studio Accessibility Checker excels at catching technical violations that automated tools can identify reliably:
- Missing accessibility names for interactive elements
- Unicode character issues in button text that screen readers cannot interpret
- Insufficient color contrast ratios
- Missing semantic properties on custom controls
- Improper focus management in complex layouts
The Accessibility Checker integrates seamlessly with XAML Hot Reload, allowing you to fix issues and immediately rescan to verify corrections which makes it even easier to use in the development loop.
Accessibility Insights for Windows
While Visual Studio's Accessibility Checker provides quick issue identification, Accessibility Insights for Windows offers comprehensive diagnostic capabilities for deeper accessibility analysis. This standalone tool supports three primary testing workflows that complement the integrated Visual Studio experience.
Live Inspect: Real-time Element Analysis
Live Inspect allows developers to examine accessibility properties by hovering over elements or setting keyboard focus. This feature is useful to:
- Verifying UI Automation properties for custom MAUI controls
- Understanding the accessibility tree structure of complex layouts
- Checking property inheritance in nested control hierarchies
- Debugging focus management issues in navigation flows
FastPass
FastPass provides a lightweight, two-step process for identifying common accessibility issues in under five minutes. This workflow is particularly useful for MAUI developers who need quick feedback during iterative development.
Automated Checks
Scans for compliance with over 60 accessibility requirements
We can see that the tool identified multiple issues with missing names for elements.
The first and second groups of issues are the cases of using an icon from Font awesome which doesn't directly translate to a textual representation.
The last group refers to individual items in the list of recipes - there is no name set to the items themself which makes it difficult to navigate over them using a screen reader.
Tab Stops Test
Provides guided manual testing of keyboard navigation with visual helpers
This gives us an understanding of the order of items that would be used in tabbed navigation. We can decide if this order makes sense for navigation for our users or whether we need to reorder them. The general rule is that the order should correspond to the visual order as we expect users without disabilities to use our app in a certain way, so we usually design it with UX in mind. The order of elements is also a part of UX and comes into play when users use tools such as screen readers or switch access.
Troubleshooting: Advanced Diagnostics
The troubleshooting workflow enables detailed analysis of specific accessibility issues:
Pattern verification
Shows supported control patterns and allows method invocation testing
Event recording
Captures application events to verify proper accessibility notifications
Contrast analysis
Includes a built-in tool for evaluating color combinations
Accessibility Insights for Windows can save the scan results as snaphots (.a11ytest file) that keep the UI tree properties and test results. These snapshots can be shared with team members and included in bug reports for detailed issue tracking.
We can also file issues directly from the app to GitHub or Azure DevOps where it automatically fills in the title and description of the reported issue.
Both Visual Studio Accessibility Checker and Accessibility Insights for Windows use axe-windows-engine which give these tools access to consistent, reliable results that align with industry standards and WCAG compliance requirements.