October 9, 2006 After reading my last post on CSS and SEO, a buddy of mine asked for a more detailed reason on what exactly about CSS will reduce the amount of code. I figure, «hey, I got a blog. Might as well explain it here.» Do yourself a favor and read the original post, ‘CSS and SEO’ so that you are at least familiar with the idea of CSS. So, now we know what CSS is and that it helps, no? Well here is an example: Let’s just say you want to have a section of text on your site. With HTML we would normally place a table on the page to set aside an area for the text like so

Text that would be in the table.

That’s not too much I know, but stick with me. In CSS we could declare a ‘div’ tag on a completely seperate page that the crawler wouldn’t have to drudge through, but the browser would adhere to. Like so» .spacesaver { position:absolute; left:thismuch: top:thatmuch; height:whatever; width:whatever; background:mycolor; border-style:neatborderstyle; border-style-width:furthercustomization; } Now this looks like a lot more code, but notice a few things. Not only can I make the same table I could in HTML, but I can also determine a lot more aspects like the border style, color, and width, and the exact placement of the text area. I could go further to determine the font information, but normally I would do that in a seperate definition. But how does this help in our code? Well when putting it in the HTML page it would look like this:

Text that would be in the table.

So that’s a lot less code. And anyone that has been building websites knows that the original table we had would not really suffice. The real saver comes when we would normally make nested tabels, requiring a great deal more code….a great deal. Also, when it comes to table as in this example, the browser reads tables from inside out. So having nested tables, with all sorts of declarations on the look of the table, could create a lot of code. Also consider the amount of code it takes to declare how each ‘

looks in the HTML, or every header tag. Everything that you can do in HTML to determine the look and placement, can be done in CSS. If this helps, let me know. If it doesn’t help. Let me know.

The URI to TrackBack this entry is: http://www.seo-factor.com/Blog/bblog/trackback.php/15/

Line and paragraph breaks automatic, HTML allowed: