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
-
HTML and XML sitemaps for one website.
Hi all, First, we have created a HTML sitemap for our wordpress website. Then we again generated XML sitemap and submitted same in search console. It's been more than a week and still new XML sitemap has not been indexed yet. I can still only see HTML sitemap for search results "company sitemap". Also search console do have only XML sitemap. Both sitemaps are accessible but only HTML has been indexed. Is there anything wrong having 2 sitemaps? Why XML sitemap not been indexed? Thanks
Web Design | | vtmoz0 -
Server performance and loss of rankings
Hi all Wondering if anyone knows how much poor server performance is needed to affect your Google rankings. A few sites of mine were performing fine until about 11am today, since then the site traffic is down about 99% (eeek) at the same time the server was playing up with a server load about 40 - it's 12core, 64ram. I was having database issues at the time too. Surely Google doesn't work that fast in demoting sites for poor performance does it? If not need I need to ponder other reasons why i have no traffic anymore. Thanks, Carl
Web Design | | carl_daedricdigital0 -
Parallax websites - good for SEO?
A client of mine is redesigning their site using a vertical Parallax & upon doing some research I've stumbled across Drew Barrymore's site: http://flowerbeauty.com/ - which also uses Parallax. What I like in particular is that the site changes URLs as you scroll down. If you go direct to one of those URLs you'll notice unique meta data (albeit poorly optimised). All pages are indexed fine in Google (https://www.google.com/#bav=on.2,or.r_cp.r_qf.&fp=f8873f78dfbb8c5e&q=site:flowerbeauty.com) I'm just wondering if this is considered ok as the user experience is good and they're not doing anything manipulative, however, there's duplicate content and a potential case of cloaking at hand. I think this approach may be ok for my client for a product features page or a global office locations page since I can break up the sections nicely and split a really long page featuring a lot of content into separate URLs. Whereas Flower Beauty have done it across the whole site... i.e. one page of HTML = the whole site. What do you guys think?
Web Design | | wojkwasi0 -
Switching from HTML Static to WordPress Platform - SEO
Hi All, Hope everyone is doing well. I am currentyl in the process of having a re-design to myu HTML Static Site, I am switching to WordPress. My site is still running now until the new one is prepared. My question is: I do rank pretty well for some of our strong local keywords, we also have a FEW links pointing to inner pages with an extension of .HTML, should I set the the WordPress URL's to reflect .HTML or will the Search Enginesfigure out that http://www.domain/innerpage.html is the same as http://www.domain/innerpage/ or is it NOT the same. Should I switch or not? Thanks for your input Jimmy
Web Design | | jimmy02250 -
Changing from All-in-One SEO to Yoast SEO
I am currently using, and have always used the All-in-One SEO plugin for my website, but I have have heard time and again that the Yoast SEO plugin is superior. How do I transfer to this plugin instead? Do I need to deactivate the all in one seo plugin? What happens to all the tags that are already there for the thousands of pages, including the main page, that is functioning from the all in one SEO plugin?
Web Design | | dtlalaw0 -
Mozcon London 2010: Top 10 tips - Design for SEO PPT Not Available for Download!
Hi - title says it all really! Just watched the video and throughout it they refer to the wireframes/site examples being available via the ppt download. However, even as a PRO member having purchased the DVD bundle I cannot find a link to download the presentation. Can anyone help please? Thanks in advance!
Web Design | | BlakMajik0 -
Best way to set up a site with multiple brick and mortor locations across Canada
I have a client who is expanding his business locations from 2 cities to 3, and working towards having 10+ locations across Canada. Right now we're building location based landing pages for each city, as well as keyword targeted landing pages for each city. For example, landing pages for "Vancouver whatever clinic" and "Calgary whatever clinic" as well as for "Vancouver specific service", and "Calgary specific service". This means a lot of landing pages will need to be created to target each of 10 or so desirable "service" keywords for each city's location. I've no issue with this, however I was wondering how other companies go about this? What's the best way to be relevant for certain "service" based keyword searches in each city? Many of the "service" keywords are 'localized' meaning they will show Google Places results for local brick and mortar businesses for each location. I'm quite good at optimizing locally for this type of thing. However, many of the "service" keywords are not yet 'localized' by Google, I'd want to have my client webpages show well in the SERP's. for these 'non-localized' "service keywords" as well. the new site will be built in WordPress
Web Design | | AndyKuiper0 -
Are HTML sitemaps still in use today?
I'm trying to help a client understand the importance of having a well-organized HTML site map as a method of helping usability. As part of this process, I spent some time searching for good examples of well-organized HTML site maps, and found that many sites don't offer one (including SEOmoz). I'm wondering if webmasters and/or SEOers think they aren't valuable any longer?
Web Design | | EricVallee340