Here I have tried to put together some easy to implement but effective tips to speed up your website loading speeds
Images
- Minimize Size of Images (Total Image size should be below 100kb)
- Use .png format instead of .gif
- Do not scale Images in html
CSS
- Don’t load unwanted class
- Combine CSS which is used in single page to one
- Use Separate CSS if needed for different pages
- Ideally Keep CSS Size less than 1160bytes
- Do not use inline CSS
- Include CSS at the TOP
-
Avoid unneccessary spaces, tabs and use a optimized format
.some-class { color: #ffffff; line-height: 20px; font-size: 9px;}
can be converted to:
.some-class{color:#fff;line-height:20px;font-size:9px;}
- Make CSS External
- USE CSS Sprite
- Avoid CSS Expressions
Scripts
- Make Javascript External
- Remove Duplicate Scripts
- Put scripts at the bottom
HTML
- Use proper HTML Structure
- Close all divs properly
- Remove white space, tabs etc
- Replacing STRONG with B and EM with I