For many years, web site designers have relied upon tables and nested tables for the layout of text and graphics on their web site. While this tried and true technique does work, it does have its inherent problems.
First, the original purpose of using tables in web site design was to present data in columns and rows. As designers sought more control of graphics and components in their layouts, they began using tables to align text and graphics. Soon, in order to present more creative layouts, they began nesting tables within tables within tables. While the technique worked, HTML files grew larger and larger.
The danger of large HTML files is that they cause longer page download times. Web surfers are an impatient group, and will often quickly move to another site if they have to wait too long for a page to download. The other problem with large HTML files is that search engines have to filter out all of the source code before they get to the meat of the web site - the text content. The more obstacles that a search engine spider has to overcome to filter out source code, the less likely they are to find relevant content to index and rank your web site.
Designing your web site using tables for layout also has another major problem - different browsers interpret tables in different manners. This means that while your web site might look great with Internet Explorer, viewers using Netscape or Mozilla might see something completely different.
Enter Cascading Style Sheets into the web design picture! CSS offers tremendous advantages over traditional web site design methods. CSS gives web designers more precise control over the complete layout of the web site right down to the pixel! It can be used to control everything from font styles and sizes to borders, images, background colors, and more.
Many users of CSS incorporate style tags directly into an existing HTML page. While this is fine when using only a few CSS elements, it is not recommended when using extensive cascading tags (such as this page). Larger or more complex CSS designs should import the tags into the HTML page from a separate file.
Using an external CSS file also allows you to make font, color, picture, and other element changes by editing a single file. You will no longer have to edit hundreds of pages when you decide to change your header graphic or add a holiday or promotional theme to your web site.
There are additional benefits of using an external CSS file in your web site design. At this time, search engine robots do not spider or read these files. When the search engine spider grabs your HTML file, it does not have to sort through excess CSS or HTML tags to find the important information - the text and links within your web page. Visitors to your web site also benefit from CSS layout techniques. Once the CSS file is stored in the browser cache, subsequent pages will load much quicker than complex HTML table based designs.
You can also use multiple CSS files in each HTML page. For example, the bulk of your website layout can be stored in one file, and a second file may also be imported for any special features related to that specific page.