Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I've been reading several SEO books in preparation for a full site re-write. One of the suggestions that I've seen several times is that content should come before navigation in the site's markup.

Question: If a site is using top-level navigation, how can content come before navigation (in the markup, not the presentation), and is this really necessary?

share|improve this question
1  
I don't think it matters. Less you read those books better. Construct your website from usability point of view. USER is important not google bot. Ans since google is trying to read the mind of the USER, google bot will be happy when user is happy. –  Sandro Dzneladze Jul 20 '12 at 12:06

4 Answers 4

up vote 1 down vote accepted

Content before navigation (in the HTML, not necessarily in terms of the layout on the page) is more useful for accessibility than SEO. I would do it for those reasons.

Those using screen readers will get the content quicker than if they have to hear every item in every drop down menu on your navigation.

share|improve this answer

That doesn't sound right, placing content above the navigation bar. Is that what these books are suggesting? The majority of websites have navigation either horizontal across the top such as Zappos and Amazon or vertically on one side or the other like ebay.

Using text when possible above your navigation is ok if it's done cleanly and for your visitors not search engines.

You can suggest for your site review to switch from images to text links in the navigation, use CSS to give them style. Add alt text to images. There's so much that's involved in on-site optimization that content above or below the navigation is a small part.

Years ago people would set their z-index of div tags to place certain content above other content in hopes search engines would read it in z-index order. If there's any truth to that you can set a lower z-index on your navigation wrapper.

share|improve this answer
1  
No, the books are not saying content above navigation for the user. They seem to indicate that that content should come before navigation in the code, but not in the presentation to the user. I mention that in my explanation but not in my question. I'll update to clarify –  James Hill Jul 19 '12 at 20:07
    
I suppose you could have your navigation after the content within the code, and absolutely position your navigation div within a wrapper making it appear above the content while the code is below. I just don't see this being beneficial when so much more is in play. If you have good meta descriptions Google will use that in search results. Once a visitor is on your site what does it matter where the code is? –  Anagio Jul 20 '12 at 23:13

Question: If a site is using top-level navigation, how can content come before navigation (in the markup, not the presentation), and is this really necessary?

I couldn't disagree with this more. IMO, your site navigation should come ahead of SEO (may be not a popular opinion). This allows pages to have the general navigation displayed in Google: EG amazon https://www.google.co.uk/search?q=amazon&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:en-US:official&client=firefox-a

And since your site navigation is typically quite a small list (you get more navigation options from clicking these 'general route level menu links' which allow you to drill deeper) I don't think there is any penalization at all - to swap the whole page around could make maintenance more difficult, but will certainly not read well to Google IMO.

However, ensuring that the page content is pretty much the next thing that is read by Google is important. Use a lynx viewer or similar - again, my opinion but after the menu, there should be a heading tag and content / about the page (even before products - from as little as a paragraph).

share|improve this answer

It would technically be possible, I think, if you applied:

position:relative

To the page's container class and:

position:absolute

To the nav element.

Visually it would look like the standard nav-above-content layout, but from a coding standpoint it would be the opposite.

Like this example: http://jsfiddle.net/AFK9j/

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.