SPEED (No not the film. Or the drug)

Posted on by

But Website speed. How long does it take for your website to download? In today’s world a fast streamlined website is a must. If a user has to wait for more than about a second your site will be left and the user gone. Possibly forever.  This is not good. They will have missed the fabulous website you have (especially true if you used DP Web Development!)

So you need to optimise your website for speed.  Here are nine golden rules to follow.

  • Clean code.  The websites code should be as clean and error free as possible. There should be no unnecessary code being transferred as this will waste time and may even be acted upon.  A few obvious candidates spring to mind: are all the classes and ids still needed? Some may now be redundant and can be removed. Can your CSS be cleaned up at all? Remember white space is not needed in CSS.
  • Choose a good host. It’s true. The host you use does matter.  If you’re running on poor hardware using old versions of PHP (or other language) then your website will suffer. You need to pick a good host. Google the host thoroughly and make sure it meets your needs, but also has room to grow. As well as finding out which versions of PHP it is running it might also be worth considering the geographic location of the host. This may impact support services.
  • Image size. Images should be made as light as possible.  Wight is measure in KB.  Cropping and resizing should all be done yourself outside of the server before being uploaded as automatic server side scaling does not care about speed.  Also ask yourself does your website really need that huge image, what does it add. Images should only really be used if they serve a specific purpose. Do you really need 12 images on the home page?
  • Load StyleSheets first, before JavaScripts.  The CSS before any JavaScript. The reason for this I that while CSS is crucial for the page JavaScript is less so. The look of the page needs CSS to load while most of the JavaScript functionality isn’t.
  • Minify CSS and JavaScript. While it is a good idea to mash up all of your CSS files into on big file (no point in making lots of additional requests slowing you down). It is also a good idea to remove all white space and put the code on one line. This will make the code hard to read but the aim is to keep files small.
  • Use CSS Sprites.  For icons, logos and other images that may appear together on a regular basis it worth considering suing CSS Sprites.  This will keep your images all in one file thus increasing download speed: there will be fewer images to process.  Have a look at how to use sprites.
  • Avoid unnecessary external files.  Do you need to include a Facebook “like” on every page along with your Flickr account, YouTube Channel updates and all other such files? There may be a perfectly good reason for doing so especially in today’s interactive world. It each one will have an effect on the speed of your website. So keep an eye on this. Don’t keep your visitors waiting for files they do not need.
  • Cache! Utilise Cache to speed up your website Your CMS of choice may has this built in in which case all is well and good. It is worth checking and finding out what you can do.
  • Test the Speed of Your site. And don’t just use your own superfast broadband!  This can be a starting point. Use different machines (if you have access to them) for a more systematic approach there are online tools that can help. One such site is http://getfirebug.com. There are others out there and a Google search will help.

What are your tips on speeding up a website? Is it really necessary now that Broadband is becoming ever more widespread? Do mere seconds really make a difference?