Another good idea to have an optimized css architecture is to avoid hard coding css classes into elements. This allow easy migration to a new theme and reduce code size in document.

Descendant selectors allow to modify style of elements contained within another element. By distributing your page in different sections can allow to modify styles of element in specific section. For example enclosing your footer section in <div id=”my_footer”>will allow to modify any element by <!– #my_footer p{/*new style*/} –>. This will modify style for any element in side footer.

For elements like <ol> <li> <ul>, child selectors should be used instead of descendant selectors. Child selectors support is available since IE7. For modifying any <li> item in <ol> following syntax can be used, ul > li {/*new style*/}

Hope this will help you design good site with optimized css architecture