DesignM.ag

The Importance of Breadcrumbs in e-Commerce Website Design

Posted: 05 Feb 2014 08:22 AM PST

Breadcrumbs, or breadcrumb navigation, is a type of navigation that shows the user’s location in a website. They are horizontally arranged text links separated usually by the "greater than" symbol (>) which will show where the user is based in the hierarchy of the site. The term breadcrumbs comes from the tale Hansel and Gretel, where Hansel and Gretel leave a trail of breadcrumbs to find their way back home. Just like the real breadcrumbs that were suppose to help the kids to find their way home, breadcrumbs in web design help the users to find their way around a website.

A lot of times breadcrumb navigation is overlooked in the design process, since a lot of people still see it as something unnecessary. But the true is that this type of navigation can certainly increase usability of a site. For websites with a lot of pages, for instance, breadcrumbs will make it easier for the user to find their way around. Specially because with this type of navigation the user can count on a alternative navigation method and won’t need to click the back button, they just need to check the breadcrumb path and navigate around with fewer clicks, using the given path to navigate from place to place. You can find bellow a simple example of breadcrumb navigation at Google’s news support page.

Breadcrumb navigation will enhance navigation experience by making clear to user where they are in a website. This is why breadcrumb is a great option for e-commerce websites, specially the ones with logical categories of products. A website with clear hierarchy and logical categories can take full advantage of breadcrumb navigation by showing exactly the path the user took to get where they are. And also allowing the user to navigate their path effortlessly. The main gain from breadcrumbs is that you can pinpoint the user inside the hierarchy of your page. So if you have several different levels of product, this is a good way to makes things easier for your users.

The Importance of Breadcrumbs in e-Commerce Website Design
Image via Shutterstock

Remember that the breadcrumb navigation is an auxiliary navigation system, they compliment the primary navigation of website and should never replace primary navigation. Think of breadcrumbs as a visual aid to show your user’s location. Think of it as a simple way to position your user within sections and pages of your site. Here are a few examples of breadcrumb navigation in e-commerce websites.

Zappos

Overstock

H&M

Best Buy

Oak Street Bootmakers

Breadcrumbs are really important to e-commerce because without them sometimes it is difficult for the user to easily browse a collection of products. With breadcrumbs users can seamlessly navigate a website. Specially when the they land on an internal page on your site coming from an external source, breadcrumbs will allow them to see where they are within the hierarchy of your site. This way they can navigate to higher level effortlessly.

For e-commerce websites it is important to retain users and convert visits into sale. This is why breadcrumbs can help facilitate navigation and make it easier for the user to know their way around and find what they are looking for. A lot of times navigation in e-commerce websites are frustrating and users give up to find what they are looking for.

Here are a few bullet points for you to give breadcrumbs a try: