Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Widgets and Navigation: the main H1 heading must come before any other content in the main region #24937

Closed
afercia opened this issue Aug 31, 2020 · 3 comments
Labels
[Feature] Widgets Screen The block-based screen that replaced widgets.php. [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). Needs Design Needs design efforts. [Type] Bug An existing feature does not function as intended

Comments

@afercia
Copy link
Contributor

afercia commented Aug 31, 2020

Describe the bug

For semantics and accessibility, all the admin pages have a main H1 heading that identifies "what" the page is about. This main heading must come before any other content within the role="main" region of the page.

Over the last years a good amount of work has been made to make all the admin pages have a good heading structure. See for example:
https://make.wordpress.org/core/2017/05/17/cleaner-headings-in-the-admin-screens/
https://make.wordpress.org/core/2015/07/31/headings-in-admin-screens-change-in-wordpress-4-3/
https://make.wordpress.org/core/2015/10/28/headings-hierarchy-changes-in-the-admin-screens/

(note: the only missing part is that in some pages the "Help" and "Screen Options" are actually placed before the main H1: this is not ideal but it can't be changed without a new design that didn't happen so far).

However, I see the new design of the Widgets and Navigation pages goes in a different direction. Right now:

  • in the Widgets page the main H1 heading is placed between interactive controls, in an order that doesn't make much sense
  • the Navigation page doesn't have any heading

This new design needs to be changed.

It is of fundamental importance that any admin page provides a visible H1 heading placed before any other content in the main section. Ideally, the order should be changed to something like:

<div id="wpbody" role="main">
	...
	<h1 ....
		<div class="components-navigate-regions">
			...
			[toolbar]
			[content]
			etc.

This is even more important considering that this new design is likely going to be used for all the new admin pages in WordPress.

Screenshots

New Widgets page headings:

widgets heading

New Navigation page headings (no headings at all):

navigation headings

@afercia afercia added [Type] Bug An existing feature does not function as intended [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). Needs Design Needs design efforts. [Feature] Widgets Screen The block-based screen that replaced widgets.php. [Feature] Navigation Screen labels Aug 31, 2020
@afercia
Copy link
Contributor Author

afercia commented Aug 31, 2020

Regarding the Navigation page, a visible H1 heading is also proposed in the latest design on #24875.

@mapk
Copy link
Contributor

mapk commented Sep 1, 2020

This has been updated in the recent design work and will be implemented with a proper H1 tag as the first item in the main screen area.

Legacy Widget i5 - 2

@draganescu
Copy link
Contributor

This is solved in the current Widgets implementation as it is according to the design spec.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Widgets Screen The block-based screen that replaced widgets.php. [Focus] Accessibility (a11y) Changes that impact accessibility and need corresponding review (e.g. markup changes). Needs Design Needs design efforts. [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

No branches or pull requests

3 participants