Speed Up Your Site: Use the height and width tags Speed Up Your Site: Optimize Images
Oct 23

Speed Up Your Site: Optimize your CSS

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...
Web DesignAdd comments | 268 views | Email This Post | Stumble it!

Cascading Style Sheets make websites much more efficient because they allow the browsers to cache style-related information from the .css file directly, removing the need to read that information every time a single page is loaded. Even if Style Sheets are naturally more efficient than HTML tables you can still optimize the CSS code to make your website cleaner and faster.

First of all try to locate dispersed code and aggregate it together. For instance instead of:

margin-top: 10px;
margin-right: 20px;
margin-bottom: 10px;
margin-left: 20px;

you should use:

margin: 10px 20px 10px 20px;

Instead of:

<p class="decorated">A paragraph of decorated text</p>
<p class="decorated">Second paragraph</p>
<p class="decorated">Third paragraph</p>
<p class="decorated">Forth paragraph</p>

you should use:

<div class="decorated">
<p>A paragraph of decorated text</p>
<p>Second paragraph</p>
<p>Third paragraph</p>
<p>Forth paragraph</p>
</div>

Secondly you can also try a CSS optimizer tool like CleanCSS. Those tools are supposed to merge similar selectors, remove useless properties, remove whitespace and so on.

Source: http://www.dailyblogtips.com/

[Slashdot] [Digg] [Reddit] [del.icio.us] [Facebook] [Technorati] [Google] [StumbleUpon]

\\ tags: ,

Leave a Reply

Security Code: