web
You’re offline. This is a read only version of the page.
close
Skip to main content

Notifications

Announcements

Community site session details

Community site session details

Session Id :
Power Platform Community / Forums / Power Apps / Accessibility - Detail...
Power Apps
Unanswered

Accessibility - Detailed embedding of accessible support for assistive technology

(2) ShareShare
ReportReport
Posted on by 76
Hi all,
 
I'm wanting to build a Power App that has really strong accessible support as standard, so that Screen Reader users, Keyboard-Only users and as many other types of accessibility are covered. We have a richly diverse set of colleagues in our organisation and I want everyone to have an equitable experience when using our internal apps, regardless of their disabilities, that tailors the experience to their specific needs wherever possible.
 
I find the accessible elements of Power Apps building to be very limited (and limiting) and I'm hoping there might be some more hidden tips or tricks that can help to get around the issues.
 
Not sure why they can't create some form of 'Reading Order Pane' like they have in PowerPoint, or some way of linking or programming specific journey mapping for assistive tech users that are more seamless and intuitive: I'm really interested in building accessibility into everything I make and even I'm struggling to do it justice, so I dread to think what other people are doing without that drive. It's no wonder that disabled people aren't properly supported if their basic needs are not being met!
 
Anyway, I'm hoping there will be more updates or improvements after the annual Ability conference in a few weeks' time. 
 
Overview of the app:
 
For now, I'm looking to find a way of programming in some Screen Reader journeys to make navigation and content delivery present in a way that flows better for users.
 
This is a screenshot of the basic setup for the app (I've removed logos/names/language for certain things):
 
 
 
It's essentially 3 containers:
 
- One Header bar (top)
- One 'Tab List' navigation bar (lower left)
- One content display box (lower right)
 
There is a menu on the page before this, but that one is very simplistic with just 7 horizontal buttons that fill the screen, so not difficult to program for Accessibility.
 
So, for this screen above, I want the Screen Reader to read:
 
- the screen name
- the title (in this case 'Home')
- the 'Main Menu' button
- the 'Close App' button (not pictured)
 
and then start to read down the tab list on the left:
 
(There will be more than 3 Tab List items, but just using this basic template to show the general look of the screen and not create too much confusion with multiple options)
 
 
Questions:
  • For each item on the Tab List, I want it to be able to be selected and the Screen Reader then goes to read the container content on the right hand side.
  • Is there a way of connecting the two containers without using the '1 pixel lower' technique for reading order?
  • Possibly using some programming in the 'OnSelect' box or similar, combined with the 'Live' labels (Assertive/Polite) to change the journey/Reader pathway?
  • Is there also a way of announcing the Tab List items when hovering over them (before selecting)?
  • Maybe it could announce them in order just from moving down the Tab List so that it reads the menu as it should, then when the user selects a specific item in the Tab List by clicking it: That's when it connects over to the right hand side container and follows the content in a readable format/flow?
 
 
Hoping someone is able to help, as this is a major part of the App I'm trying to build and will have a big impact on the scope of the project. So I need to find a solution as soon as possible.
 
Thanks.
 
Sam
Categories:
I have the same question (0)
  • MVP-Phipps Profile Picture
    3,508 Super User 2024 Season 1 on at
    Here are some suggestions and best practices that may help you enhance the accessibility of your Power App, especially for screen reader and keyboard-only users:
     
    Logical Control Order & Tab Navigation
    Power Apps determines screen reader navigation order based on the X and Y coordinates of controls — not their size or visual grouping. This means:
    • Controls higher on the screen (lower Y value) are read first.
    • If two controls share the same Y value, the one further left (lower X value) is read first.
    To improve the experience:
    • Align controls logically in your layout to match the desired reading order.
    • Use the TabIndex property to manually override the default order if needed.

    Grouping Controls for Better Screen Reader Flow
    You can group related controls using containers or group controls. This helps screen readers interpret them as a single logical unit, improving navigation and comprehension.
    For your layout:
    • Group the Tab List items into a container.
    • Group the Content Display area into another container.
    • Use consistent naming and accessibility labels for each group.

    Live Region Support (Label Control Only)
    Power Apps supports Live announcements using the Live property on Label controls:
    • Off: No announcement.
    • Polite: Screen reader finishes current speech before announcing.
    • Assertive: Screen reader interrupts to announce immediately.
    You can use this to announce:
    • Tab selections
    • Content changes in the right-hand container
    • Navigation confirmations
       
    Screen Reader Journey Mapping
    While Power Apps doesn’t yet have a “Reading Order Pane” like PowerPoint, you can simulate a guided journey by:
    • Using Focus() to move the user’s screen reader to the next logical control.
    • Triggering Live label updates on OnSelect of Tab List items.
    • Using AccessibleLabel and ScreenName properties to provide context.
       
    Accessible Colour Themes
    Check out the Power Platform Creator Kit, which includes accessible colour palettes and components designed with WCAG compliance in mind. This can help ensure your app meets contrast and visibility standards.
     
     
    Accessibility Checker
    Don’t forget to use the built-in Accessibility Checker in Power Apps Studio. It flags:
    • Missing screen names
    • Missing accessibility labels
    • Poor contrast
    • Keyboard navigation issues
    It also explains why each issue matters and how to fix it, a great learning tool as well as a validator.
     
    ; text-decoration-color:initial; text-decoration-style:initial; text-indent:0px; text-transform:none; word-spacing:0px">If this helps, please like. If this solves the problem, mark as a solution.d-color:rgb(255, 255, 255);text-decoration-style:initial;text-decoration-color:initial;"> d-color:rgb(255, 255, 255);text-decoration-style:initial;text-decoration-color:initial;"> ; text-decoration-color:initial; text-decoration-style:initial; text-indent:0px; text-transform:none; word-spacing:0px">Follow me on LinkedIn: https://www.linkedin.com/in/charlie-phipps-bennett-%F0%9F%91%A8%E2%80%8D%F0%9F%92%BB-91338715b/d-color:rgb(255, 255, 255);text-decoration-style:initial;text-decoration-color:initial;">

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

Forum hierarchy changes are complete!

In our never-ending quest to improve we are simplifying the forum hierarchy…

Ajay Kumar Gannamaneni – Community Spotlight

We are honored to recognize Ajay Kumar Gannamaneni as our Community Spotlight for December…

Leaderboard > Power Apps

#1
WarrenBelz Profile Picture

WarrenBelz 717 Most Valuable Professional

#2
Michael E. Gernaey Profile Picture

Michael E. Gernaey 329 Super User 2025 Season 2

#3
Power Platform 1919 Profile Picture

Power Platform 1919 268

Last 30 days Overall leaderboard