This guide is intended to tell all Drupal developers how to:

• Create good HTML/markup
• Create good base templates for themers to stylize
• Create good CSS classes

I wont tell you about how to design your web application.

I will teach you how to theme your website in Drupal.

NOR

Rules of thumb for module developers

every div must have at least one identifying class

1.

2. But most divs should have three - 

• what object it contains, e.g. node/user/message/tree
• what variation/permutation/state of that object/markup it contains,  e.g. full/teaser/node-typ/apple-tree/collapsed
• a unique identifier, where appropriate,  e.g. node-123/tree-456

RULES for having them :- 

3. The module-name should be a class on the root DOM element of each theme_*() function.

4. theme('foo') should be wrapped in a div of class "foo"

5. strings always make better identifiers than integers

6. Its good to have meaningful classes, but should not bloat the HTML.

7. Use of more semantic TAGs of HTML5 should be encouraged compared to having lots of classes.

e.g. - <strong> , <em> , <p> etc.

Drupal MicroFormats

• The micro-formats are small chunks of familiar HTML patterns.

• Simple concept - consistent markup.

e.g. - headings, lists, menus etc.

General Guidelines

- for Templates and Functions

Templates

• Where appropriate use a tpl file, as opposed to hard coding markup into custom functions.

• Add Doxygen comments to each template explaining what it does, available variables and so on.

• Inline comments should be added inside <?php ;?> rather than <!-- --> HTML comments, we don't want to print comments in the output.

• Adhere to Drupal coding standards - in particular PHP in HTML, not HTML in PHP.

Functions

• Use standard Drupal theme functions.

• Avoid hard coding markup in custom functions.

• Be consistent with markup and class names—the goal is to standardise the markup.

• Document what you have done with comments.