[wp-trac] [WordPress Trac] #43398: Avoid using visual tabs when it's irrelevant: menu screen, about.php and in edit-site screen (multisite)

[WordPress Trac]

#43398: Avoid using visual tabs when it's irrelevant: menu screen, about.php and in
edit-site screen (multisite)
--------------------------+------------------------------------------------
 Reporter:  audrasjb      |       Owner:
     Type:  enhancement   |      Status:  new
 Priority:  normal        |   Milestone:  Awaiting Review
Component:                |     Version:
  Administration          |  Resolution:
 Severity:  normal        |     Focuses:  ui, accessibility, administration
 Keywords:  needs-design  |
--------------------------+------------------------------------------------
Description changed by audrasjb:

Old description:

> Related: #40678
>
> In several part of WordPress admin, visual tabs are used for simple
> links.
> The issue appears in:
> - Menu screen
> - About.php screen
> - Edit site screen (in multisites)
>
> The issue with "fake tabs" is multiple:
> - A real tab system is supposed toggle the visibility of content that is
> already in the page.
> - The markup is not relevant (see example bellow)
>
> Example of fake tabs used in Menu screen:
> ```
> <h2 class="nav-tab-wrapper wp-clearfix">
>         <a href="/wp-admin/nav-menus.php" class="nav-tab nav-tab-
> active">Edit Menus</a>
>         <a href="/wp-admin/nav-menus.php?action=locations" class="nav-
> tab">Manage Locations</a>
> </h2>
> ```
>
> This ticket is a part of a bigger one: #40678. During the last
> accessibility team meeting, we suggested to separate the different tasks
> of 40678 in separate tickets to make it easier to commit.
>
> Please note this ticket concerns also the design of these "tabs".
> We'll need some design feedback because if they’re not tabs, they
> probably should not look like tabs.

New description:

 Related: #40678

 In several part of WordPress admin, visual tabs are used for simple links.
 The issue appears in:
 - Menu screen
 - About.php screen
 - Edit site screen (in multisites)

 The issue with "fake tabs" is multiple:
 - A real tab system is supposed toggle the visibility of content that is
 already in the page.
 - The markup is not relevant (see example bellow)

 Example of fake tabs used in Menu screen:
 {{{
 <h2 class="nav-tab-wrapper wp-clearfix">
         <a href="/wp-admin/nav-menus.php" class="nav-tab nav-tab-
 active">Edit Menus</a>
         <a href="/wp-admin/nav-menus.php?action=locations" class="nav-
 tab">Manage Locations</a>
 </h2>
 }}}

 This ticket is a part of a bigger one: #40678. During the last
 accessibility team meeting, we suggested to separate the different tasks
 of 40678 in separate tickets to make it easier to commit.

 Please note this ticket concerns also the design of these "tabs".
 We'll need some design feedback because if they’re not tabs, they probably
 should not look like tabs.

--

--
Ticket URL: <https://core.trac.wordpress.org/ticket/43398#comment:4>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform