Site Editor: misleading speak() messages when switching mode and navigating

[afercia]

Description

In the Site Editor, the speak() audible messages sent to the ARIA live regions are misleading and do not reflect the actual state of the UI.

Note: In the screenshots below, I'm using a quick.n dirty plugin to dump to the console the speak() messages.

1
On first load, screen reader users will hear the following messages:

Polite Speak message:
You are currently in edit mode. To return to the navigation mode, press Escape.

Assertive Speak message:
Now displaying: Home ‹ Template ‹ Editor ‹ WordPress Develop — WordPress

I'd say they're both incorrect. They made sense in WordPress 6.1, when the Site Editor didn't have the 'view mode'. Now that the 'view mode' initially renders the navigation panel and the canvas preview, these messages don't communicate to users the actual state of the UI:

• 'You are currently in edit mode.': technically the editor within the canvas preview is in edit mode. However, the UI is in a completely different mode, where users can't actually 'edit'. They can only navigate and preview.
• 'Now displaying: Home ‹ Template ...': while it is true that the editor within the canvas preview displayes the home template, the message should instead communicate to users where they actually are: they're in the top level of the navigation: 'Design'.

2
When switching the editor to 'edit mode', the previous two messages are repeated again. That's very confusing. As a useer, I wouldn't be able to understand what changed.

3
Lastly, when navigating forth and back through the 'top level' items in teh navigation e.g. Design, Navigation, Styles, Pages, Templates, Library, the 'now displaying' message is always the same and it always refers to the 'home template':

This also happens each time when switching back from 'edit' mode to 'view' mode by clicking 'Open navigation'.

Now displaying: Home ‹ Template ‹ Editor ‹ WordPress Develop — WordPress

This 3rd problem has more to do with the single-app routing mechanism. Each state of the navigation is actually integrated in the browser history. Pressing the browser Back and Forward buttons does updates the navigation panel state. However, the document title isn't updated. Anay routing system should always update the document title otherwise the entries in the browser's history are meaningless and not usable. Just press and holt the back button to see the entries have all the same name:

I will split this 3rd point in a separate issue. For now, I'd suggest to shorten the 'now displaying' message: it is very long and verbose. I'm not sure users actually need to hear each time the second part of the string. For example this:

Now displaying: Home ‹ Template ‹ Editor ‹ WordPress Develop — WordPress

Could be shortened to:

Now displaying: Home ‹ Template

Step-by-step reproduction instructions

• Go to the site editor.
• Either use a screen reader to hear the speak messages, or inspect the source and observe the text that changes within the ARIA live regions.
• Observe the messages are misleading and do not reflect the actual state of the UI.

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

[afercia]

I tested again this issue and it looks like the situation got worse. Raising the issue priority because this is a subpar experience for screen reader users and because it's getting worse and worse.

There is now one more audible message when the Site editor loads and it's totally unrelated and confusing:

Upload an image file, pick one from your media library, or add one with a URL.

This comes from the Media library but it's unclear to me why this message is sent to the ARIA live region when the editor loads.

RIght now on trunk when the editor loads the following messages are announced in this sequence:

Polite Speak message:
You are currently in edit mode. To return to the navigation mode, press Escape.

Polite Speak message:
Looking for template parts? Find them in "Patterns".

Assertive Speak message:
Now displaying: Blog Home ‹ Template ‹ Editor ‹ WordPress Develop — WordPress

Polite Speak message:
Upload an image file, pick one from your media library, or add one with a URL.

Amongst all of them, only the 'Now displaying' looks right, even though it's too verbose.