'CSS Tutorials'

How to Optimize Your CSS

5 NOV 2010 0

Hello again!

Optimizing CSS can be very helpful, but for small websites, it's highly unimportant. Ten bytes fewer or more really doesn't really matter these days -- they're insignificant. However, if you are running a shopping cart website with 200,000 lines of code, then having clean CSS code is a huge boon, both to easily make changes and to make it load faster (10 bytes here and 10 bytes there really add up!).

Let's start with some easy tricks you can do:

1) Making sure to split your CSS between backgrounds / outer layers / navigation / static elements and different mobile elements that aren't present in more than one page will help a lot. Only one CSS file will always be loaded and cached (the first one) while each page will download its own specific CSS file.

2) Keep everything neatly spaced and commented. This will help you when you have to change one link from blue to red in your giant CSS file.

3) Always keep duplicate properties to a minimum. Do more with less!

4) Combine similar numerical values, for example:

margin: 10px 20px 10px 20px;

becomes 10px 20px;

Stay tuned for more!

Fill out the form below to get started

find out what we can do for you 877 543 3110