1. CLEAN UP YOUR CODE
The first and most obvious thing you need to do is clean up your code. Every bit of unnecessary code is additional data being transferred and possible acted upon. The most obvious thing you can do is write better code, meaning that you take a look at your markup and see if there isn’t a better solution available. A lot of time it helps redoing everything again, often ending up with a lot less markup and a more solid code base.
Some immediate things that you definitely should get right include:
1. No inline style in the HTML markup. Styles belong in separate files so that they can be cached by the browser.
2. CSS doesn’t need white space, so you might be able to clean up your style sheets a little bit.
3. While you’re at it, revisit all the classes and IDs in both your markup and your style sheet as some of them might not be needed any more.
2 PICK A GOOD HOST
You know what, your web host matters. if you’re running on poor hardware, using old versions of PHP and un-optimised server software then your site will suffer. Pick a good host that meets your needs, Google it thoroughly since you want to avoid having to move, and make sure there is room to grow should you need to.
How to pick a good host then? it all depends on your needs, but something you always can do is find out what version of scripting languages (PHP for example) that they are using, and check that against what is recommended for your CMS in particular, and web use in general. it is also a good idea to pick a host that is geographically close to your demographic, that makes for less latency.
3. Optimise your Images
Using heavy(weight in KB) images is a sure-fire way to make a site feel slow to it users. you should optimize your image so that they don’t weigh more than necessary, and you should definitely do the cropping and resizing yourself since automatic server-side scaling won’t take any optimization into account. You should ask yourself what a large image really add to your site, and if you could compress it further (using Photoshop or your image processor of choice). if it is a portfolio then large images aren’t an issue, but other types of sites might not have the readership that are interesting in waiting for 70KB images to load. Speaking of which, it is 70KB images to load. Speaking of which, it is a good idea not to have too many images on the front page, especially if you’re running a blog. Ten posts, all with a 70KB featured image, will take some time to load.
Oh, and don’t forget to mash up all of your CSS files into one big, mega one. There’s no need to get additional request slowing us down, right?
6 USE CSS SPRITES
you might also want to consider using the CSS Sprites technique for your icons, logos and other similar sorts of graphics. With this your’ll keep all your images in one file meaning fewer image requests to process. How to effectively use CSS Sprites in an article on its own, but in short, the idea is to keep all images in one file and when they are needed you will use the background-image property and the use x- and y-positionning to get the part of the images you need.
Why is this good? Well, the image containing all your icons, logo, buttons and whatnot will no doubt be large, 20-30kb perhaps if you have a lot of the things, but if you add all your small images you’ll find that they take up more room. Furthermore, every image in your design will generate a request, which puts strain on the server and that means that there’s be a delay on some hundred milliseconds or so per image. Compare that to the one image requested one time and then cached, you’ll see that this is a very clever way to manage graphics in your design.
7. AVOID AND UNNECESSARY EXTERNAL SOURCES IF POSSIBLE
It might be tempting to sport your latest tweets, a Facebook ‘Like’ box, the latest pics from your Flickr account, your Last.fm tracks, Youtube channel updates, and so on. Some of those might be perfect for your readership and then by all means use them, but avoid the unnecessary ones since each one will make your site slower. After all, there is some communication going on between your server and the service’s one, and that takes time, which leaves your visitor waiting, Don’t keep them waiting for things they don’t need.
8. Limit Database Calls
Depending on your CMS of choice, you’ll be able to limit the amount of calls to the database. Most systems want to be user friendly, and that means alot of dynamic stuff that will insert your site URL in calls for a favicon and things like that. Things is , you know your URL and by removing this query to the database, you’ll reduce strain. So look for those unnecessary calls and replace them with direct ones, to images in particular, and you’ll make your site a lot more stable should the masses come knocking on your door.
Finally, the big one, you need to utilize cache to really speed up your site.
Perhaps your CMS of choice has this built in and only serves static files to the visitor, in which case all is (possibly) food, but if that is not the case then you need to find out what you can do.
10 TESTING SITE SPEED
So how do you know how you actually rate when it come to site sped?
You can click around of course, but there area more scientific solutions, such as the YSLow (http://developer.yahoo.com/yslow/) extensions/bookmarklet from Yahoo! for example, or the popular Firebug(http://getfirebug.com/) for example. These will help you analyze sites so that you’ll know what to act on