umbraco / Umbraco-CMS.Accessibility.Issues

6 stars 1 forks source link

Content Menu Modal: Heading of modal duplicates existing page heading and does not indicate purpose of modal #72

Closed tiffy74 closed 1 year ago

tiffy74 commented 2 years ago

Steps to replicate

  1. Access Content Section
  2. Open Content Menu Modal
  3. Inspect Heading Styles

Issue

The context modal that appears when a user clicks on 'content' contains a H1 tag also called Content. If the modal is opened this results in 2 headings on the same page with the same text (in this case 'content').

Why it matters

Descriptive headings are especially helpful for users who have disabilities that make reading slow and for people with limited short-term memory. These people benefit when section titles make it possible to predict what each section contains. When headings and labels are also correctly marked up and identified in accordance with 1.3.1: Info and Relationships, this Success Criterion helps people who use screen readers by ensuring that labels and headings are meaningful when read out of context, for example, in an automatically generated list of headings/table of contents, or when jumping from heading to heading within a page.

How to fix

Change the heading text to something that describes the purpose of the content modal Re-style the modal heading to make it consistent with other heading styles

W3 reference

https://www.w3.org/WAI/WCAG21/Understanding/headings-and-labels.html https://www.w3.org/WAI/WCAG21/Understanding/name-role-value.html