Do you remember the story about Hansel and Gretel? Two kids lost in the woods left a breadcrumb trail with a hope to follow it and come back home. Although their plan didn’t work out, that idea was brilliant. Hansel and Gretel are just the characters of a story for kids, but their situation is very common. While GPS helps modern people to make sense of unfamiliar territory, breadcrumb navigation is what allows users to find their way through websites.
What are breadcrumbs?
Breadcrumbs, or navigation chain, are a website navigation element. They display where exactly on a website a user is currently situated. Breadcrumbs look like a path from the root of a web platform to a document viewed at this moment. They remind signs showing directions:
- Homepage –> Website section –> Section record
- Homepage –> Archive –> Section record
Breadcrumbs answer three user’s questions:
- Where am I? – by displaying visitors’ location and its relation to website hierarchy.
- Where can I go? – by helping to find different sections & pages easy, even if users visit it for the first time.
- Should I go there? – by explaining content value, inviting for further browsing.
- Breadcrumbs improve sites’ usability. Visitors clearly understand where they are located and how to get to a particular page or section.
- This is an effective tool for interlinking, capable of increasing PageRank of separate pages and web recourse in general.
- Breadcrumbs simplify the navigation considerably.
- They participate in creating easily readable snippets – text description displayed in search results.
- They create proper link anchor weight.
- They positively influence behavioral factor, meaning an increase in time users spend on a website and a positive influence on its ranking.
Judging from the facts above, breadcrumbs always benefit websites. Therefore, their presence is desirable on every Internet resource, except maybe single-page business card sites. For information portals, online stores, corporate resources, blogs, forums, etc., they are very desirable.
Where can you use them?
Despite obvious advantages, breadcrumb navigation is not always used. Owners of sites with convenient, intuitive navigation menu often neglect this feature due to a small number of pages or well-structured sections. Some use sitemap as an alternative option – breadcrumbs HTML map (don’t confuse with sitemap.xml file uploaded for search engines).
There is no specific formula for using breadcrumbs. The purpose of breadcrumbs is to show users where exactly on a website they are located at the moment and allow a quick return to one of the previous sections. If any website page is available in two clicks from a homepage, breadcrumbs are not necessary. Thus, breadcrumbs are used the most frequently for webshops; forums; sites without sitemap; sites with poor navigation.
Web shops often have problems with navigation. They sell items that hardly belong to any of the featured categories or aren’t divided into sections at all. The absence of filters for search cause inconvenience, too. Altogether, website structuring becomes trouble.
Usual navigation on forums is impossible due to their dynamic structure. New topics replace the old ones, new sections and categories appear all the time, and there are more posts than articles in any blog. Users will just get lost without breadcrumbs.
- Breadcrumbs usually look like a horizontal line located at the top of the page. Vertical option is possible but very rare.
- Navigation chain should fit in the general website design harmonically to have an overall positive effect on users.
- The final element should not be clickable; otherwise, the chain will turn into iterative reference – a link that leads a user to the same page they currently view.
Types & examples
Location-based. You build the complete user’s route from a homepage to a current page. Navigation is included in the description, so users understand a website structure from the moment they see it among search results. This is the easiest and most common way to arrange breadcrumbs.
Linear. This type is especially useful in a situation when a user lands from search results on a flypage and wants to reach common categories, continuing their search on the site. Such an approach helps to support and hook potential clients and positively influences visit depth. It leads to improving behavioral factor and strengthening ranking positions.
Attribute-based. Breadcrumbs are formed by grouping tags, categories, and subsections to which a page belongs. It is suitable for online stores with a large number of goods (you can choose all refrigerators of a certain brand, color or size) or information sites (you can see all the news about a particular person, category or country).
Path-based. Instead of displaying the full route, add Back button. It duplicates a similar browser function but makes it more convenient and more varied. The button is suitable, first of all, for webshops and sites with many filters. When users click on the Back arrow in a browser, filters are usually reset, and they have to re-configure everything. Some will choose to go to a more convenient site instead. Back feature resolves this issue by returning you to a previous page with all selected navigation and search settings.
How to implement breadcrumbs SEO?
Using structured data transfer can slightly improve website positions in Google’s search results. Google supports three formats for the transfer of structured data – JSON-LD, Microdata, RDFa. It is recommended to use Microdata or RDFa for the registration of bread crumbs. Below, you can see an example of code design in Microdata format for BreadcrumbList data. This is how breadcrumbs are displayed on Sitechecker.pro.
There are several things about WordPress breadcrumbs that will be useful for you to know:
- They are displayed on the following types of pages: page navigation that starts from the homepage (website.com/page/2/); categories archive; tag archive; daily archive; monthly archive; yearly archive; author archive; random record type; page; post; search result; 404 error page.
- The page number is featured for 2nd and further archive pages.
- You can specify any spacer character between links.
- You can set texts for Homepage links.
- Integrated microformat markup by Schema.org.
Mistakes to avoid when implementing breadcrumb navigation
- Do not turn the last element of the navigation into a link, for example, Home > Blog> Article.
- Classify pages accurately. Don’t create pages that can belong to several categories – that will puzzle a user.
- Don’t duplicate the main navigation. It should be clear and functional, while breadcrumbs serve as an additional means of navigation only.
- If you use too many keywords in breadcrumbs website chain, the probability of applying filters by search engines increases.
- Do not use breadcrumbs if your web platform doesn’t need them.