20th August 2008

Page Weight and Download Size



What is page weight?



The weight of a page is how 'heavy' it is, all content on a page will add to the page weight, some more than others. A high resolution image will add a lot more than just plain text, however, every little part of the site will add to the overall weight.



Page weight is reflected in the time it takes for the page to load, the time taken to load a page will vary depending on the connection speed of the user. If your page is fully laden with high resolution images and a user views your site using a slow connection the chances are that the user will give up waiting for the page to load and will move on to another site.



The weight of a page is important when a user is expecting a page to load fast, whether the page is a flash based animation, video or just a plain text and images. A key page that must load fast is your home page or landing page, the first page a new visitor to your site sees. If you are wanting a high bandwidth flash based home page, give the viewer some sign of life for example a loading bar or animation. Using a loading screen will show the user that the site isn’t broken and that something is happening, this extends the time a user is prepared to wait for your content but not by much.



Is page weight really a problem these days?



This is a very interesting topic in discussion these days as the price of high speed internet comes down to affordable levels and most people are now using broadband and not using a slow dialup connection. As the speed of connection increases the page weight of a site becomes less of an issue however, sites should still load as fast as possible while keeping quality high. Your site should still load fast for someone using a dialup connection as there are still some people that view the web using one.



In my opinion the increase in bandwidth should only allow more types of media to be used on the web. On a dialup connection there was no hope of playing a video podcast. However, with the help of broadband and fast speed connections this has become a possibility. Adding new fancy types of media to your site such as video, flash, 3D etc. will all take time to load and add to the page weight and load time of your site.



Downloads and other files



Downloads are different to normal web pages, people have clicked on a link to download a file, this means that they have either clicked the link by mistake or are interested in the contents of the file. When someone is interested in something they are much happier to wait for something to download or open. However, to keep a viewer happy it is always best to optimise a file so that it downloads, loads and opens quickly. An example of a file which should be optimised for the web is a PDF (Portable Document Format – Adobe). Too many sites these days are putting well designed PDF’s on the web expecting users to be happy waiting for them to load and open and when the PDF finally opens they find that there is only 5 lines of text and the rest is all high resolution images, this will often annoy a viewer and put them off wanting to view any more of your files.



What can be done to reduce page weight and the size of my files?



There are several things that can be done to reduce the page weight throughout your site. Start with your images, are they optimised for your website? If you have images that are far too big eg. 1024 x 768 and the actual size the image needs to be is only 200 x 200 re-size the image and put that on your site. Once your images are the right size you can optimise them by using a compressor. This can be a very complex task as you can start to lose quality very quickly if you are not careful. If your site has flash or another type of media on it, try and optimise it using compression. Flash is slightly harder to compress once the file has been made, ideally the flash object should be created to be as small a file as possible. Code can also play a part in page weight, can you optimise your code or re-use bits? The best way to code a page is to try and not repeat code throughout a page as this will take longer to process and display. Optimizing a file is important but can mostly be done when the file is being created, a PDF should have the images optimised before they are put into the PDF, reducing the number of key frames in a flash animation will ultimately reduce the end file size. Embedding characters and font-sets will also drastically increase the size.



In conclusion the best way to have a fast loading website with low page weight is to have low resolution optimised images, limited 'heavy' flash and video unless it really adds to the users experience. A common overlooked factor is that fallbacks for people without various plug-ins also have to be optimised. There is no point in having fancy high resolution images, video and animations if people never get to see it due to the fact they give up waiting.



[Back to Blog page]