identifying classes
In previous posts, I tried to explain the difference between the id and the class attribute. The function of both is very clear, yet the practical use of said attributes can still be confusing. Also, depending on the situation, it can be advised to look past their intended function and just go for the fastest way of implementation.
Structuring with ids
When simply structuring your document, there aren't too many elements that can be labeled with an id. Most elements on a page can be allowed to appear more than once. Even when the site doesn't really call for it, it's best to look at these elements from a more global perspective and label them as such.
For example, looking at the main navigation (horizontal bar), we see that on most sites it appears only once on each page. Yet some sites might repeat this main navigation, whatever the reason. For consistency across projects it's better to label the main navigation with the class attribute. And if for some reason the requirements of a site change, the work to adapt will be as minimal as possible.
I use ids only for the most basic structure of my document. Identify a site container, a header, main content area and a footer. That's where I stop, unless a page still has a couple of rigidly defined subsections. These are about the only elements that cannot be repeated on a single document and will be used consistently across a whole site.
One more id is reserved for the <body> tag, although the usage there depends from site to site. An id is often set on the body element to identify a template, theoretically this often isn't correct. An id on a body element should be used to structure the whole site, meaning different areas within a site should be identified by it. Sites that consist of just one area can use the id to identify pages. But know that whenever a new area is added to the site it could become pretty complex to adjust all ids and classes.
Structuring with classes
Building on the id we put on the body element, we can uses classes to identify sections or pages within a given area, and add extra classes to further specify these sections (until page level if needed). This is the preferred way of working, although this is often quite hard to implement with a cms, as most (if not all) are template-based and deduct new pages from these templates. If compromises have to be made, it's feasible to drop the labeling of individual pages, yet separate templates for each area should best be defined (even if templates match across site areas).
All other elements on a page (excluding the ones mentioned above for the id attribute) should best be labeled with classes. The thing to look out for here is that when an element appears more than once in a certain section on a page (meaning they cannot be separately identified by structure alone) they should be further specified.
Scripting away
Ids are more popular for scripting, as there are standard functions to retrieve an element in the document based on its id. A similar function to retrieve elements based on classes is not standard available. Yet, for scripting the same rules apply. If a script defines the behavior of an element it's best to use classes as there is no reason to limit a certain behavior to one element within a document. If time and/or performance are an issue, these rules can be bent of course, though it is useful to built yourself a small library (or use a bigger existing one) that will make work like this easier in the future.
The id attribute should be used when a single element needs to be targeted directly. Mostly this is for substituting or introducing content through scripting. When loading a flash with the swfobject or inserting content through ajax, specific containers need to be targeted. Using the class attribute here would lead to confusion (as the content needs to be inserted in one specific place).
The class attribute should be used when behavior needs to be coupled to an element. If you have several boxes on the same page that can expand and collapse, scripting languages should provide this behavior based on a given class. By doing this, more elements can be added to a document without having to write extra code.
What about styling
If you structured your document well, you will already have all the hooks to style your document. As such, styling a document often hints at little errors and bad structuring, and styling your document will serve as a validation check to the structure of your document. Just don't forget that styling often needs less structural elements, so it's not a 100% bullet-proof check, just a solid indication.
Using ids and class together
If you structure your page well, ids and classes shouldn't be used together too much, with exception of the body element. Classes and ids can still appear on the same element, but usually not in a cooperative way (meaning a class can be used for behavior and an id can be used for structuring, etc ...)
One final interesting thing to notice is that for scripting, the id attribute will further specify an element labeled by a class (label a video container with a class and use the id to insert the specific flash). For structuring, the class attribute will further specify an element labeled by an id ( the id on the body element labels a site area, while the class specifies sections or pages within that area).
And that's about it. When building a site, it's often good to start by structuring your html. Ignore scripting and styling and just structure your document first, then apply extra ids and classes for scripting and check your structure by styling the pages. If you did it well, you shouldn't have to add anything new for styling purposes.