Summary

CSS allows authors to strip their markup down to structure and style. To optimize your CSS, remove as much whitespace and as many comments as you can, and use short class and id names . Use simple, high DOM-level type selectors and avoid the specific; be as vague and abstract as possible to apply your style in wide swaths across types of structural elements (all body text, paragraphs, or dt s, for example). Group selectors and declarations and use shorthand properties to minimize your CSS rule sets. Finally, minimize HTTP requests by grouping external style sheets and embedding where necessary. Here is a list of the topics covered in this chapter:

• Embed or SSI abbreviated styles for maximum speed.

• Minimize HTTP requests by grouping external CSS files.

• Link to external style sheets site-wide to cache in.

• Layer style sheets for speed. Use cascading to combine linked, alternate, and imported style sheets to layer your presentation for older browsers and alternate media (print), and to save bandwidth.

• Group selectors with the same declarations and declarations with the same selectors.

• Use simple selectors high in the document tree to set global and element-wide styles (that is, type styles like body , h1 , p , and dt ).

• Use descendant selectors to get specific without class or id selectors.

• Take advantage of your inheritancedon't overspecify CSS; let it flow down the document tree.

• Use multiple classes to group common style declarations to save space.

• Use value replication on the border , padding , and margin properties.

• Use shorthand hex colors (such as #00f ).

• Use shorthand properties to optimize your CSS (including font , background , margin , and border ).

• Use short class and id names.

• Use shorthand hexadecimal colors or names, whichever is shorter.

• Use relative lengths for maximum flexibility.

• Remove whitespace.

• Cut the comments.