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

Local nav and breadcrumbs create duplicate links to the homepage #468

Closed
ndiego opened this issue Oct 5, 2023 · 11 comments
Closed

Local nav and breadcrumbs create duplicate links to the homepage #468

ndiego opened this issue Oct 5, 2023 · 11 comments

Comments

 @ndiego
Copy link
Member

ndiego commented Oct 5, 2023

The local navigation, in conjunction with the breadcrumbs, creates duplicate links to the local site's homepage. This issue is exacerbated on the new Showcase site since "Showcase" will also become a top-level navigation item.

 image (1)

Perhaps the breadcrumbs could be pulled into the local nav? This might have downsides too.

 image

cc @jasmussen @marko-srb

 @marko-srb
Copy link

Yes, we need to sort this out. Ideally after the launch as a next important update.
CC: @fcoveram

Let me review it next week.

 @ndiego
Copy link
Member Author

Just wanted to note that my idea of putting the breadcrumbs in the local nav is a bad one. Here is a stress test of that idea in other areas of the site: 😅

 image

 @jasmussen
Copy link
Collaborator

I don't think it's a bad one. I think we have options:

  1. We can show the breadcrumb bar only on some pages, not all.
  2. We can have 2 "modes" for the secondary bar; full (two bars, 2nd bar for breadcrumbs) and compact, which we can toggle on for sections that, e.g. only have 2 levels ever.

Something we've already discussed, because your example above already will break on mobile and tablet, is to allow eliding. E.g. instead of the above, you'd only see the top level link, the parent, and the current page, the rest would be elided. So 3 items not counting the ... at most. So the above would be:

Developer Resources / ... / Partial and Miscellaneous Template Files / Comment Template

I still think that 1 and 2 are still worth looking at, e.g. for the showcase and probably many of the About pages, a compact singular 2nd toolbar is valid enough, whereas for most sites in the Learn category we absolutely need a full breadcrumb bar.

 @ndiego
Copy link
Member Author

@fcoveram just looping you in here on this one for your thoughts. We also received a similar comment ( #10 ) in WordPress/wporg-showcase-2022#234 .

 @fcoveram
Copy link
Collaborator

I think the best approach is to keep the breadcrumb and the local navigation separately and show the former as per location need.

The component aims to indicate where you are on the site. Therefore, any other visual indicator that conveys the same info could be hidden due to its redundancy.

I took a look at the new IA and designs, and concluded the following.

First-level sections of global header.

Sections visible as links in the global header, like News and Showcase, can safely hide their name in the local nav as the “page you’re seeing” indicator appears as a blue border in the global header. And, as this prototype shared in the taxonomy discussion ticket , we can show it back once users scroll down. The active state of About WordPress is not visible in the global header because the page is inside a page group, and the site name is in the local nav because H1 has a different copy.

 Cropped screnshots of design ideas for News and About WordPress pages

Then, this logic in Showcase would look like this.

 Showcase header in default and scrolling version

Breadcrumb in index bulk

For the index bulk: Showcase, Themes, Patterns, and Plugins. Each page displays items where the content details page announces where you are on the cover image and the H1. I noticed that Showcase’s site details mockup now has a breadcrumb between the local nav and cover image. If we follow that logic, all details pages of this group must also show it, and the outcome becomes redundant.

The breadcrumb doesn't add more info than the local nav and the H1 text, so I think it’s safe to hide it. Here is a quick mockup.

 Cropped screnshots of design ideas for Showcase and Patterns pages

Breadcrumb in documentation bulk

For the documentation bulk: Learn, Documentation, and Developers. Large pieces of content are displayed, and users likely jump betweek sibling and child pages. Then, it makes sense to show the breadcrumb to reinforce the site location.

However, in this case shared by @ndiego , articles post-type gather content related to one topic, and the navigation and location rely heavily on the sidebar index. Showing the page depth in the breadcrumb is redundant and does not add much value. In the image below, breadcrumb and sidebar are outlined in red. As you go deep, breadcrumb starts showing the same pages as in the sidebar.

 Article post type in Developers section. Breadcrumb and sidebar are highlighted

 @ndiego
Copy link
Member Author

Thanks for this context @fcoveram . Given the above, what sections of Showcase v2 do you think should have the breadcrumbs?

My initial thought is only archives (i.e. https://wordpress.org/showcase-v2/archives/?tag%5B%5D=celebrities&tag%5B%5D=design )

 @fcoveram
Copy link
Collaborator

I vote for hiding it on all pages.

We aimed to treat the archive page as a "result with filters applied" page. In that vein, the breadcrumb is confusing as it mixes filter criteria. If we need to reinforce the filters applied, we can explore a different solution and deliver it in a future integration.

What do you think @jasmussen @marko-srb ?

 @jasmussen
Copy link
Collaborator

I think @pablohoneyhoney asked for its inclusion so it'd be good for his input.

I personally see the value in the breadcrumbs, and I think this iteration would be good to have as an optionally compact version of the nav bar . I could see it useful not just on Showcase, but on News, and About pages, perhaps even Download where we also have Nightlies, Counter, etc. — this is a version of the bar that should only ever be used on sections that have less than N levels, so it should be an editorial decision on whether to use the unified or stacked version of the bar.

 @marko-srb
Copy link

My thought: I suggest this happens as a separate exercise by @WordPress/meta-design after the launch and gets solved for across the site + guide/logic approach is clearly present in where we hide it, where we keep it.

 @ryelle
Copy link
Contributor

@ndiego @WordPress/meta-design A new nav design was posted in #535 , should that supersede this discussion? It also includes ideas for the breadcrumbs/home links.

 @fcoveram
Copy link
Collaborator

I'd say yes. #535 addresses the points shared here.

 @ryelle ryelle closed this as not planned Won't fix, can't repro, duplicate, stale Jan 11, 2024
Sign up for free to join this conversation on GitHub . Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants