Moz Q&A is closed.
After more than 13 years, and tens of thousands of questions, Moz Q&A closed on 12th December 2024. Whilst we’re not completely removing the content - many posts will still be possible to view - we have locked both new posts and new replies. More details here.
Html 5 main and secondary navigation for SEO best performances
-
I am building a website which will have a main navigation related to the site and each link of the main navigation will have a secondary navigation. We do not want to use a megamenu style navigation. I will try to explain it with a example:
Let's start with an example for a computer store "My PC Store", the Main Navigation would be:
Desktop PC's Notebook & Tablets
MultimediaWhen clicking on the "Notebook & Tablets" the user is directed to the page domain.com/notebook-tablet.html and on this page the secondary navigation appears: Laptop Netbook Tablets / iPad I am confused on how I should organize the semantic navigation for best SEO performances and I need advice / suggestions. I thought about 2 different ways to do it but which one is more appropriate in terms of SEO? PROPOSITION A Home Page:
<header>
My PC Store <nav>
- Desktop PC's
- Notebook & Tablets
- Multimedia </nav> </header>
Sub-Page (Notebook & Tablets):
<nav>(or
<aside>?)
- Desktop PC's
- Notebook & Tablets
- Multimedia </aside>
</nav>
<header>
Notebook & Tablets <nav>
- Laptop
- Netbook
- Tablets / iPad </nav> </header>
As you notice on the home page the Main Site Navigation is included in the
<header>while it is not in the sub-pages.
PROPOSITION B
Home Page:
<header>
My PC Store
<nav>
-
Desktop PC's
-
Notebook & Tablets
-
Multimedia
</nav>
</header>
Sub-Page (Notebook & Tablets):
<header>
Notebook & Tablets <nav>
- Desktop PC's
- Notebook & Tablets
- Multimedia </nav> # Notebook & Tablets * Laptop
- Netbook
- Tablets / iPad </header>
The main navgation remains always in the
<header>(home page / sub-pages) of all page.
I need suggestions... How would you guys organize the nav ?
</header>
</header>
-
Apologies, typed that up wrong. Have updated above post.
-
Why are you inserting
outside
<header>?</header>
-
My apologies. I would go with the following example in order to maintain a good SEO with your webpage headers and also a solid navigation:
Home page:
<header>
My PC Store
<nav>
-
Desktop PC's
-
Notebook & Tablets
-
Multimedia
</nav>
</header>
Sub Page:
<header>
<nav>
Notebook & Tablets
*** Desktop PC's**
- Notebook & Tablets
*** Multimedia**
</nav>
</header>
**<nav>
- Laptop
- Netbook
- Tablets / iPad </nav>**
Hope this helps.
Matt.
-
-
OK but you don't answer to my question since we do not want any mega menu or drop down menu.
-
This is true if it is wrapped within JavaScript, so that the search engines cannot read it. However, if you use two separate navigation menus then you can negate this problem.
Also, if you were to code up the 'mega menu' style navigation with CSS3 then you could also avoid these crawling problems and make the navigation much more search-engine friendly.
In general, I try to avoid using sub-pages within site to extend navigation (unless it is completely different product areas or business verticals).
Matt.
-
Well there are in general SEO concerns in the use of navigation Mega Menu style and this is why we want to avoid it.
-
Hi There,
I think I have got the jist of what you're trying to achieve.
What I would recommend is that you have links to Desktop PC's, Notebook & Tablets, Multimedia, Laptop, Netbook, Tablets / iPad directly from your homepage. The reason being that this will allow the search engines to crawl your webpages easier and the subcategory pages won't be so deep within the domain.
What I mean is that I would use either a drop down list, so that when the Notebook & Tablets is hovered over, the subcategories are then displayed below it. Alternatively, you could have a secondory naviagtion on the homepage, i.e. with an extensive drop-down list lower down or at the side of the webpage.
Great examples of this type of navigation can be found on: http://www.ebuyer.com or http://www.musicmatters.co.uk/shop.html (look at the secondary nav on the right for the Music Matters shop page.
I hope this helps.
Matt.
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
How is Single Page Application (SPA) bad for SEO
Hi guys. I am quite inspired of SPA technique. It's really amazing when all your interaction with the site is going on the fly and you don't see any page reloads. I've started implementing the site with this instruction and already found nice guys to make the design. The only downside of the using SPA which I can see **is the **SEO part. That's because the URL does not really change and different pages don't have their unique URL addresses.
Web Design | | Billy_gym
Actually they have, but it looks like: yoursite.com/#/products yoursite.com/#/prices yoursite.com/#/contact So all of them goes after # and being just anchors. For Google this mean all of these pages is just yoursite.com/ My question is what is really proven method to implement the URL structure in Single Page Application, so all the pages indexed by Google correctly (sorry I don't mention the other search engines because of market share). The other question, of course, is examples. It will be great to see real life site examples, better authority sites, which use SPA technique and well indexed by search engines.1 -
Location of body text on page - at top or bottom - does it matter for SEO?
Hi - I'm just looking at the text on a redesigned homepage. They have moved all the text to the very bottom of the page (which is quite common with lots of designers, I notice - I usually battle to move the important text back up to the top). I have always ensured the important text comes at the top, to some extent - does it matter where on the page the text comes, for SEO? Are there any studies you can point me to? Thanks for your help, Luke
Web Design | | McTaggart2 -
How to optimize SEO value of links in a calendar
Hi All- I am building a website about outdoor activities (cycling, kayaking, hiking, etc.). The site will most likely be built with either Joomla or Wordpress. A key piece of the site will be a calendar of upcoming events. The calendar will list the basic attributes of each event like date, time and location. However if an event has a webpage of it's own I will also include a link to that page in the details of the event. My question is: How can I create a calendar that will capitalize on the SEO value of the links included in the event descriptions? I've noticed many similar sites put events into a Google calendar and then embed the Google calendar into their webpage. In that situation would Google even see any external links included in the descriptions of the events? Thanks in advance for any input. -Chris
Web Design | | 1968Rouleur0 -
Does having a Blog link in the top level navigation provide any better SEO value, or would having it in a footer or top navigation work just as good?
Trying to decide on whether placing a link to the blog in our top level navigation would have a better SEO value than just placing it in top or footer navigation. I have an ecommerce site.
Web Design | | RPD0 -
Confluence and SEO
I think this is a difficult question so apologies in advance and any help would be appreciated! We currently have a large amount of support center content sitting on our main pages which we don’t think is very effective (mainly basic how to guides). We think it is difficult for visitors to understand and the UI is very poor. In order to solve this we’re currently moving this content onto a subdomain using Confluence, a wiki based team collaboration tool (from a company called Atlassian). What we’re planning on doing is very much like what Atlassian themselves have done on this page: https://confluence.atlassian.com/display/ALLDOC/Atlassian+Documentation What are the SEO issues / dangers that I need to consider before moving this content? I’m assuming that as this content will still be on the same domain then we can minimise link equity / authority loss by setting up re-directs to the new content. Also, has anyone had any experience of using Confluence and whether individual pages can be optimised for SEO? I notice that there are lots of add-ins that can be used, one of which is an SEO add-on which allows you to customise things like meta description tags.
Web Design | | RG_SEO0 -
What is the best tool to view your page as Googlebot?
Our site was done with asp.net and a lot of scripting. I want to see what Google can see and what it can't. What is the best tool that duplicates Googlebot? I have found several but they seem old or inaccurate.
Web Design | | EcommerceSite0 -
Best Website Builder - Help Me Choose
I need to built a multi language site (to built a Pilates, Yoga site) and I will use a site builder. After posting questions on wix.com I came to the fact I should continue my research because there are not SEO friendly. Do you have a suggestions? Limited to html knowledge, using a website builder is my only option. Here are some of the features I need: Multilanguage Web Site Mobile version SEO Friendly Nice Template Selections( this is important) HTML customization Twitter, Facebook, Blog... I'm not looking at free website builder, when you want good features, there is a price to paid. Thank you for your help and suggestions, BigBlaze
Web Design | | BigBlaze2050 -
Best method to stop crawler access to extra Nav Menu
Our shop site has a 3 tier drop down mega-menu so it's easy to find your way to anything from anywhere. It contains about 150 links and probably 300 words of text. We also have a more context-driven single layer of sub-category navigation as well as breadcrumbs on our category pages. You can get to every product and category page without using the drop down mega-menu. Although the mega-menu is a helpful tool for customers, it means that every single page in our shop has an extra 150 links on it that go to stuff that isn't necessarily related or relevant to the page content. This means that when viewed from the context of a crawler, rather than a nice tree like crawling structure, we've got more of an unstructured mesh where everything is linked to everything else. I'd like to hide the mega-menu links from being picked up by a crawler, but what's the best way to do this? I can add a nofollow to all mega-menu links, but are the links still registered as page content even if they're not followed? It's a lot of text if nothing else. Another possibility we're considering is to set the mega-menu to only populate with links when it's main button is hovered over. So it's not part of the initial page load content at all. Or we could use a crude yet effective system we have used for some other menus we have of base encoding the content inline so it's not readable by a spider. What would you do and why? Thanks, James
Web Design | | DWJames0