Page is a not externally linkable
- Code, Content, and Presentation
-- CSS
---- Separation of Style, Structure & Content


csuguy - 10:14 pm on Aug 13, 2008 (gmt 0)


When I refer to the structure of a page/site, yes I am refering to its positioning in the page - and also how different things function when you put content in them. So things like position, overflow, visibility, top + left, margin+padding, etc.

Here's a simple example of a body that uses css divs (assume an imported css file):


<body>
<div id="content">...</div>
<div id="links">...</div>
<div id="header">...</div>
<div id="footer">...</div>
</body>

So, tell me, from looking at this, what can you really tell about what the page looks like or how its structured? You know the various sections and their content, but you don't know where these are positioned on the page nor do you know how they respond when content is increased/decreased. You don't know what is position relative vs absolute - or even what's just in the normal flow of the document. Heck, you don't even know if the components are visible! And of course the order that it appears in the html is no guarantee that that's the order it will appear on the site.

To figure that out you have to go through a large css file - which is large because it contains style AND structure information. Hopefully you only have to look for an id - but in even moderatly complex designs you have to worry about it being indirectly modified in mulitple spots throughout your document.

It is much easier to edit the styles and structure of a website when they are kept separate! It's the same exact idea as keeping style separate from content - and it works!


Thread source:: http://www.webmasterworld.com/css/3721842.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com