[wp-trac] [WordPress Trac] #50486: Improve the admin notices accessibility

[WordPress Trac]

#50486: Improve the admin notices accessibility
-------------------------------+-----------------------------
 Reporter:  afercia            |      Owner:  (none)
     Type:  defect (bug)       |     Status:  new
 Priority:  normal             |  Milestone:  Awaiting Review
Component:  Administration     |    Version:
 Severity:  normal             |   Keywords:
  Focuses:  ui, accessibility  |
-------------------------------+-----------------------------
 Follow-up to #47656. See also #50442/

 The admin notices accessibility has room for improvements.

 Currently, all the admin notices are just text printed out on the admin
 pages. They have no special semantics. There are no mechanisms to inform
 users some important information is printed on the page other than
 visuals. There are no methods to navigate directly to admin notices nor
 established standards on their placement.

 This way, users with accessibility needs will likely miss important
 information, as they may have no clue whether and where these messages are
 printed out.

 Depending whether the admin notices are PHP-generated notices that appear
 after a page load or JavaScript-generated ones that are "injected" into
 the DOM, there are ways to improve their accessibility. At the very least,
 the following improvements should be considered, some of them were
 mentioned in #47656.


 == All notices
 - establish standards for the admin notices placement in the page: there
 should be one, well defined, area where notices are printed out
 (recommended: after the main H1)
 - establish standards for the admin notices content: see the discussion
 related to the "text prefix" on #47656 and #50442
 - the above item should apply to the whole WordPress UI, including the
 block editor
 - "inline" notices (the ones printed out in the middle of the page): make
 a decision whether to keep them or allow only notices at the top of the
 page
 - if "inline" notices are kept, explore ways to make them more accessible
 - worth considering admin notice should be visually prominent and appear
 within the initial viewport anyways
 - consider the introduction of a dedicated PHP class with methods to get /
 print admin notices and additional features, also keeping into
 consideration [https://make.wordpress.org/core/2019/08/05/feature-project-
 proposal-wp-notify/ the WP Notify project] and the recent
 [https://make.wordpress.org/core/2020/06/15/call-for-feedback-wp-notify-v1
 -requirements-document/ call for feedback on the WP Notify v1 requirements
 document]

 == PHP notices
 - prepend to the document title a short text to inform users there are
 notices and their number: the document title is the first thing screen
 readers announce after a page load
 - the notices should be printed out after the main H1 heading as that's
 the part of the content with higher chances to be navigated to
 - define the page area where notices are printed out with an ARIA role
 that's also a landmark role, e.g. `complementary` (an `<aside>` element)
 or other role that is a landmark
 - add a new "skip link" after the "Skip to main content" one to allow all
 keyboard users to jump to the notices area: this skip link should only be
 printed out when there are notices

 == JavaScript notices
 - all notices injected in the DOM should have an ARIA role `alert` or
 `status` depending on their "politeness" level, so that they're
 automatically announced by screen readers

 Any additional suggestion and/or technique to improve the admin notices
 accessibility is very welcome.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/50486>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform