Development Website: loading a big image.

I'm stuck, a friend wants a website and has designed it in photoshop but its just one big image which needs to be chopped up and coded but I don't know where to start.

Let's say it looks a bit like this, now I could just upload it as one image but it would kill load times, i've also seen images like that chopped into say 8 squares x 4 squares giving you 32 images to load.

What would you guy's do? Oh by the way I have to have this done for sat night (yeah he has left me no time to sort it out really).

Thanks in advance.

 

I haven't done this recently, but if you're using Photoshop, you'd open the image in Imageready and slice up each clickable thing and they would load as their own image.


http://www.ehow.com/how_5019819_publish-website-using-imageready.html

There are probably better methods and better tutorials, but I've done it this way before, and it's not too bad..

 

Slice and compress?

(Unless it's absolutely huge, 32 images is probably overkill)

 

yeah slice it up in photoshop, I prefer using fireworks for that mind, if your friend has that of course.

 

laugh at him

but seriously is it just an image, what happens when you click on various things?

 

I know it's now Sunday, and therefore I'm too late, but the question is why do you need to have a large image? If you're concerned about loading times, optimise the image so it loads faster and just set up an image map. Pretty straightforward depending on your web editor but it can be done even in notepad (although I haven't done that for a looooooooong time!).

 

I cut the image into 4 x 4 squares and threw in an image preloader. It's here at sofakingz.co.uk. It still needs work as the code isn't clean enough for me, it was just important it was up for the start of their radio show last night.

 

Simple image slicing as docodine said.

EDIT: Or you could make a flash object with a preloader.