[wp-trac] [WordPress Trac] #60799: Change the Header Tag in Link Modal from <h1> to <h2> for Better Accessibility

[WordPress Trac]

#60799: Change the Header Tag in Link Modal from <h1> to <h2> for Better
Accessibility
---------------------------+-----------------------------
 Reporter:  lyonmuller     |      Owner:  (none)
     Type:  defect (bug)   |     Status:  new
 Priority:  normal         |  Milestone:  Awaiting Review
Component:  TinyMCE        |    Version:  6.4.3
 Severity:  normal         |   Keywords:
  Focuses:  accessibility  |
---------------------------+-----------------------------
 === Problem:
 Currently, the WordPress link insertion modal in the text editor uses an
 <h1> tag for its title ("Insert/edit link"). This can create accessibility
 issues, as multiple <h1> tags on a single page can confuse screen readers
 and undermine the semantic structure of the content, potentially leading
 to a poor user experience for people with disabilities.

 === Proposed Solution:
 I suggest changing the <h1> tag in the link insertion modal to a <h2> tag,
 or alternatively to a <span> tag if the heading level is not appropriate
 in the context of the modal's use. This change would improve the semantic
 HTML structure and enhance accessibility by maintaining a proper heading
 hierarchy.

 === Justification:
 According to the HTML5 specification and accessibility guidelines, a page
 should have a clear and logical heading hierarchy. The main content should
 start with an <h1> tag, followed by <h2>, <h3>, and so on. The current use
 of an <h1> tag in the link modal disrupts this hierarchy, especially since
 this modal can appear on any page regardless of the existing heading
 structure.

 Implementing this change will make WordPress more accessible and compliant
 with WCAG (Web Content Accessibility Guidelines) standards, which is
 crucial for users relying on screen readers and for SEO best practices.

 === Steps to Reproduce:
 1. Go to the WordPress text editor.
 2. Click on the 'Add link' button to open the link insertion modal.
 3. Inspect the modal's title element, which is currently marked up as an
 <h1>.

 === Possible Implementation:
 The change can be implemented by modifying the HTML structure in the core
 WordPress files where the link modal is defined. Additionally, testing
 should be conducted to ensure that this change does not affect the modal's
 functionality and that it enhances the accessibility as intended.

 I am looking forward to the community's input on this proposal and am
 happy to contribute to the implementation and testing phases.

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