[wp-trac] [WordPress Trac] #31942: Press This: add ARIA role alert to the "alerts" div

[WordPress Trac]

#31942: Press This: add ARIA role alert to the "alerts" div
---------------------------+-----------------------------
 Reporter:  afercia        |      Owner:
     Type:  defect (bug)   |     Status:  new
 Priority:  normal         |  Milestone:  Awaiting Review
Component:  Press This     |    Version:  trunk
 Severity:  normal         |   Keywords:
  Focuses:  accessibility  |
---------------------------+-----------------------------
 Press This has a "notification" area where important messages are
 displayed. As far as I see for the most part they're errors, though
 there's the possibility to display also simple "notices". Examples:

 "Content, title, and excerpt are empty."
 or
 "Connection lost or the server is busy. Please try again later."

 Since these messages are displayed at the top of the screen while focus is
 on other parts of the UI, they won't be announced by assistive
 technologies.

 ARIA roles can help us and since for now these messages are errors (any
 notices planned?) I'd suggest to add role "alert". Unlike elements with
 the role "status", elements with the role "alert" have an implicit aria-
 live value of assertive. From the specs:

 Assertive:
 This information has the highest priority and assistive technologies
 SHOULD notify the user immediately. Because an interruption may disorient
 users or cause them to not complete their current task, authors SHOULD NOT
 use the assertive value unless the interruption is imperative.

 Polite:
 (Background change) Assistive technologies SHOULD announce updates at the
 next graceful opportunity, such as at the end of speaking the current
 sentence or when the user pauses typing.

 If notices will be introduced in the future, we could iterate and use
 different roles depending on the nature of the message conveyed.

 Please consider that while the role alert has an implicit aria-live value
 of assertive, and an implicit aria-atomic value of true, it's better to
 set them explicitly (as already done for `wp.a11y.speak`) for backwards
 compatibility with old AT:

 {{{
 role="alert" aria-live="assertive" aria-relevant="all" aria-atomic="true"
 }}}

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