You are here

How to optimize site speed

One of the main issues on the Internet is, still, website loading speed. Let's see how we can improve our site to make it load faster and improve conversions.

Site speed factors

What affects site loading speed? Let's see:

  • web server speed (server resources, Internet connection speed)
  • database usage (none, one or many)
  • HTML code page size (20kb or larger)
  • CSS file size (5kb or larger)
  • Total image size (50kb or larger)
  • Javascript and other script usage (none, 10kb or larger)
  • amount of file requests (stylesheets, Server Side Includes, images, scripts, etc)

Alright, but what do you do with all that?

Web server speed

Web server can affect your site speed in several cases: when there are many sites on the server and it is running slow or it is hosted on a narrow Internet connection. To solve this, you can either move to dedicated virtual or physical server (if you get nice amounts of traffic) or pick another hosting company.

Databases

If you use a lot of databases, you may want to consider whether you need the database solution at all, first. If not, switch to static pages.

If you do need to use databases, you can marge some of them to make them load faster. The speed increase is pretty insignificant, but still.

HTML code size

If your site is using tables for layout, you can reduce the total HTML size by about 50% (verified by real site development experience) by converting your site to CSS for layout. This will not only increase your site speed, but will also make the site display nicely in liquid layout and very easy to edit (need to adjust a single line in a single file to change the look of the element - a heading, for instance - throughout the entire site).

CSS file size

If you are using stylesheets (which is good), you may want to optimize them by using shortcuts, grouping selectors with the same properties and values together, actually use the cascading effect and so on. This may reduce the size of the CSS file by 10-20%, if not more.

If you use inline or internal styles, you'd rather place them in an external CSS file. This will allow browsers cache them and they won't need to load them every time the pages does.

Note: if all of the above didn't make much sense to you, you may need a developer to do this.

Total image size

If your site is using a lot of images, you may consider several things. One is to consider whether some images are needed to convey what you need at all. Useless images can be removed.

If some of your images have text, you'd rather replace them with text, styled with CSS. Most likely, this can be done on your main and secondary navigation. With addition to increasing site speed, this will make the website readable without images and accessible (both to the humans and the search engines).

If you have any images left, you may want to ensure they are created to fit the size they are displayed at. You don't want to use a 100*100 image in a 50*50 thumbnail, because a larger image would be shown as a four times smaller one.

Lastly, you may want to optimize the image files themselves. Generally, you don't need any more than 72 dpi resolution for the images. Also, you may want to save images as GIF or PNG files, if you don't need high quality images. Large product images should rather be displayed in the JPEG format anyway. Try saving the images "for the Web", if you can.

Simply optimizing website images can reduce the total page size by half or more. This is one of the most powerful techniques to make your site load faster along with converting your site to CSS.

Javascript files size

If you use Javascript on your site, you need to consider if you need it at all. Some things, such as mouse-over, can be done by all browsers without any scripts.

At any rate, you'd rather put your Javascript in external files and attach them using the <script> tag. This way, the page will load faster and the search engines won't choke on Javascript.

HTTP file requests

Though file requests don't take much time, they may be noticeable if there is plenty of them. You'd rather split the page in the includes in such a way that everything but unique content is included there with the minimum amount of the include files. This will make the site easy to edit and reduce the amount of files for the server to load (and for you to edit).

Though it was advised to place styles in external stylesheets as well as Javascript in external script files, which has created a few more file requests, it is much better than have all users load all the styles and scripts on every page. So a couple of more file requests are worth the improvement.

Total results

As for how you can increase your site speed by optimizing all of the above, it is up to your skills and your site. Everyone is individual as well as every site is unique in structure, content and size, so there can be many differences between two site optimizations for the same owner, even.

But if you optimize all the site speed factors, mentioned before, you can count for a noticeable site speed increase. If you used all the developer skills available and have not noticed any site speed improvement, you have optimized your site well enough. Good luck.

Add new comment