Breadcrumbs in web design

Breadcrumbs in webdesignNavigation is one of the most important element of an effective web design. Good navigation can lead to increased user engagement and reduced bounce rates for your website.

Navigation is analogous to an index of a book, imagine a book with 500 pages, you need to look for a certain topic and you find that the index is so cluttered that you cannot locate the topic you want to read. Your site is just like a book for a visitor and navigation is its index. When a user comes to your site, he/she is looking for some information i.e. they have a goal or a need and if you don’t serve that need quickly, most likely the user will bounce off.

Though navigation in itself is a huge topic, one of the most important element of Navigation is “Breadcrumbs”.  Breadcrumbs are particularly more important for Blogs which have a higher bounce rate and average pageviews per visitor close to 1

So, What do you mean by a Breadcrumb?

A Breadcrumb is a secondary navigation that enhances user experience on the site. It is a small navigation generally below the main menu/navigation or above the page heading, indicating your current location.

Check out this example: CSS-Tricks.com
breadcrumb navigation

In this example breadcrumb is under the heading CSS almanac (in blue).

breadcrumb navigation in web design

Breadcrumbs is also like a history for the user, it indicates we went to “CSS Almanac” from “Home” and thereafter to “Selectors” and then to “D”. It helps users to navigate easily to higher level pages with fewer number of clicks.

Do you know from where does the name “Breadcrumb” came?

The name actually came from a fairy tale of two siblings, Hensel and Gretel. While walking in the woods they dropped breadcrumbs, so that they can return home safely. That was how it was named.

Why should you use Breadcrumbs?

1. Ease of Navigation.

2. Reduced bounce rate.

3. Increased time on site.

4. Enhances usability.

5. Increased internal linking and as a result search engine visibility.

6. One click access to higher level pages.

If you don’t have breadcrumbs implemented on your site, you should plan to implement it asap. It will improve your site’s usability, decrease bounce rate, and most importantly enhances user experience.

If you’re are WordPress user finding a plugin for your site is easy, Yoast has created an awesome plugin for breadcrumbs you can download it form below link.

Yoast Breadcrumb Plugin for WordPress

 

August 28, 2012

0 responses on "Breadcrumbs in web design"

Leave a Reply

top
Template Design © VibeThemes. All rights reserved.

Privacy Preference Center

Necessary

This cookie is set when you login to your account at VibeThemes. VibeThemes based on WordPress sets this cookie, which indicates when you're logged in, and who you are, for most interface use.

WordPress uses the two cookies to bypass the password entry portion of wp-login.php. If WordPress recognizes that you have valid, non-expired cookies, you go directly to the WordPress Administration interface. If you don't have the cookies, or they're expired, or in some other way invalid (like you edited them manually for some reason), WordPress will require you to log in again, in order to obtain new cookies.

wordpress_logged_in_[hash],wp-settings-{time}-[UID]

Advertising

Analytics

Comments

When you comment on VibeThemes blog, they too get cookies stored on their computer. This is purely a convenience, so that the visitor won't need to re-type all their information again when they want to leave another comment.
The commenter cookies are set to expire a little under one year from the time they're set.

comment_author_{HASH},comment_author_email_{HASH},comment_author_url_{HASH},

%d bloggers like this: