Rules  1  2  3  4  5  6  7  8  9  10  11  12  13  14 
Rule 5 - Put Stylesheets at the Top
 Examples  1  2  3  4 
Example 2 - CSS at the Top

Current time: 07:04:30

In this example the stylesheet's LINK tag is in the document's HEAD. In IE this makes the page render more quickly, specifically when:

In these situations the page loads progressively. The text is displayed followed by the six images as they are downloaded. Making the page start rendering sooner results in a better user experience.

Try Example 1 - CSS at the Bottom to see how moving the stylesheet outside of the HEAD can cause the page to load more slowly.

Try Example 3 - CSS at the Top Using @import to see why using the LINK tag is better than using the @import rule.

stevesouders.com | contact SteveGreyhound, the 2nd fastest land animalThis is the companion website for High Performance Web Sites by Steve Souders.