Recommended approach for implementing breadcrumbs
Solution 1
Although they are called "breadcrumbs" as in the fairy tale, the purpose of breadcrumbs is not to replace the browser history. So Option 1 is not an option.
They are rather an instrument to show the user how he found the product and above all how he can find other products that are logically placed "beside" the found product.
So it's basically Option 2.
If you have products that are in multiple categories, you have three options:
- Show all possible paths to the product.
- Show the path the user came to the product. (This requires that you use the primary key of your product-to-category table instead of product IDs.) It implies, that the user will get hardly helpful "Search > Product" breadcrumbs when searching.
- Specify a "main category" for each product that determines the breadcrumbs shown (and is used in other places, for example when there is a shopping cart and the user clicks a product in the cart view.)
Solution 2
Breadcrumbs are supposed to be representative of your site layout, not how the user is accessing your site, which pretty much rules out option #1. I'd not like to see this on Amazon:
Home>Products>Home>PS3 Games>Call of Duty>PS3 Games>Funky Boxer Shorts->Add To Cart
Whilst indicative of my browsing history and random clicking, it's not representative of the site :)
I assume you have a database-backend, as you mention product categories. If you have parent categories then you have a structure right there that you can use. Assuming you have a front page, we can just call that "Home" on the breadcrumb trail. Then, assuming in your database you have things arranged like this:
table_productCategories
_pkCategoryID
_categoryName
_fkParentCategoryID
Allowing you to have a tree of product categories:
Software
Windows
Apps
Games
Crash-To-Desktop
Linux
Servers
3-Games
Hardware
Laptops
PCs
Missile-Launchers
...then whenever you hit the product page, you don't need to worry about if the product is in more than one category, the user navigated there and using a db query we can build a breadcrumb of:
Home > Software > Windows > Games > Aunt Dolly and the Scared Sheep
Additionally, you're going to have pages that aren't products. "About Us" "Contact Us", etceteras. In a CMS the content of these pages are in the database and categorised too.
table_contentCategories
_pkCategoryID
_categoryName
_fkParentCategoryID
... you get the idea. This means all your pages with Content rather than products can also be breadcrumbed:
Home > About > Finding Us in a web of backstreets
vdrmrt
Updated on September 17, 2022Comments
-
vdrmrt over 1 year
I want to implement breadcrumbs on a website, now I'm struggling on how to best implement them.
Users can search for products but can also navigate to a product category to find a product. On a product page the user can click on a product category to find similar products. So the users has different paths to reach a specific product / page.
I think I have two options to implement breadcrumbs
Option 1: Add every visited page to the breadcrumb. For example: Home > Search Results > product 1 > Category 2 > product 2 Disadvantage: breadcrum can become very long
Option 2: Specify for every page a specific fixed breadcrumb for example: Home > category 1 > product 1 Issue: what to do with products that are in multiple categories?
What are you opinions? Is there option 3 that I have overlooked?
-
Martin v. Löwis over 13 yearsYour first statement is really narrow. Some people use location-based breadcrumbs to indicate your location in a site, but others use path-based breadcrumbs to indicate how a user got to where he is in the site. I would say that the latter is more true to to the "breadcrumb" concept. The content of your site is a big factor in determining which is better.
-
Martin v. Löwis over 13 yearsAgreed, perhaps it does come across that way. I was mainly referring to the "Add current page to breadcrumb" suggestion which would produce the output I gave an example of.
-
YogiZoli over 13 yearsOk let's dump option 1 but do you think that it's a good idea to show in the breadcrumb how a user came to the product even if it was trough a search. For exampe: Home>Search Results>product_1, Home>category_1>product_1 or Home>category_2>product_1
-
YogiZoli over 13 yearsFrom the three possibilities I gave, I have no favorite. It depends on the application. Showing how the user came to the product is probably your only option if you don't have "main categories" and you only want one path in the breadcrumbs.
-
Su' about 12 yearsDepends who you ask. (They actually list one more model there.) At this point, the term basically just stands for the general "x > y > z" visual widget, with a second decision being made by the implementer as to which actual methodology they're using.