Controlling load order

[Weldon MacDonald]

I have 15 or 20 pages that represent the faculty of a school. The pages are almost identical, except for obvious content changes. I used css for the formating, but load the jpeg header in from the individual files. The darn thing is only 13k, but it's often rendered much later than the other content (2 other images and some text), which is pretty ugly. This is just a glaring example of one of my peeves. Many pages download in a sequence all their own and it can be unsightly, which brings me to my question.Is there a way to control the load sequence of an xhtml page? Weldon

[boen_robot]

The only kind of control which I could think of is to load backgrounds (including header images) as CSS backgrounds, scince the CSS loads before the actual <img /> elements. If there are JavaScript called images in the head section, they will be loaded before the <img />s as well. JavaScript called images will be loaded after the <img />s I think.Of all the things above I'm only sure about the CSS backgrounds though.

[real_illusions]

the use of width and height attributes in images and any other width/height based cntent helps. the browser will read the height and width before it downloads the image, so it'll create the space where the image is supposed to be, leaving the text intact and in the right place as soon as it loads.

[Weldon MacDonald]

I'll try making the images css backgrounds. Thanks

The only kind of control which I could think of is to load backgrounds (including header images) as CSS backgrounds, scince the CSS loads before the actual <img /> elements. If there are JavaScript called images in the head section, they will be loaded before the <img />s as well. JavaScript called images will be loaded after the <img />s I think.Of all the things above I'm only sure about the CSS backgrounds though.

<{POST_SNAPBACK}>

[sbrownii]

Please only make images into background images if they are actually background images. The image element is for displaying images. Defining backgrounds in css is for... well.. defining backgrounds...As real_illusions suggested, you can specify the height and width of the img element using either the properties of that element, or using css. This will establish the layout before the image even loads, and is actually the recommended practice.Be sure to add the "alt" attribute to the element for accessibility.

[Weldon MacDonald]

I was using the width and height tags from the start. The layout is correct, but the way they come in is terrible. The header isn't really a background, but nothing ever appears on top of it. Putting it in as a background of a div by CSS means it starts to load when the CSS file is loaded. This may be an ugly workaround, but it makes the page look better.Is there another way to gain some control of the load sequence?

Please only make images into background images if they are actually background images. The image element is for displaying images. Defining backgrounds in css is for... well.. defining backgrounds...As real_illusions suggested, you can specify the height and width of the img element using either the properties of that element, or using css. This will establish the layout before the image even loads, and is actually the recommended practice.Be sure to add the "alt" attribute to the element for accessibility.

<{POST_SNAPBACK}>

[sbrownii]

I guess my point is more that if the image is part of the actual content of the site, it is better to use image elements. It is mostly an issue of accessiblity. Think of how the page will render with text only. That is why the img element has the alt attribute. When you use a background image, there are tricks to have text but use style to replace the text wth a background image.You can read an old article here -> http://www.stopdesign.com/articles/replace_text/but pay attention to the notes, since that particular method doesn't actually work so well...