[wp-trac] [WordPress Trac] #62861: Consider removing title attributes from Classic Editor scripts

[WordPress Trac]

#62861: Consider removing title attributes from Classic Editor scripts
---------------------------+-----------------------------------------
 Reporter:  sabernhardt    |      Owner:  (none)
     Type:  enhancement    |     Status:  new
 Priority:  low            |  Milestone:  Awaiting Review
Component:  TinyMCE        |    Version:
 Severity:  normal         |   Keywords:  title-attribute 2nd-opinion
  Focuses:  accessibility  |
---------------------------+-----------------------------------------
 The WordPress script adds `title` attributes to the placeholder images for
 `style`, `script`, More and Next Page tags.

 - The [https://github.com/WordPress/wordpress-
 develop/blob/0f2334da8111913a2a78c5000f27f791bb405f0f/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js#L119
 More tag] and [https://github.com/WordPress/wordpress-
 develop/blob/0f2334da8111913a2a78c5000f27f791bb405f0f/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js#L128
 Next Page tag] have an empty `alt` but use a `title` attribute (like
 `alt="" title="Read more..."`). The title text theoretically could be
 assigned as the `alt`, though the tooltip could help in cases of low color
 contrast.
 - The [https://github.com/WordPress/wordpress-
 develop/blob/0f2334da8111913a2a78c5000f27f791bb405f0f/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js#L217
 WP_More command] has a similar pattern for More and Next Page tags, but I
 did not find how—or if—that is used.
 - [https://github.com/WordPress/wordpress-
 develop/blob/0f2334da8111913a2a78c5000f27f791bb405f0f/src/js/_enqueues/vendor/tinymce/plugins/wordpress/plugin.js#L142-L151
 Style and script tags] have redundant `title` attributes, matching their
 `alt` text (like `alt="<style>" title="<style>"`). However,
 the tooltip is the only way to distinguish these two placeholders visually
 (unless it's worth replacing the transparent GIF with something like a
 [https://gist.github.com/sabernhardt/8804da31aed02f0c535306bdb2749446
 text-based SVG]).

 Additional `title` attributes are in other (external) TinyMCE-related
 scripts:

 - The [https://github.com/WordPress/wordpress-
 develop/blob/61b7b9713ef6a71126c3739a929ce604762de1bf/src/js/_enqueues/vendor/tinymce/plugins/charmap/plugin.js#L1141
 character map plugin], which is designed for mouse users, has two title
 attributes for each character. The script [https://github.com/WordPress
 /wordpress-
 develop/blob/61b7b9713ef6a71126c3739a929ce604762de1bf/src/js/_enqueues/vendor/tinymce/plugins/charmap/plugin.js#L1186
 uses the `td` title later] for the larger preview on the side. Switching
 each 'button' div's title to an ARIA label might be a //small//
 improvement.
 - `form_utils.js` has tooltips in [https://github.com/WordPress/wordpress-
 develop/blob/61b7b9713ef6a71126c3739a929ce604762de1bf/src/js/_enqueues/vendor/tinymce/utils/form_utils.js#L20-L21
 getColorPickerHTML()] and [https://github.com/WordPress/wordpress-
 develop/blob/61b7b9713ef6a71126c3739a929ce604762de1bf/src/js/_enqueues/vendor/tinymce/utils/form_utils.js#L58-L60
 getBrowserHTML()], but I did not find these two functions in use.
 - The [https://github.com/WordPress/wordpress-
 develop/blob/61b7b9713ef6a71126c3739a929ce604762de1bf/src/js/_enqueues/vendor/tinymce/plugins/textcolor/plugin.js#L194
 text color picker] uses tooltips for each color name, without actual text
 (except for the `×` times symbol for 'No color').

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