Search This Blog

Pages

Showing posts with label faster Web page. Show all posts
Showing posts with label faster Web page. Show all posts

Friday, 6 April 2012

How to Load the Faster Webpage


3. Connection to external servers

Every connection to an external site to retrieve information will add to the download time. If you have noticed, our sidebar has many image links to the Blog directories. When you list your Blog in these directories, it is always good to provide a reciprocal link to their sites. You can either create a text link to them, or an image link as we had done. The problem is that in retrieving all the images from these locations, it will drastically increase the load time of your page.

Let me give you an example to illustrate how you can resolve this problem. When you register your Blog at Blogvillage, you will have a code that looks like this:-



Whenever your page loads, the browser will go to their site to retrieve the image “23251.jpg”. Assuming you are registered with many blog directories, the browser will have to visit each of these sites to retrieve their image buttons. This slows down your Blog download. We believe that these blog directory hosts may not like that too as it will put a strain on their server.

What we can do is to download the image “23251.jpg” onto our hard disk by entering the full image URL in our browser and when the image appears, right-clicking it to save. Next, we upload it onto a free server. You can read about using free hosts like Google Page Creator and Google Groups. We have also a rather comprehensive list of free Image Hosts and File Hosting Services in our article on Manage Blogger Image Storage Space. Check out those sites and choose one that is fast, reliable and enables hotlinking to the uploaded files.

Take note of the image URL and the link in the above example will be changed to this:-



Do that for all the image buttons. It takes a while, but the net result is that your readers will benefit from your work. Be consistent. If you choose one host, stick to that one. The browser will need to contact only one site to retrieve all the images and this should cut down the load time of your web page.

Having said that, there are some external servers which we cannot do away with. For instance, some of these Topsites and Toplists give you a tracking code to track the visitor statistics and rank your site. There will be something like this “tracker.php?do=in” or “button.php?u=” in their image link. If we want our Blog to be ranked, we have no choice but to use their code. On a number of occasions, these sites were down, and our page load times were longer than usual because the browser was unable to retrieve the information from these sites. We try to monitor and temporarily disable the codes for these sites, but this is something which we have to bear with should we want to continue being listed in their directories.

Text links are of course preferable if you want to do away with the images. Should you need to understand the difference in codes between text links and image links, you may refer to the article on Hyperlinks and Image Links.

4. Width and Height tags

Images and tables come in different sizes. If we specify the dimensions in the code, the browser will be able to set aside the space allocated for these images and tables and load the rest of the contents that they have quick access to. If we don't specify the values, the browser will have to load the entire contents of the image or table before moving on to another.

Image codes contain a “src” tag. For example, the link buttons we have on our sidebar have a width of 80 and height of 15. In our codes, we will specify the width and height like this:-

width="80" height="15">


You should do the same for tables. A typical table HTML code with the width setting will look like this:-

width="300">

Table contents


5. JavaScript and external scripts

Minimize the use of JavaScripts in your Blog. These are the languages that the browser must load and interpret. A complicated script may take time to execute. You can tell a JavaScript code from this line found in the code:-