Order of HTML page loading

Is there any order in which an Internet page will load the consituent files onto my screen? (I am thinking of pictures on a webpage here…)

Obviously files that have been cached from a previous visit will load quicker and appear first, and smaller files will download sooner than large ones, but it what order are they “fetched” - or is it random?


It should be in the order they are specified on the page. Really, it comes down to what order the HTML is rendered in by the browser, but I can’t think of any reason why it wouldn’t be simply top down.

It’s not quite top down.
Access to the web server is generally ‘stripped’ or ‘threaded’ so multiple ‘gets’ will occur almost simultaneously. They are essentially then ‘packetised’ and the ‘packets’ will be sent asyncronously, so they don’t have to be received in the same order they are sent.
Your browser grabs all of the packets as they come in and puts it all back together.
So while it is essentially top down, it’s not quite.

Depends on how the page is written.

For example, if a page forgets the height and width attributes for an image, then the page will be stuck there until the image finishes loading, because the browser cannot know how big a space to reserve.

Otherwise, the document itself will load first, then any images and replaced tags.

Sure, it’s top (left) to down (right) but you can manipulate the order so that, for example, while it looks to the page viewer, say, the left side navigation would be read before the main body content, that hasn’t actually happened in that order. You’d want to do that if you were interested in the page ranking well for it’s keyword terms on a search engine as the initial data read by the engine weighs heavier than some of the latter material on any given page; No good the engine reading through the ‘About us’, etc links when you want it to read bolded keywords, etc.

In addition, the actually loading into the browser window is dependent on one whole table having been read. To get something/anything in the browser (so the surfer doesn’t get fed up and leave), it’s best, IMHO to build a page with separate tables for header, body and footer – as opposed to building the page in one big table with those components inside that table.

Probably the single most important thing to get right is the file size of your images.