As we get more used to “mobile-first” website design, it’s interesting to consider navigational strategies for big-site SEO and how we can maximise SEO performance using site architecture choices — particularly in e-commerce.
Here’s a scenario: You’re called up by a major international retailer. They’re doing a full rebuild of their site to finally put to bed their painful technical legacy CMS system. They’re planning to build mobile first and are aware that their mobile-first philosophy shouldn’t extend to their desktop navigation. They are aware of the benefits of a mega menu, but they also understand that it can end up being detrimental if taken too far.
Their two-part question is this: What is the best practice implementation of a mega menu for SEO, and what (if any) SEO considerations should also be taken into account when determining the “tipping-point” of mega menu usefulness?
Best Practices In Mega Menu Implementation
Let’s first tackle part one of that question, as it’s the easiest to answer. What’s the best practice implementation of a mega menu?
Only a few considerations are truly pertinent here:
- Crawlability
- HTML simplicity/relevant semantic implication
- Code order placement
Consider this: Google performs “templating” when crawling your site. Accessing many thousands (or, indeed, millions) of URLs allows Google to quickly understand the templates used in the construction of your website. They will know if a link is in the footer; in persistent, site-wide main navigation; in a category-dependent supplementary navigation; and so on. These links are not treated the same as main content links.
We also know that when Google encounters multiple links to the same page, it will tend to use the anchor text of the first link encountered — usually. It’s certainly the case that Google can ignore “navigational” link anchor text when it is particularly poor (e.g., “read more”) in preference of better anchor text to the same page found farther down the page code.
My preference is not to leave interpretation to Google if at all possible, which is why my first piece of advice for mega menus is this: Try to include it in the HTML after the main body content.
It is, of course, perfectly possible to use CSS3 to take an elegant, clean mega menu (such as this sample) and position it absolutely. Using semantic HTML5, we check all three of our key criteria.
By placing our navigation after our main content in the HTML code, we also increase the render opportunity for page speed perception for the visitor and allow our main content the best opportunity to flow value to links included by our editors, imparting their anchor text to signify the linked page’s meaning more clearly to Google.
Fixing this moves us into the murkier grey area of the second part of the question: How much is too much?
Keyphrase Saturation & Menu Depth
To tackle that question, we should perhaps first rephrase our question to, “How deep is too deep?”
The depth to which a mega menu should go is an assessment against two opposing forces: How strong is your domain, and how broad is your inventory?
Domain Strength & Breadth Of Inventory
If you are an average-sized international retailer, you’ll likely be specializing in some way, even if broadly — say, books. Using that example, our mega menu might have a broad range of top-level categories (Biography, Crime, History, Romance, etc.) and many ancillary top levels (Editors’ Picks, Offers, Collections, Short Stories, etc.).
Before considering how many of these to include and what depth each requires, we need to consider how much SEO value we have to spend. Fundamentally, this comes down to our backlink profile. If you have a diverse range of naturally built links accumulated over the last decade, no paid links or dodgy affiliate schemes, and no overwhelming batches of same-text anchor text, then you have way more depth available than a new brand startup planning to launch cold.
Assessing this “SEO strength” accurately is key. Spend time and use multiple tools (Google’s Search Console, Moz and Ahrefs would all get my vote). Ask yourself if you really believe the mass of thin-content directories you’re counting in there should be considered as value-adds and not value subtraction (it’s the latter, BTW).
So assuming we have good domain link strength, what’s my advice?
Keep It Minimal And Silo Your Mega Menus
For the home page and top-level pages outside of the main bulk of your inventory categories, use a mega menu heavy on visual clarity and anchor text written to clearly communicate the link location (and not keyphrase stuffed!). Include a prominent search box either within the menu or visible with the menu expanded to provide an opt-out.
Do not link to more than four or five individual items in any one department (and potentially, link to none at all). Why? Deep-level pages linked from the home page or very top-level pages should be changed frequently based on SEO priorities, and frequently changing main navigation isn’t best practice for usability.
Instead, at most consider a small, rich-text element to the mega menu (a “spotlight” or “deal of the day” segment, editable via the CMS directly), which can be used to perform this priority linking function. This is hugely powerful if you have, say, a seasonal priority, and you need to give an SEO boost to get a number one ranking from your main rival. Change this section, and that’s a strong signal to Google that your domain SEO weight should be thrown behind that particular priority at that time.
Use Visual Styles To Distinguish Between Categories
For each category, plan a mega menu themed to show the subcategories in the same visual style, with a visual marker indicating you are in a departmental navigational element (differing background colours, tied to main mega menu colouring for that department).
What Links To Include In A Mega Menu
Do not ever include a link within your mega menus (or anywhere, for that matter) to a page that just lists everything on a single page, like a mammoth sitemap page. That flattens out your site hierarchy and removes your ability to “Spotlight” or prioritize pages with minor tweaks to mega menu content or other top-level body content.
You sacrifice your only fast, flexible SEO capability on the altar of misplaced usability concerns or crawlability. You will have sitemap.xml files, and your CMS should be able to keep everything linked via siloed mega menus — so don’t hamstring yourself just for some extra, legacy navigational itch you wish to scratch.
Instead, allow all mega menus to link to the first page of a crawlmap (a multi-page sitemap), which mirrors the silo linking described above (and which alters as the mega menu is altered), but with more leniency in the number of items linked in each category sub-section. This can be useful for users struggling with overlaid navigation generally.
Consider, for example, the omni-seller that is Amazon and the brevity of their sitemap, and ask yourself if you can perhaps drop those 200 or so links to anchor-text-rich products that vary only by colour (and again, yes: drop them).
All that being said, you should now be well equipped to solve your hypothetical client’s site architecture for some delicious SEO gold. Enjoy!
The post Mega Menus & SEO appeared first on Search Engine Land.
No comments:
Post a Comment