Forum Moderators: not2easy

Message Too Old, No Replies

CSS positioning order

         

IONWeb

1:37 am on Apr 3, 2004 (gmt 0)

10+ Year Member



Would like some thoughts with regards to positioning of layers. Here is what I have after the <body> tag(content removed to save space)

<div id="navigation">
<ul>
<li>page 1</li>
<li>page 2</li>
</ul>
</div>
<div id="content">
<h1></h1>
<p></p>
</div>

My struggle is this... is it more important to have the navigation before content so that this is the first thing spiders see?

or

Is it better to have the content first and hope that the spider goes through the end of the content layer to the navigation layer in order to crawl the rest of the site?

Just can't seem to make up my mind which way I want to go ;) What do you guys think?

pageoneresults

2:34 am on Apr 3, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Primary content first, main navigation second, secondary navigation third and then top navigation at the bottom. Normally in that order. It depends on what you have in those navigation elements as to where you should position them.

If you view the site with a browser like Lynx, the positioning of content should read in order. There will be an

<h1>
sitting up there followed by your first
<p>
of content followed by other proper markup and then your navigation includes (I'll assume that you are using includes, makes it so much easier). And at the very bottom you'll probably see all of your graphics, each on a line by themselves. That is where you want static navigation images to be, at the bottom.

bumpaw

2:48 am on Apr 3, 2004 (gmt 0)

10+ Year Member



Page, You wouldn't happen to have a sample bit of code that would illustrate that? I'm looking for total clarity in a foggy mind. :)

IONWeb

3:03 am on Apr 3, 2004 (gmt 0)

10+ Year Member



THanks POR,

Yes, I have all the other divs after the content and navigation divs - the only question was the order of the first two. the H1, H2 heirarchy is also followed in the content layer. Guess I will swap the nav and content... again... (grins) before I get too many pages to swap.

THanks again.

pageoneresults

3:11 am on Apr 3, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Page, You wouldn't happen to have a sample bit of code that would illustrate that?

Its not something I could post sample code for, not in detail anyway. Look at your page as if it were 4 or 5 different sections. Each one of those sections is absolutely positioned from the top and left using CSS.

Because of the absolute positioning, you can now move those sections anywhere you wish in the html structure. You could position them just as if it were a tabled layout, but I wouldn't suggest that.

You now can bring your core content to the front of the html and then stack the other sections in a logical order after the content. The site should degrade gracefully and should have a logical structure if viewed with styles off.

bumpaw

3:51 am on Apr 3, 2004 (gmt 0)

10+ Year Member



Because of the absolute positioning, you can now move those sections anywhere you wish in the html structure.

So you are saying then that SEO is a big reason for using as much absolute positioning as possible. No code required in that case, and it makes great sense. I scare myself when I think I've got it. :)

pageoneresults

3:59 am on Apr 3, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



So you are saying then that SEO is a big reason for using as much absolute positioning as possible.

Nope, that just happened to be a side effect of the positioning. I was mainly looking for a graceful solution for the remaining NN4.x users instead of having to make two separate style sheets. Oh, okay, I guess I knew deep down inside that it might help bring a little more visibility to the page.

It is easier for me to work in an absolute environment as opposed to a fluid one. I can still work with fluid, but there will be certain elements that are absolutely positioned. I have my little screen caliper tool and I move it around my canvas while taking measurements from top and left. I then enter those coordinates in the style sheet and viola, I have my positioned elements.