A life unexamined is not a life worth living. The phrase, or a subtle variation of it, allegedly came from the philosopher Socrates during his trial where Socrates was accused of sacrilege against the Greek pantheons and for trying to morally corrupt his students. The phrase highlights the centerpiece of what Socrates truly believes in; that as a philosopher, Socrates believes in the pursuit of wisdom above all else through questioning and examining every facet of our lives. I’m not in the habit of questioning everything around me but whenever I’m in an introspective mood, I tend to carefully examine how every choices I’ve made led me to where I am in life right at that moment.
I’m not being philosophizing here for the sake of it as Socrates’ philosophy actually has a place in the world of web design in the form of breadcrumbs. Breadcrumbs are a bit of an unsung hero in the world of web design as they’re not exactly the most prominent of navigational features but their usefulness can be quite welcomed under certain circumstances. Taken straight out of the page of the classic fairytale Hansel and Gretel, breadcrumbs is a very useful feature in tracing the path you’ve taken and should be a consideration if you’re still looking for Melbourne web designers worthy of your money.
The road less traveled
Let’s say you’ve just walked into a huge and unfamiliar building for the first time for an errand. Once you’ve finished your errand and about to walk out, you forgot how you got to where you are and you spent an inordinate amount of time trying to trace your steps. Finally, you managed to find an exit but it’s not the one you came in through and as a result you have to walk considerably more distance to get back your car, which just so happens is parked at the other end of the building. This might seem like a joke but this happened to me once after I saw a concert abroad and this is the kind of problem breadcrumbs aim to solve.
Breadcrumbs are a navigational tool in web design that functions as a way to inform users on where they are right now relative to the site’s overall hierarchy. They provide contextual information that tells users not just where they are but also make it easier for users if where they want to go is related to where they are right now. This is most useful in a large e-commerce platform where a user might not be totally on board with the specific product they’re looking at but is definitely interested in similar items. As with any other tool however, breadcrumbs are only as useful as their users so you might want to take notice of the following 4 tips in using breadcrumbs in the world of web design.
Use breadcrumbs when your website’s hierarchy consists of multiple levels
While breadcrumbs are definitely useful they’re only necessary under certain circumstances and since space is always limited on websites, you shouldn’t be using breadcrumbs merely for the sake of including breadcrumbs. In a large e-commerce website for example, breadcrumbs are pretty much essential since they potentially reduce the number of actions a user will have to take just to look for similar items and/or items belonging within the same general category.
Other examples where breadcrumbs can be useful are websites where the focus is on contents. On a cooking blog example, breadcrumbs can be highly useful when you’re looking for say, other chicken-based recipes which would be accessible by simply clicking the corresponding category on the breadcrumbs section of the website. Breadcrumbs are much less useful if every page of your website can be accessed from the navigation bar as breadcrumbs would simply be a waste of space.
Don’t put too much focus on breadcrumbs
Breadcrumbs are like the various guises of potatoes; they make for the ideal side dish but very rarely as the entrée or at the very least, not on their own. This is basically my way of saying that as a navigational tool, breadcrumbs serve a complimentary role and used to augment the main navigational bar in helping users make their way around the website. Befitting of their complimentary role, breadcrumbs should be given the appropriate treatment and focus. Don’t dedicate too much space to breadcrumbs and try to make them obvious without calling attention as you don’t want to give users the idea that the breadcrumbs are your primary navigation tool.
Use attribution-based breadcrumbs for categories that are still too broad
Typically, breadcrumbs are used to detail the site’s hierarchy from the highest to the lowest but there are cases when you might want to expand that definition by using attribution-based breadcrumbs. Let’s say that in an e-commerce platform you have a category for shirts which is then divided into long sleeves and short sleeves shirts but this definition is still way too broad. You have camp collar shirts, Mandarin collar shirts, Oxford shirts, dress shirts, etc but making sub-categories for all these categories can be a little too much and that’s where filters and attribution-based breadcrumbs come in.
By using specific tags, you can further narrow the definition of the products users are seeing and attribution-based breadcrumbs help inform users which category that specific product falls into. This would also help users sort out products and/or pages that might fall into more than one category, such as the humble Hainanese Chicken Rice which might fall into a chicken-based or a rice-based dish in a cooking blog. This is considerably more practical than having to dedicate a category for every common characteristic of your products.
Make sure to use separators for clarity
This is especially important if you’re using attribution-based breadcrumbs as they don’t dictate hierarchy but for categories and/or filter tags. This means that you need at two different separators for your breadcrumbs to avoid confusion on the users’ part. Typically, the greater than sign (>) is used as they imply a linearly descending order but Windows file path uses slash (/) so technically, there are no hard and fast rules when it comes to breadcrumbs separators. Just make sure to avoid confusion and you’re good to go.