body
{

background-color: #ffc;
font: arial, tahoma, sans serif;
}

However, one can do a lot more in the overall structure of the CSS file. For example, assuming the CSS may contain special characters, one should consider it a best practice to include a character set declaration at the beginning of the CSS file.

@charset “UTF-8″;

This must occur before any comments or other information in the file. More details can be found at the W3C site.

One should then have copyright (possibly creator) and version information to identify the CSS file. There should also be some sort of table of contents (especially as the file grows in size to hundreds of lines). To expedite searching for information, one might preface each entry with a unique character string which will not directly be used anywhere else in the document (for example, a tilde).

So, a template CSS stylesheet should have the  following characteristics;

@charset “UTF-8″;
/*
copyright 2010. Mark DuBois. Some rights reserved.
version 1.0
modified:
date:
changes:

Table of contents (to jump to a specific part of this document, just search for the unique characters at the start of each line).

~1 Color guide
~2 Reset values
~3 Global constants (identifiers)
~4 Global classes
~5 Home page (items unique to the home page)
~6 Other pages throughout site
~7 Sidebar
~8 Footer
*/

Within the CSS, one would then place specific comments so the individual sections can be easily located, for example:

/* ~1 Color guide
#ffc – light yellow – used for background
*/

Obvously, your mileage will vary with a specific site. It is not as important to have a specific section (such as footer) as it is to be consistent throughout the sites you create. This should vastly improve maintenance of the sites. I recall a quote from an individual at Howest University (Belgium) during a webinar I recently attended – “develop your code as if it will be maintained by a violent psychopath who knows where you live.” While most of us will likely never have this specific problem, it is always a good idea to make your code as maintainable as possible. As a minimum, following the above suggestions should make it much easier to locate specific items.

I know tools like Dreamweaver CS5 make it much easier to work with CSS, but even with those tools, well structured and well documented  CSS should be encouraged. Your comments are most appreciated (due to the vast number of spam attempts, I have to moderate all comments – sad, but this is the world we inhabit). If you post a legitimate comment or insight I will approve it (regardless whether you agree with these thoughts above or not)?