It’s not uncommon to come across web pages getting struck while loading. The ‘loading’ wheels struggling to rotate, the cursors going unnoticed are the worst part of a heavy web page. In fact page loading becomes most irritating problem if left untreated, let alone the subsequent issues that follow there after.

There are some simple tricks to make the fat page load in a better way and to make the experience less irksome, though they take the same time to load. Phew!

CSS templates or the xHTML templates can be used for quicker loading of the pages. CSS file is required for arrangement of objects on the web Page. These files have the parameters which specify the size, color, margin and positioning of the objects. JavaScript files are those which have instruction to handle specific events which occur on the webpage. These are detailed procedures and thus are the file size is bigger when compared to the CSS files.

When a page gets loaded, it tries to bring in the files in the order from top to bottom as specified. However there are inline javascripts which come within the html and not as separate files.

While designing the html care should be taken that the bulkier JavaScript files should be brought at the end i.e. these files should be at the bottom of the list of files being queried from the server. The necessary javascript instructions through which the alignment of the objects (like buttons, drop menus, icons etc) should be made ‘inline’ i.e. hard coded within the html code.

The CSS files should be brought in the beginning. This makes the html objects (like the buttons, icons, searchfields, images) to position themselves in the desired way and wait for the subsequent requests to fill the page.  Html5 templates make use of Javascript and CSS3 and can be used for animation experiences on a real time basis.

The JavaScript files whose instructions are not relevant for the alignment of objects need not compete with the CSS files. Initially the bandwidth should be completely used by CSS and then by Html files followed by javascript files making ‘loading’ a pleasant experience.

Even though, both pleasant and unpleasant loading take the same amount of time, the user will be continuously occupied with the orderly sequence in which the objects get filled into the page. The above tricks and techniques will be handy in avoiding the sand clocks!

The author of the above article has been working in the software development vertical. Blogging in spare time about latest technological developments and core technical issues is one of the many passions.