119

A breadcrumb is a hierarchical link, not a historic link. It shows the user the hierarchical position in the site, not a trail of where they've come from. For example, the user could have landed on that page from a direct Google search, or from a link in the website footer. So a browser back button on clicking the breadcrumb 'Search' item would be pretty ...


43

Breadcrumbs are the wrong concept for your use case Your problem, as you have found out: There are multiple valid routes from the currently selected item Shakespeare to its category Writer. Breadcrumbs, however, are at their best when there is only one route. What to do? Use tags on the items. Following your example, Shakespeare would be tagged with ...


33

It's not a good idea to break the convention of a single breadcrumb path. Because of how breadcrumbs are generally designed it's fair to assume that people expect them to make it possible to: see where they are see how they got there navigate back in the path Multiple breadcrumb paths would probably make this very difficult if not impossible. If you ...


12

The back button in apps depends largely on which platform you're developing for. Here's a few use cases. Android apps Android phones typically have a soft key for the back button. The function is to go to the previous page. This is referred to as temporal navigation. According to the Android design principles, arrow in the action bar is to go one level up. ...


12

A page has one breadcrumb. After all, it's located in only one location within the site. Showing three breadcrumbs at once seems a bit odd. It looks to me like you're a bit confused about the function of sitemaps. Sitemaps (and by extension, breadcrumbs) are an overview showing the structure of your website. You visualize where the pages are nested. The way ...


11

Providing that the links in your breadcrumbs are appropriately styled (i.e. they look and behave like links and look like the other links in your site) and have appropriately meaningful anchor text, then you shouldn't need to include the "You are here". Other conventions are that the separators are either right angle brackets > or slashes / and the ...


10

I would argue that breadcrumbs used on a mobile site could in fact provide better usability, and share a multi-purpose. One of the things mostly seen today with responsive (mobile) sites is collapsing navigation that turns into a drawer/hamburger icon up top, once that navigation is hidden the only way to give a visual aid to the user of what page they are ...


9

You have a few options. I like the responsive "where am i?" breadcrumbs as demonstrated here. This option has the full breadcrumb trail in large windows and shrinks to only show custom text (such as "Where am I?") in narrow windows and on mobile devices. Example: Full screen: Home > Section 1 > Section Title That is Longer Becomes: Where Am I? &...


8

Some ideas: Logo / Brand name Remove "Menu" and make the breadcrumb smaller, so it doesn't suggest some relation with "File"


8

What do breadcrumbs do? Show how the user navigated to a particular page Show the hierarchy of a page NNGroup says: For polyhierarchical sites, breadcrumbs should show a single pathway in the site’s polyhierarchy. If a page has multiple different parents, identify a canonical path to it in the site hierarchy and show that path in the breadcrumb trail....


7

We had a similar problem at the project I am currently working on. We decided that the breadcrumbs should represent the static hierarchy of pages - rather than the user's history. When representing the history of visited pages, the path would soon get confusingly complex, because search features, cross-links, etc. can generate a lot of redundancy. On the ...


6

Should there be underlines for the breadcrumbs to make them look like links? They must respect overall site design. If all your navigation links are underlined (including your main navigation menu) then make them underlined. Just be consistent, exceptions must be justified. Arrow(>) or forward slash(/)? ( To make it look like a trail the user followed or ...


6

Location Based Breadcrumb: this shows the trail of current file location from the main directory. Like documents folder on your system. Attribute-Based Breadcrumb: this shows the trail of attributes of which your items fall into. i.e., like if your item is Pendrive, it falls into data storage attribute which is an attribute under computer peripherals, ...


6

I agree with you. The forward slash (/) does give a fair chance to novice users to think about it. Which why it would be best to replace the forward slash with an arrow or a backward slash \ . The backward slash would even indicate that you can go a step backward using that breadcrumb navigation. Arrow Backward Slash


5

Lose the breadcrumbs ... ... and you are fine : download bmml source – Wireframes created with Balsamiq Mockups As @DA01 said: Given the left menu is a tree menu, is there really a need for breadcrumbs? A tree menu is, essentially, vertical breadcrumbs


5

Breadcrumbs are good for storing information. It will make easier to remember the path of the information, not only navigate around them. It enables you to cluster the information.If you have not much information, you do not need breadcrumbs but you ll need it when you are dealing with complexity. Breadcrumbs tells a lot about how the information ...


5

The short answer is it depends. On a basic website with a handful of pages, breadcrumbs are certainly unnecessary. But on larger sites (especially reference and documentation sites), breadcrumbs are extremely useful for navigation and orientation—one might even say they're downright necessary. The hard part is determining whether your site is large enough to ...


5

TL;DR Main menu leads the user, while breadcrumbs are following him. They relate like a GPS navigator and a GPS tracker. Main navigation supports and helps to form user's mental model of what is on the site. It has constant structure and is presented on the same place, with the same information. It's very reliable and consistent mean for navigational tasks. ...


5

Simply rename the breadcrumb and (ideally) the title of the page from General to General Settings Same goes for the rest: Privacy Settings, Notification Settings, Content Settings Currently, the user sees the word General as the page title which is vague and confusing even with side menu open. The users shouldn't have to depend on the side-menu to realize ...


4

There is definitely usability benefit in creating user-friendly URL's that are descriptive of the page. It is also beneficial for a search engine and will aid the performance of your pages in organic search if they are rewritten like school.edu/admissions/apply-today/ to use your example. Breadcrumb trails are also beneficial for users to show the hierarchy ...


4

First of all you can choose from more UI options to show and navigate through hierarchies. Additionally to breadcrumbs and tree view there are e.g.: menus and submenus navigation (traditional and ring menus) nested labels (allowing more hierarchies) column navigation (like in OSX Navigator) path navigation (like in Windows explorer) I believe in UX you ...


4

Even if you set your site up so that breadcrumb links are "history" rather than "hierarchy", you should make them normal links. Doing anything else violates the user expectation that, after clicking a link, the "back" button will "un-click" the link. Your proposed system makes it so that they need to click the forward button instead.


4

I don't think you need the space at all.


4

Yea, I second Rob's recommendation, above. The breadcrumbs are an ancillary navigation tool and a guidepost for visitors dropping into the site hierarchy from search. So, they should accurately reflect the user's position in the hierarchy and show the whole hierarchy. Most often the breadcrumbs will mimic the folder structure of the site, or an idealized ...


4

I had the same problem and with some research find out that the way windows handles the problem is best practice and many users are used to it. windows shows as many last crumbs as it fits and puts a button '<<' at the beginning that clicking on it opens a drop down with all hidden crumbs.


3

Here is my analysis of your different options : Create a page for the category node, and just have it function as a navigational hub for that section. This isn't ideal as you'll often have duplicate navigation on the page that is already present elsewhere, or encourage fluff content to flesh out the page to not feel empty. The benefit is that all nodes ...


3

first things first, Breadcrumbs are called that way because they are a good analogy to the trail of crumbs that Hansel dropped in the woods so that he and Gretel could find their way back home. So in the primitive form that breadcrumbs where introduced they were meant to show you the path from where you are and back to the homepage. A few years back, ...


3

The problem The whole point of a breadcrumb is that it shows a linear representation of the path you choose from a tree of options. If you start embedding sub-paths in your breadcrumbs, the user might get confused about where the next decision they are taking will be placed in the scheme of things. Not to mention I can't imagine a visually appealing design ...


3

No, because often on a mobile device, the user can be temporarily distracted and attention can be sporadic. Mobile users multitask more often. For this reason, you don't want to have to put the onus on the user to remember where they came from (in order to make the decision of where they want to go next). In any case a back button on a mobile device can ...


Only top voted, non community-wiki answers of a minimum length are eligible