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

CSS Changes Lets now take a close look at simple changes we need to make in our stylesheet and how we can create an individual print sheet.

Now is time to define exactly what we want to achieve in our print output. Maybe we want our website header and logo to be appear on screen but be omitted on paper.

The easiest way to achieve this is create a class or id called 'header' and define a different style for screen.css and print.css.

Lets have a look at how code may look:

Your header id for screen.css may look like this:

#div header { font-family:arial; margin: 0px 0px 2px 2px; font-size: large; font-weight: bold; background-colour: #000000; border-colour: #ffffff 1px solid; }

Your header id for print.css may look like this:

#div header { font-family:arial; font-size: 20px; font-weight: bold; }

The CSS code for screen.css defines font, margin, font size, font weight, background colour and border colour.

The CSS code for print.css defines only font, font size and font weight. To save visitor ink we have omitted background and border and reduces font size.

If your site is heavy on animated banners or flash movies we can apply a similar technique to allow banners to be shown on screen only.

Typical markup for you advertisment movies could be like this:

Your screen.css stylesheet could contain all kinds of attributes for advertisment such as border colour, drop shadows and position.

In your print.css stylesheet you would want to omit advertisement from printing so in you would place following:

#div.ads { display:none; }

This CSS code will illiminate advertisement from print output.

Hope this helps:

http://www.css-help.com

Karl Regis is a student studying Computer Science. He is continually developing a css tutorial website in order to gain a better understanding of cascading style sheets and pass this knowledge on to others.

Css Help is found here:

http://www.css-help.com