« Q & A page
« tech pages
Q: How do I optimise photos for quick downloading?
by Mike Slocombe
Q: We've built a Web site for our mum who
owns a pub in our village. She's really impressed because it's packed
with digital and scanned-in photos from a selection of drunken nights
in the bar, but I cringe when I look at it because I think it's so bad.
It's not the design so much, because the regulars wouldn't know
bad design unless it was served in a dirty glass.
But all the pictures
make every page slow to load, even though we built thumbnail galleries
and split the galleries on to different pages. The problem is, we
designed it using a fast connection and didn't realise quite how slow
it was. We don't want to scrap the site and start again, or even spend
much more time on it to tell you the truth, so is there any quick lazy
fix we can try out?
Ty & Sarah
A: The key to putting up images on the Web is optimisation. It's crucial to get your images down to as small a size as possible because hefty, 10-ton images equals unhappy surfers or, more often, no surfers at all.
Be sure to save images no higher than 72 dpi, and choose the right format for the image (http://tech.irt.org/articles/js206).
Make your photos as physically small as they need to be to convey the
intended message (anything over 600 pixels wide is bordering on excess)
and aim to keep the entire weight of the HTML page under 50k.
And if you really need a lardy graphic on your site, warn people before they click on the link to it.
Most graphics programs offer a comprehensive suite of tools to
optimise and export files in the most popular Web formats. Bank
balance-draining applications such as Adobe Photoshop and Macromedia Fireworks are particularly good at this task, but if the spondulas are slim, Paint Shop Pro and Photoshop Elements are a capable budget alternatives.
If money's too tight to mention, don't give up, as there's totally free
Web graphics software available, too. Check out Ultimate Paint 1.9, VCW VicMan's Photo Editor or The GIMP, or take a look around Freegraphics.com, www.tucows.com and www.tudogs.com.
You can even optimise your images online at www.spinwave.com.
Because JPEG is a 'lossy' format (which means each time you open
and save a JPEG you lose more information) you should save your images
from the original files rather than try to compress already compressed
photos. See JPEG Compression for the Web.
Programs like Image Optimizer will automatically compress entire directories, and many graphics editors will let you 'batch convert'. And programs like ACDSee and CompuPicPro will automatically create pages of HTML thumbnails and link them to
full size images.
If you're using Fireworks, you can use the Create Web Photo Album command. More advanced users might want to consider using
clever PHP scripts to do the job. See resourceindex.com/ for more details. Or if cheesy 'page flipping' photo albums are your bag, look no further than Flipalbum.com. But have a barf bag at the ready.