The admin can be intimidating to navigate if you’re just getting started with WordPress. After installing a few plugins, top-level menu items begin to pile on. This adds even more complexity to grapple with in a narrow space with long lists of items hidden behind flyout menus that make managing WordPress on mobile a frustrating experience.
The admin dashboard design hasn’t changed significantly since the MP6 plugin was merged into WordPress 3.8 in 2013. This project brought updated typography and improved contrast to the admin but didn’t tackle the increasing complexity of admin navigation.
A new proposal on trac aims to simplify the left sidebar navigation to improve accessibility, usability, and scalability by replacing the flyouts with accordion menus. Designer Dave Martin shared some mockups originally created by Joen Asmussen, and describes them as “a very early, exploratory concept.”
Martin listed several reasons for exploring a new design, including the inaccessibility of the hover/flyout menus and how poorly they scale on mobile interfaces. He also cited the abundance of top-level menu items that are rarely used, which he said contributes to the cognitive weight of admin navigation by still being permanently visible.
The major changes included in this proposal include the following:
- Flyout menus are replaced with accordion behavior. This scales all the way from mobile to desktop, and affords better accessibility.
- Menu is made 80px wider (240px vs. 160), affording a 14px minimum font size for all items, perhaps bigger icons in the future, more relaxed spacing, enhancing usability and accessibility.
- Sidebar is grouped in major sections, “Site”, “Design”, “Tools” and “Manage”.
- “Updates” are moved to a subsection of “Manage”, making Home a single item.
- Items related to content on your site (such as “Posts” and “Pages”) are moved under “Site”.
- Clicking major menu items just opens or closes the accordion, as opposed to go directly to the first subsection. This unifies the mobile and desktop behavior. You can keep the accordion open if you use it all the time (each click will save state, so you’ll see the same open/closed sections upon page refresh).
- All “Settings” subsections are moved under “Manage”, along with “Plugins & Blocks” and “Users”.
- Separators group major categories, like “Site” and “Design” together
- Dashboard is renamed “Home”, because all of WordPress is a Dashboard, and “Home” is where you can get an overview at a glance.
WordPress core committer John Blackbourn commented on the proposal, recommending further exploration of what the menu could look like for different user roles and whether that might affect the appearance, grouping, and behavior of the menu items. For example, roles with more limited publishing capabilities, such as a subscriber, would see very few menu items.
There’s also a bit of discussion regarding the use of the word ‘Site’ where some might better understand that section as ‘Content.’ As this is just an initial mockup, nothing is set in stone and many iterations will likely follow.
Even with many changes expected as the concept evolves, the proposed design significantly reduces cognitive load, especially for new users who may not be as familiar with the admin menu. An updated admin navigation design might lend itself well to being tested as a feature plugin. As with any major change in WordPress, there are many considerations for how it will affect plugin developers. Major visual overhauls like this are exciting, but it takes time to get it right. This proposal already shows a lot of promise but needs more feedback and participation from diverse user groups across the WordPress community.
If it includes a fix to the “My Sites” dropdown that runs off the bottom of the screen in multi-site I’m all for it. 🙂