We have a well-developed breadcrumbs component in the design system. Its logic is that breadcrumbs containing more than 5 elements are reduced and a drop-down menu appears. Currently, we show the first 3 elements, then goes overflow menu and then the current page is shown. Is this the correct behavior? Because at the moment, the rest of the team does not like the current solution and they suggest hiding the first elements instead of the last ones
Add a comment
|
2 Answers
Hiding the first elements is a better tradeoff, as it gives the user credit for being intentional w/ their earlier choices, and keeps them focused on the most recent drilldown.
You'll find this pattern in Google drive, where you can have deep nested folders:
You can see the previous drilldowns, but you can always see where you are in your last couple choices.
Catching a mistake: It also helps in case a user clicks on the wrong link by mistake. If you hide where they just came from, there's a higher likelihood that they don't realize their error.
Jacob's Law: One advantage of this pattern is that so many people are used to it (after all, it's Google). This is known as 'Jacob's law' (after Jacob Nielsen)
Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.
-
This is 100% the conventional way of offering 'breadcrumb overflow' & exactly the behavior that makes the most sense for users in 99% of cases - & would accordingly be exactly the behavior that users anticipate working within. Little wonder people are grumpy. With home buttons, bookmarks, & back buttons conventionally accompanying breadcrumbs, navigation to the root of a breadcrumb path is usually already more accessible than whatever arbitrary-depth node has been traversed to & with this in mind it follows that hiding the first elements is the correct default behavior.PowerLuser– PowerLuser2024-08-01 07:26:55 +00:00Commented Aug 1, 2024 at 7:26
You can hide in-between elements with "..." and show the last two or three. and when user clicks on "..." you can expand it and when they move away or after few seconds close it again. this will not put any impact on your current design system and it will also solve the overflow of the menu.
-
Another compromise would be dynamic 'bookend buttons' that toggle whether the front or back of a breadcrumb path are collapsed into an overflow dropdown menu - such a button would occupy little space on a UI and could be hidden/revealed as a means of indicating the display mode simultaneously.PowerLuser– PowerLuser2024-08-01 07:30:01 +00:00Commented Aug 1, 2024 at 7:30