A website’s navigational mechanisms act like road signs, guiding a user along their journey through a digital space. Whether the person sitting in the allegorical driver’s seat has a specific destination in mind or is open to being surprised, your site’s nav links are there to indicate where they are and where they have the possibility to go.
Ultimately, that’s what it all boils down to. Possibility. Creating a framework of possibility where the user’s next step appears effortlessly and intuitively in front of them. Every button, tab, hyperlink, and menu item is an invitation to keep going. An encouraging nudge along the path towards a conversion.
Part of building a great website is realizing that when a visitor becomes disengaged or uninterested, it’s not (usually) because they’re bored, it’s because they don’t see a way forward. They’ve lost the thread. So, to keep them on board and on track, you have to continuously present them with incentives to press onward.
Every user approaches a website with a different mindset, and for many different reasons. Placing intuitive and thoughtful navigation systems throughout the site is crucial to the user experience and effectiveness of the site.
There are a few different types of website navigation that vary in size and function. The big ones lead to central, indispensable pages. The smaller ones lead to whatever is most immediately relevant to the user based on their location and potential needs. It’s just like how some signs along the road point to major highways and neighboring states while others point to local backroads or the nearest gas station.
We’ll touch on all of these classifications of web nav throughout this blog, but center it all around the smaller, context-dependent links since those are the ones that afford the most room for improvisation.
What is contextual navigation?
To us, “contextual navigation” refers to any link, tab, button, or menu that is uniquely tailored for a specific page. The purpose of these mechanisms is to provide users with smooth and convenient pathways through which they can explore content related to the topics and information being discussed on that page.
Offering users timely access to content that they might find topical or interesting is mutually beneficial for businesses and consumers.
This is different from structural navigation because contextual links have little to do with your website’s rigid informational architecture/hierarchy. As such, they afford more room for creativity and improvisation. So long as the link adds value to the page, it can go virtually anywhere. Whether it’s to another page on your website or off into the elsewhere of the internet, it doesn’t matter as long as it’s valuable.
What are the benefits of contextual navigation?
For you – the marketer – inviting people to jump around to “related articles” or “similar products” is a great way to retain their attention and solidify their interest in your brand.
For users, having the option to dig deeper into a topic makes the whole experience richer and more rewarding. These links also help them intuit where they are on the website based on what’s being presented as thematically “related.”
On the tech side, smart internal and external linking is a tried-and-true method for boosting SEO. Sure, search engine algorithms may change like the wind, but hyperlinks will always have a role to play in the pursuit of higher SERP rankings.
The upsides of investing in well-thought-out contextual navigation are bountiful. But, before we continue delving into this cornucopia of benefits (and how to go about reaping them) it’s important to zoom out a bit to gain a sense of contextual nav’s, well, context.
The different types of website navigation
Most websites’ navigational mechanisms can be divided into two categories: Structural and contextual or “associative.”
Structural website navigation
This top-level category can be further broken down into two subsets: Global and local.
Global links typically reside in the header of all or most of your website’s pages. Since this is such precious real estate, they usually contain big titles like “About Us” or “Our Products.”
Local links are more specific and only live on certain groups of pages. For example, within the “products” page, there would be a menu of local nav links to the different types of products.
If you think about a web page like a physical space, global navigation lets users where they are while local navigation lets them know what’s around them.
It’s a subtle distinction. But, as with all aspects of digital marketing, details are never just details. Understanding how the pieces of the IA puzzle fit together will only help you build better websites.
The importance of global navigation
Alright, story time.
Imagine you live in a city. One sunny afternoon, you decide to get a few steps in and explore a new part of town. You grab your phone, keys, wallet, and walk out the door with no particular agenda.
For about an hour, you follow your gut, wandering down side streets and public alleys until, at last, you encounter a street you don’t recognize containing a sprawling series of storefronts you’re totally unfamiliar with.
Stopping for a moment, you take stock of your surroundings. You think, okay, I may not know this particular neighborhood, but I know the city well enough.
So, you turn your gaze upwards, high above this row of small, unfamiliar shops and apartments and towards the ever-present city skyline.
Right away, you spot a seven-hundred-foot-tall monolith of a building. You know that this particular tower is on the west side of town. Given your distance from the structure and the angle at which you’re viewing it, you intuit that where you’re standing must be somewhere on the south side. From there, your mental GPS fills in the blanks.
In the world of website design, that sky scraping-ly large edifice would be a global navigation item. No matter how far you wander away from home, it’s there to help you get back on track.
This is the main purpose of global nav mechanisms: To be big, load-bearing features that bring order to your website and help users construct a mental map of their digital surroundings.
Local Navigation
Also called “sub-navigation” due to the fact that it’s one step below the main navigation, these links are specific to whatever group of pages you’re browsing. The word “group” is an important qualifier there because the purpose of local navigation links is to guide users in their exploration of a particular subset of pages within the larger website.
Although their existence is context-dependent, local links are different from contextual links. In fact, they serve a nearly identical function to global links: helping users see the bigger picture.
The only dissimilarity is that they’re helping users see the bigger picture within the smaller picture. That may sound a bit confusing, but it’s okay because it is, once again, story time…
The importance of local navigation
Returning to our thought exercise from before, you’re standing on a street you don’t recognize in a part of town you’ve never explored. Only now, you’ve broadly pinpointed your location with the help of familiar, global landmarks.
Shifting your focus back to street level, you continue walking, slower this time to give your senses a chance to soak up the novelty of the place. The sights, the sounds, and even the smells are a shade different from what you’re used to.
Out of this dense sensory atmosphere, a welcoming oasis shines through. The unmistakable wooden sign of a local pub. Chipped paint and all.
Picking up the pace slightly, you press purposefully onward down the sidewalk, past the gauntlet of cafes with their string lights and ad-hoc outdoor seating arrangements.
Fifty or so yards later, you arrive at your destination.
For website designers, that enticing wooden pub sign that attracted your attention (and all the other signs that didn’t) are local navigation mechanisms. They let you know what’s around you. I.e., what all is in this neighborhood?
On your company’s About Us page, for example, you would present users with a menu of local sub nav links to “our story” or “our team” or “our culture.”
These are important because, in all honesty, not everyone will care about your firm’s origin story, BUT they might be interested in seeing all the smiling faces that work in your office. Or maybe they aren’t interested in browsing your current roster of employees but do want to read about your company’s history.
Whatever the case may be, we can say with confidence that a sizable portion of visitors doesn’t arrive at your website with a specific goal in mind. Just like you didn’t venture into that new part of town with a predetermined agenda. Rather it was through intuition and curiosity that you stumbled upon something that struck your fancy.
Cities are typically less organized than websites, but the basic principle holds. You turned down a street and were presented with a unique series of clearly labeled options. If you turned down a different street, you would have had a different series of options.
(Although, in Boston, those options would naturally and invariably include a Dunkin and a CVS.)
So, to tie up this parable about structural navigation, you looked up at the skyline and saw where you were in the city (global nav). Then, you examined your immediate environment and saw what was in that specific neighborhood (local nav).
With these two foundational pieces of context under our belts, we can finally move on to the reason you clicked on this blog in the first place: Contextual nav.
Contextual navigation
By the time this classification of links comes into play, you’ve successfully guided users to a bit of content that they’re at least somewhat interested in. Whether it’s a blog post, an educational resource, or an individual product page. Every turn they’ve taken, every decision they’ve made (or not made) up to this point, has led them to where they are.
At any other phase of their journey through your website, associative linking would be a bit presumptuous or premature. For example, on your products overview page, you wouldn’t have a module titled “you might also like” because the user hasn’t had a chance to find what they like yet.
On these more hyper-specific pages, however, you can make an informed guess at what they’re interested in because you have a more distilled and refined idea of who the user is.
Benefits of contextual navigation links
Using contextual links, you have an opportunity to capitalize on readers’ curiosity and retain their attention by presenting them with pathways to more content that they might find useful. This can be done throughout an article or blog post by including text-anchored hyperlinks to pages on your website that support or give context to what they’re reading. You can also include links to resources on other reputable sites that validate a claim you’ve made or otherwise bolster your credibility.
Both of these linking strategies have the potential to boost SEO. Internal links because they are the spokes that hold a topic cluster together and help search engines index your content. External links are helpful because they signal to search engines that your content offers authoritative, research-backed information that would be valuable to readers.
From an inbound perspective, garnishing a page with persona-specific contextual nav links and menus naturally strengthens user paths by suggesting content that that persona would be entertained or delighted by.
We say it does this “naturally” because, odds are, you created that blog post or landing page with a certain buyer persona in mind, so the pages that you encourage those personas to explore will be inherently aligned with their pain points and hoped-for solutions.
For this same reason, associative links can help increase the time that users spend on your site. In our experience, a great way to increase engagement is by giving people more things to engage with. Essentially, you shouldn’t give them the chance to get bored. Attention spans are growing increasingly short, so always have the next opportunity for users to interact teed up.
How contextual navigation fits into our story
You probably get the picture by now, but we started this narrative so we might as well put a bow on it. That’s what makes Heartbeat different; sometimes we just write things because they’re fun to read. We want our audience to come for the information and stay for the entertainment.
Okay, you’re in the pub…
It’s the middle of the day so you’re able to secure a booth near a window all to yourself. Beams of afternoon sunlight cut through dust motes pluming off billiard tables, the air smells faintly like Pine-Sol, and you can hear the low hum of a neon Miller Lite sign out front.
Your peaceful moment of silence is broken, but not disturbed, by a friendly, heavily accented server. She offers to take your beverage order and then whisks behind the bar to assemble it, something she could probably do blindfolded. The clink of ice cubes echoes off the tin ceiling and wood-paneled walls.
While you wait, you notice a patchwork of paper flyers over by the entrance that local artists have either scotch-taped or pinned to a chewed-up old bulletin board.
One of these flyers advertises a free comedy show on Thursday nights taking place in the back room of this very bar. Interested, you make a note of the weekly event on your phone in case you’re ever in need of a date night activity.
For web designers, that flyer by the door is a contextual nav item. The user didn’t arrive looking for it, but once they’re there, it catches their attention and nudges them towards further engagements.
But the flyer has to fit the setting. The contents of that piece of paper would be wildly out of place in a posh department store or a museum lobby but basking in the warm light of a local tavern, it’s perfectly appropriate.
Viewing website development through this real-world lens will help you better understand and create personalized user pathways. When a person arrives on a landing page or clicks on a blog post, pretend that they’re walking into a physical space and surround them with things that would draw their gaze and enhance their experience.
Context is a powerful thing and understanding how and where to incorporate things like navigational mechanisms is how you’ll encourage fruitful patterns of behavior that lead to conversions.
If you’re interested in talking through your website’s user IA or navigational framework, our team would love to chat. Choice architecture and intentional design are two of our favorite aspects of digital marketing and something we take a great deal of pride in.
