Whenever breadcrumbs in web design are discussed, this is oftentimes referred to a particular kind of navigational scheme that reveals the location of a user on either a website or an application.
This term is taken from the popular children’s story Hansel and Gretel, in which the two main characters lay down a trail of bread crumbs to help them find their way back home once they get lost in the forest. Just like in the story, breadcrumb navigation is used to help individuals find their way back to the points in which they originally started from.
In terms of the development and design process, this particular kind of navigation can often be overlooked. This is because some people see it as being rather unnecessary, while others see site breadcrumbs and the accompanying navigation as being an absolute necessity.
Image source: Asif Aleem
However, there are also people who feel that something like this may be too much of a hassle for everything that it’s worth. Regardless, this is something that can greatly increase the overall usability of any website.
Breadcrumbs essentially offer an alternative navigational method for users to take advantage of, which lets them see exactly where they stand in terms of a website’s hierarchy. From here, the number of steps that are needed to get to a higher level within a website are reduced.
These are representations of the structure of a website of a more textural nature, which not only helps users understand the hierarchy of your website, but also to navigate that hierarchy as well.
Any breadcrumb that is solely based on location should always start with a link to the home page of a website and should always end with the current page that they are on. The last item within this breadcrumb should not be able to be clicked or tapped on.
If there is more than one way of representing the hierarchy of a webpage in the hierarchy, it is possible for a website to contain more than one breadcrumb.
Horizontal lines are mostly used to implement breadcrumbs in the following ways: It progresses one step at a time from the highest level to the lowest level; it begins with the home page and ends with the current page; it contains a simple text link for each level; it has a simple separator between levels that is generally one single character.
Why it’s important to use them
Image source: Kerem Suer
Breadcrumbs make it easier for users to navigate through a website and making sure that all of the content it contains makes sense. This is something that is rather impressing for something that essentially only takes up one single line in any design.
They will not, however, answer any of their pressing questions or address anything involving any confused architecture of the website itself.
Breadcrumbs also show individuals what their current location is in relation to concepts that are of a higher level, which helps them to understand exactly where they are in relation to the rest of the website.
Furthermore, they also offer single-click access to higher levels of the site, which rescues users who end up finding themselves in destinations that may not be very appropriate thanks to search or deep links.
Breadcrumbs have also never been known to cause any kind of major issues in terms of usability. Sometimes, people overlook this, but they also know these can never be misinterpreted, nor are they ever very hard to understand. Even better is the fact that breadcrumbs hardly take up any space on a webpage at all.
Not only do breadcrumbs increase the overall usability of a website, but they can also show the hierarchy of all of the pages of your website, as well as eliminating the need to make any amount of extra clicks.
Breadcrumbs always contain links to other pages within the same hierarchy, which means that visitors will likely find them to be rather interesting to look at, which can also increase the amount of time that they spend on your website.
There are some expert who believe that search engines like Google have been using this kind of data to help determine the overall quality of a website. This means that breadcrumbs that help you achieve high amounts of visibility in one fashion or another.
When you should use them
You should use breadcrumbs when a website’s structure follows a strict hierarchical structure that is of a similar format or when a website’s structure is partitioned into different sections that can be evenly divided into further subsections.
Another proper use is when a user lands on a website from any kind of an external source, such as a search engine or a blog, to make it easier for him to navigate the site.
Also, when a page is located deep within a hierarchy of pages, as well as when no other form of visual navigation shows any details of the same kind of deep level.
If, at any time, a website has a high bounce rate or even high cart abandonment rates, this is often due to one of two different reasons: main navigation that appears to be confusing and missing breadcrumb navigation.
There are also situations when you shouldn’t use them
If you have a website that is single-level and essentially has no logical grouping or hierarchy, then it would not be a good idea to use breadcrumbs in your design. Constructing a diagram or site map to represent the various navigational architecture of the website is the best way to determine whether or not your website would actually benefit from the use of breadcrumbs.
After this, you would then need to analyze whether or not breadcrumbs would improve the ability of the user to navigate both between and within different categories on the page.
When it comes to breadcrumb navigation, this is something that should typically be considered to be an extra feature that should not serve as a replacement for primary navigation menus. Rather, they should be an alternative way to navigate around your website.
Three different types of breadcrumbs
Location-Based Breadcrumbs
This breadcrumb is perhaps the most common, as it helps to indicate where the current page is located within a website’s hierarchy. Users are provided links to pages that are referred to as a “level up” from the page that they are currently viewing.
Path-Based Breadcrumbs
These help to indicate the steps that a user takes to arrive at the page that they are currently on. In addition, users will also see the links to pages that they have visited previously in order to reach the page that they are currently on. This type of breadcrumb is generally considered to be the least popular online thanks in large part to navigation being similar to the basic “forward: and “back” functions.
Attribute-Based Breadcrumbs
This particular type of breadcrumb does not always follow a single path. Rather, it simply describes the attribute of one particular website. This type of breadcrumb is more widely found on eCommerce websites, where single products can be accessible through different paths.
Source: http://ift.tt/1OyUPAO
No comments:
Post a Comment