6 Methods To Produce Fast Loading WebPages

Mar 1
08:53

2010

Mark Kostner

Mark Kostner

  • Share this article on Facebook
  • Share this article on Twitter
  • Share this article on Linkedin

Information on why page load time is important and what can happen if page load time is poor, then some tips on how to improve page loading time

mediaimage

With a 56k connection a Webpage should load within 8 seconds. The following methods are all ways you can speed up your page load time.

1. The majority of WebPages containing JavaScript load them in at the start of the document. The content won't appear until the JavaScript has fully loaded. If the JavaScript is placed at the bottom of the document the page content will load first which will chop some of the load time. Even when the person can see the page it will still be loading but they won't realise this.

2. Loading in external documents such as style sheets or JavaScript files can also add to a page's load time. If you incorporate the external files within the main html file it makes the code less readable but it also decreases the load time. When the website is complete and the code readability is less important you can paste external files into the main html file.

3. There are several different image formats,6 Methods To Produce Fast Loading WebPages Articles the most common are Portable Network Graphics (png), Joint Photographic Experts Group (JPEG) and Graphics Interchange Format (gif). Making sure you use a format that retains the quality of the graphic at an optimal size is vital when it comes to page load time. A gif type image is the smallest format so if your images only contain a few colours then this would be the best choice. JPEGs can vary in quality and therefore file size. You should aim for the smallest size that doesn't reduce the quality of the image. PNGs can provide graphics with transparent backgrounds but have a bigger file size than the two previous formats. Bitmaps (bmp) are another common image file type but take up a large quantity of memory. Fast loading webpages shouldn't hold any images of this file type.

4. A minimal use of images, in particular animated gifs will also decrease page load time. Animated gifs are made up of more than one graphic and therefore have a greater file size. Lower file sizes of graphics will decrease a page's load time. The amount of images being loaded is also worth noting as it also effects page load time.

5. Flash animations or swf files are used more frequently these days than animated gifs. Swfs are a siginificantly greater size than that of animated gifs. They should only be used on a page where absolutely essential. It is worth taking into consideration using an animated gif in oppose to a swf if your animation is short and doesn't require any user interaction. Nevertheless it should also be understood that if your animation uses audio a gif won't be an option. The use of swfs will also require extra code to check if the user has a flash player installed. Further code equates to a greater file size and is therefore another reason to only use swfs where necessary.

6. It is advisable to combine separate images where you can to decrease page load time. Two separate images will have a greater overall file size than one. The more graphics the page needs to load the more http requests it needs to execute and this also increases loading time.