Web page size is an important factor in determining how well optimized your site is. Search engines like MSN, Yahoo, and Google are considering load time to be more and more important when it comes to both search engine optimization and PPC quality scores, and file size certainly affects your website’s load time. However, many web developers have a hard time determining which page sizes and file sizes are ideal for making sure that their website loads quickly. In this article, we’ll be looking at some data which has been gathered about the average size of HTML web pages, image files, and other components of a website. This will help web developers to determine a solid guideline for their page sizes and file sizes.
The following data was gathered from a report titled "The Portrait of a Common HTML Web Page" which was gathered using an HTML rendering engine they call WebSeer:
Average HTML Size (iframes included): 25k
Average size of external scripts: 11.2k
Average size of external style size: 17k
Average size of total web page, including HTML, image files, flash, scripts, and styles: 130k
While considering this data, the creators of “The Portrait of a Common HTML Web Page" report warning that components such as CSS images, framed pages (with the exception of internal frames), media objects which did not use embed tags were not taken into consideration in this analysis. There are some other things to take into account when considering the use of this data as a guideline for creating your web pages and image files…
GZIP compression and deflation are techniques that can be used to help “heavier” pages to load faster into the web user’s browser. This type of page compression was not turned on when performing the report mentioned above and so pages larger than 130k can still have an efficient load time if compression is used properly. In fact, file compression can reduce the size of web pages by as much as 70%. This way, the lighter version of the web page can be delivered to the web user’s browser quickly, and then expanded again so that the user can get the full experience of the higher quality images and other features of the web page.
This all takes place without the web user being aware of what’s happening, and so GZIP compression and deflation can be a discreet solution for keeping the size of your web pages from being a hindrance to your loading times.
Many of the numbers in regard to average image files were due to how image files are normally used by web developers. For example, GIF images had the smallest average file size, most likely due to them being used for flat-color icons and spacers. The second smallest image file size was the JPEG, which is mainly used for photographs, product images, and other images that have a smoother tone. Finally, PNG and SWF images had the largest average file size, but are considered to be more efficient because PNG retains a higher quality, and through the use of file compression, they can be delivered quite quickly.
At the time of this writing, the above statistics represent the average size of HTML, CSS, and image files and thus provide a good guideline for determining the size of your web pages. However, as web browser and internet server technologies become more advanced, it’s likely that larger file sizes and web pages will be able to be efficiently delivered. The best approach for any web developer is to test their web pages in different browsers and with slower internet speeds which are currently on the market. This way, they can create web pages that will load efficiently for the wide variety of users who land on their website.
This data can be used as a guide for building web pages that will load quickly and which will thus help you to optimize your website for the search engines. For more information about creating efficiently sized web pages, see our article on GZIP compression and deflation.
Join us in our daily discussions on Facebook!