Slow loading images on home page

Accessibility
1

I am working on a website where on the home page, there is a multi-layored slideshow that I created a jQuery script. It is basically four slideshows, three of which run side by side, and one of which I have layered on top of the other three that makes words pop up over the photos in the other three slideshows. See:

The Play Group Theatre | The Play Group Theatre | Westchester’s Theater for Children and Teens

When you go to the home page, I think that the images are really slowing down the load time, and I have tried adding a jQuery preloader:

	$.fn.preload = function() {
    this.each(function(){
        $('<img/>')[0].src = this;
    });
}
// Usage:
$(['/pics/header-background/theater-3.png','/pics/logo-5.png','/pics/imagebox-home/ilana-and-kids.jpg','/pics/imagebox-home/hair-do.jpg','/pics/imagebox-home/guys-and-dolls.jpg']).preload();

… in hopes that it would preload the header background image and the logo and the first photo in each of the three slideshows, but it is still running very slow.

Any suggestions on how to speed up the load time on this? Should I be putting all of these photos into an image sprite? Any suggestions are welcome, please!

2

Hm, page load was pretty quick for me, even though I’m overseas. Still, on some connections I can see that it might get very slow.

One thing I would do it put all those scripts at the bottom of the page (just before the </body> tag), so that they are the last thing to be loaded. The images seem small enough, though you could probably get the size of the header image down quite a bit. (300kb+ is a bit large.)

3

Loading that page with Firebug’s “net” section turned on is an eye-opener. I think your page-loading problems have more to do with a lousy server than with the content of the page. I’m seeing 25-second load times for PNG files that are only 19K, for example. There are some missing files, like jquery.easing-1.4.pack.js, that are slowing things down, but I’m seeing a lot of random “aborted” loads of various image files.

On the other hand, I’m seeing things like dejavu-sans.ttf being loaded, at over 400K. Time to rethink just how badly you want to include fonts this way!

4

Lawlz, DejaVu sans is for us Linux ppl. The rest of the world will have to deal with Verdana.