Optimizing images for better iWeb output

April 30, 2009 2:48 PM

What's the best way to optimize the images for my (not template-based) iWeb site?

The basic problem is that this banner loads very slowly. I'm wondering what image type is best for each piece, as well as how to prevent iWeb from chopping them up into ...

The logo is a GIF, and it looks like iWeb doesn't mess with it. What about the banner behind it? Since it has a gradient running across it, is it inappropriate as a GIF? If so, then JPEG or PNG? Alternatively, should the whole thing – logo and banner - be a single image?

Lastly, the section links running across: right now, they're copy/pasted into iWeb from Illustrator, so they get chopped into PNG files on export. Should they be embedded within the banner image instead?

Thanks in advance!

posted by huron to computers & internet (6 comments total)

This is almost impossible to judge without seeing the actual images you're talking about.
posted by kindall at 2:56 PM on April 30

how large is the gif?
posted by meta87 at 3:02 PM on April 30

Sorry, meant to link to the actual page:

www.emergingminds.ca
posted by huron at 7:00 PM on April 30

Your images look fine. You do have a 1708x1708 PNG that is 78k which seems a bit strange. Otherwise, the slow loading might be your connection or your web host.
posted by wongcorgi at 7:10 PM on April 30

Thanks wongcorgi,

I'm a bit surprised that the size looks reasonable to you (and loads reasonably fast). I download the very top image – shapeimage_4.png – it comes down as an 80k file.
posted by huron at 8:09 PM on April 30

For starters, it seems the translucent circular shapes are actually circles in iWeb. It looks like iWeb actually creates these (huge) individual images, and places them into the outputted page. So the basic rule seems to be, one PNG image for any shape created in iWeb – at least those translucent ones.

To be honest, as I was writing this question, I had a nagging feeling that I was in the territory of abusing MetaFilter's generosity with this question. I thought someone might fire off a quick answer, but that's not really so much what MetaFilter's about... I really ought to have tried different options, all by myself.

To atone, I'll try some options, see if iWeb basically leaves placed images intact, and post here again if I end up with a reasonable result. So maybe this thread will be useful to someone sometime.

Thanks for your help, k, m, w.
posted by huron at 2:47 PM on May 2