4

I'm working on a website with large number of pages and trying to add a breadcrumb. These are a few things i found from researching internet. Are these best practices? Is there a better guideline in doing this?

  1. Should there be underlines for the breadcrumbs to make them look like links?
  2. Arrow(>) or forward slash(/)? ( To make it look like a trail the user followed or a standard file directory)
  3. How not to make it the focal point ( more attraction should go to the main navigation menu)
  4. Should i single out the current page - or leave it as such - since it is evident as it appears in the last position ?
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 a standard file directory)

I don't think it really matters because users are used to view both. However, if I have to decide then I'd choose according to site content. If it's hierarchical data then I'd use an arrow > (or a similar glyph) to enforce this model. Krug's studies (citation from his Don't make me think) found that people have a stronger sense of hierarchy with >.

If each page is just a navigation path but there isn't any strong hierarchical model then I'd go with /. Two examples:

Home > Documents > Reports > Marketing > Market Share > 2015

And:

Home / Administration / Users / Index

If you're in doubt I'd use / because users see the same syntax in URLs and it is (it should!) be easier to understand the concept of path. Note that this is just my opinion, above mentioned Krug asserts to always use > in virtue of that sense of hierarchy.

How not to make it the focal point ( more attraction should go to the main navigation menu)

With usual design tools: color and size. Exact combination depends on your site's design.

I'd use (if possible) all of them: smaller font to don't make it prominent and more subtle colors to move it to background but that's a decision that has to be done case-by-case.

Should I single out the current page - or leave it as such - since it is evident as it appears in the last position?

Leave it there, breadcrumb control isn't just a shortcut for browse back feature (or an alternative navigation menu), it's a tool to exactly tell you where you are. Norman clearly stated [citation needed] to always include current page, even when you repeat exactly same information in the page title. Krug even suggests to make it bold.

Of course, current page should appear different and must not be clickable (unless you want to use it to refresh the current page but I'd avoid this in general and especially if dealing with forms).

| improve this answer | |
  • Adriano, do you have that Norman reference? A quick search has some Nielsen articles showing up, but I'd like to read Norman's take on it. – Ken Mohnkern Sep 22 '15 at 19:17
  • @KenMohnkern I'm searching, I was sure it was on DoET but there I found just few paragraphs about this topic. I'll update when I got it! – Adriano Repetti Sep 22 '15 at 20:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.