Images loading but not displaying, Images that aren't in the original landing screen aren't being Options

[traininvain]

Hi,

I am currently working on this site: www.shovelleduplikemuck.com/pbemff.

When the page loads only the images that are in the landing screen are displayed straight away. When you scroll down to view the bottom of the webpage those images have not loaded, and normally take about a minute to do so. What would cause this?

Cheers

[Frederiek]

I don't see that (Safari/Mac).
The page weighs 18.0 Kb, while the total page weight is 436.0 Kb, when all images are there, including the hovered ones for the navigation.

You might consider using image sprites, since you already use CSS for the hover states.

[Darin McGrew]

Ultimately, the cause is using images of text, rather than using real text. But you're using images of text just for the headings, and your images don't seem that big.

Anyway, to me it looks like a slow server, or a server with a slow connection to the net.

[traininvain]

Brilliant, cheers for that. Out of interest, how does the site realise that the images I'm using is text and cause the images to be treated differently? Ultimately all images are just pixels arranged in a certain manner regardless of what they are put together to resemble

[Darin McGrew]

Out of interest, how does the site realise that the images I'm using is text and cause the images to be treated differently?

The server doesn't treat images of text any differently from other images. It's just that each image of text replaces several bytes of text with at least several kB of image. As a result, the whole page takes longer to load, and if the server or connection is slow, then the delay for the images to load is especially noticeable. If the connection has good bandwidth, but significant latency, then the delay for each image is worse because the browser will create a separate connection for each image.

[pandy]

If the connection has good bandwidth, but significant latency, then the delay for each image is worse because the browser will create a separate connection for each image.

How is that? Some kind of time-out issue? Please elaborate a little. This is interesting.

[Darin McGrew]

With good bandwidth, big images can be transferred quickly, but with significant latency, each round trip to the server takes a long time, even if the file being transferred is small. I've watched people use such connections before. It's kinda weird. Each image appears very quickly, once it appears. You don't see the browser slowly painting the image as it downloads. But it takes a while for the images to show up, because each request is slow. Aggressive caching can improve repeat visits to a given URL, but the first hit on a new URL is slow.

[pandy]

I think I understand now. Thanks.