{/div} {/div}

Remember to close id's in order.

Now, onto css classes.

Creating Classes

To create a class in your css, use this

.subtitle { color: #000000; }

To insert class into your html, do this

{p class="subtitle"} {/p}

Now, you can use same class repeatedly in same page unlike Id's.

I also want to tell you something about link attributes. You should always keep them in this order:

a { color: #006699; text-decoration: none; font-size: 100%; }

a:link { color: #006699; text-decoration: none; }

a:visited { color: #006699; text-decoration: none; }

a:hover { color: #0000FF; text-decoration: underline; }

a:active { color: #FF0000 }

Of course, you can change colors and text-decorations. This is just something I cut out of my code!

Okay, these are basics. What I highly recommend is to go and download Topstyle Lite by going here:

http://www.bradsoft.com opstyle slite/index.asp

It's free and is a very helpful css editor. It not only color codes and organizes your code, but it provides you with tons of attributes that you can add to your class and id elements with just a click. They also provide a screen at bottom to view your css code as you create it. Very useful for a free edition and I'm looking to buy pro version soon.

Now, this was just a very very brief explanation of vital elements needed when structuring your css. I have a good feeling that when you download top style lite, you will learn how to use hundreds of attributes in your classes and id's

Good Luck in Your Web Designing Efforts!

P.S Change { and } to < and >

will help us to reduce file size, but that is not only benefit. Using CSS word product in this example will be moved more close on top of document. Search engine will pick up more content and less code.

Imagine that you have 3 columns table on your page. When you see code, you will notice that first come code for your table, and after that it come your content. Positioning your 3 columns using CSS instead of standard inline elements:

<table width="90%" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="381" height="150" valign="top" bgcolor="FFEDD4"> My Product </td> <td height="150" valign="top" bgcolor="FFEDD4"> …..

When CSS is used, your code might look like this:

<div id="leftcontent"> My Product </div>

Again your code is much more clear, and your content is moved on top of your document, making your HTML page search engine friendly, and reducing your file size.

Content is one of most important factors in Search Engine Optimization, and you will benefit with removing unnecessary code in your HTML and create search engine friendly web page.

Validate it Browser war is far behind us. Reality is that most of people today use Internet Explorer, but you should try to be on safe side and ensure that your CSS code is valid. Not all browsers interpret CSS on same way. You can validate your CSS here: http://jigsaw.w3.org/css-validator/

Zoran Makrevski Search Engine Positioning Firm SEO.Goto.gr