Take the 2-minute tour ×

Should breadcrumbs ever be placed at the very top-left of a page?

Breadcrumbs seem to always be located either directly below the nav menu or above the page content. An article from 1stWebDesigner shows some creative examples of breadcrumb design, 99% of which use this format.

share|improve this question

6 Answers 6

up vote 7 down vote accepted

Putting the breadcrumbs above everything else on the page creates a false visual hierarchy.

I suggest you read Steve Krug's Don't Make Me Think for a more detailed explanation (chapter 6 discussed navigation and breadcrumbs).

To summarize it very briefly, each section on the page has a header, usually containing titles, but can also contain actions, which affect only that specific section.

A top most breadcrumbs-control implies that it everything on the page is unique to this location and changing the location, changes the entire page.

The mental image we usually have of a site is that it has a wrapping element that is global and common to all the pages. This element usually contains the title/logo, navigation, etc. Although it might technically get reloaded with each page, we (should) perceive it as constant and unchaning.

Also consider that if the navigation is beneath the breadcrumbs, it might feel weird navigating to another page, expecting to change only the content beneath the navigation (while it stays constant), but instead changing something "above" it in the hierarchy.

share|improve this answer

I think the best place to put breadcrumbs is in the trash. They don't really provide that much value to a site.

If you insist on having them, then after the site navigation is the best place to put them. Putting them at the very top of the site is a VERY bad idea to me. It's going to hurt your SEO and accessibility for sure, and it is also likely to hurt the aesthetic of your site. Breadcrumbs aren't exactly "pretty".

The reason that they are put right above the content is because they relate directly to the content. Putting them above your navigation/header breaks that link with the content and the breadcrumbs lose some context. I've seen this sort of thing referred to as cognitive resonance, although that really isn't a valid phrase, it kind of makes sense here.

EDIT: Expanding on how it hurts accessibility and SEO:

Accessibility: If you put the breadcrumbs at the very top of the page, people using assistive technologies like screen readers now have to move through all of your breadcrumbs in order to get to the site navigation links. Because of this, you need to really consider what the more likely target is for your user, clicking on a navigation link or clicking on a breadcrumb link. Unless you are Craigslist, where the only navigation you have is breadcrumbs, the more likely candidate is the navigation links.

SEO: Search engines only follow a certain number of links (and read a certain amount of content on a page, but that's less important here). Again, it leads to importance. What is more valuable for you to have followed by Google's crawler, your breadcrumb links or your main site nav links (which will ideally lead the crawler to much more content than the breadcrumbs will). Now, this is probably less of a concern, because most crawlers will probably follow deeper into the page than just your navigation and your breadcrumbs, but it's better to be sure with that sort of thing.

Also, thought of another reason to not put them at the very top of the site: Not every page on your site is going to have breadcrumbs. As such, the user will likely become used to your header looking a certain way and will learn to ignore it over time unless there is a specific action they want to take there. This means that your breadcrumbs are likely to get ignored even more than if they are right above your content. At least if they are above your content, they are more likely to be in the user's vision as he reads the content (again, the resonance between breadcrumbs and content).

share|improve this answer
Could you expand on why putting breadcrumbs on the top would hurt SEO and accessibility? –  Virtuosi Media Sep 29 '10 at 20:20
I agree, "the best place to put breadcrumbs is in the trash" –  Tyler Egeto Sep 29 '10 at 20:42
Using breadcrumbs is absolutely not hurting your seo-efforts. On the contrary - Google insist you to use bread crumbs because it makes it easier for the seachbots to understand the site hierarchy. There were a time when Google only followed 100 links on a web page but not nowadays. And dont put the breadcrumbs in the trash because a lot of people is using them to understand where they are. They might not click on them but that is another story. It's even more important now because of how the new versions of MS Windows is emphasizing them in Explorer windows. –  Tony Bolero Dec 14 '11 at 8:31
"I think the best place to put breadcrumbs is in the trash. They don't really provide that much value to a site." Could you explain this further? I'm inclined to disagree. –  dhmholley Aug 22 '12 at 13:28
@dhmholley - Why do you disagree? What value do you think they provide? All they do is mimic the site's navigational structure, which can be determined by so many other things that actually have value, like, oh, I don't know, the site's navigation. –  Charles Boyung Aug 22 '12 at 18:13

An interesting way of doing it might be to create a breadcrumb/tab hybrid at the very top of the page, with function and form similar to Google Chrome's tabs on top UI pattern.

share|improve this answer

If you use them, I'd suggest they belong immediately before the H1.

But I tend to agree with the idea that they really aren't that useful most of the time. The one time they can be is if you have a site that has very compartmentalized items that get nested very deep. An example might be an online retailer where odds are that people might be landing on a specific product page and would like an easy way up to the general product category listings.

share|improve this answer

Jakob Nielsen recommends breadcrumbs for the following reasons

  • Breadcrumbs show people their current location relative to higher-level concepts
  • Breadcrumbs afford one-click access to higher site levels
  • Breadcrumbs never cause problems in user testing
  • Breadcrumbs take up very little space

However, he does refer to them as 'Secondary Navigation', and while he is non-specific in proposing a location, after and subsidiary to the site's main navigation is a strong implication.

Source http://www.useit.com/alertbox/breadcrumbs.html

share|improve this answer
While this is a valuable link, it doesn't directly address the OP's question of whether or not breadcrumbs will still be effective when positioned right at the top of the page. –  JonW Aug 22 '12 at 14:39

Breadcrumbs are most useful in web applications where we have to use maximum of our screen space for data operation. Breadcrumbs helps in faster navigation, as the user does not have to memorize the path he took to reach his destination. Definitely a time and space saver. Best place for Breadcrumbs is right on top, above the page title.

share|improve this answer
Why is the best place for breadcrumbs right at the top above the page title? –  JonW Aug 22 '12 at 12:52
Page title shows what page you are on and Breadcrumbs show the path you took to reach there. So keeping it in proximity with each other helps scan faster to know where we are. We cant have it below the title because that would break the continuity established bythe page title and page content. So better on top. –  cyn Aug 23 '12 at 11:47
@cyn - Breadcrumbs do not show the path you took to reach there. They show the path in the site navigational structure, which is most of the time completely different. –  Charles Boyung Aug 24 '12 at 3:13
@cyn - and your reasoning (in your comment) definitely leads to the downvote here. –  Charles Boyung Aug 24 '12 at 3:14
Well thats your opinion. Nor do I want to argue because the topic is very context specific. When you get into designing more complex web applications we can bring this topic up again. –  cyn Aug 24 '12 at 7:51

Your Answer


