Breadcrumbs have been used since the time of Hansel and Gretal so people can find their way back from whence they came. Luckily, web bread crumbs work better than the ones that Hansel laid down.
Basically, it is a way for users to see how deep in the web site’s navigation they’ve gone, and how to much up a level.
UI testing has found that bread crumbs are not used by many people (some studies say less than 5%). However, of the users that do use it, they are found to be very speedy in use. This is makes them into a super user of sorts.
To build it, you can use ordered list, with a class of
breadcrumb. An example of this is:
<ol class="breadcrumb"> <li><a href="#">Home</a></li> <li><a href="#">Catalog</a></li> <li><a href="#">Men's Clothing</a></li> <li class="active">Shirts</li> </ol>
Notice the simplicity of the code.
Bootstrap will add the slashes automatically via CSS by using the
:before selector and the
active class is used to designate the last element in the list, and define it as the page that the person is on.