The last thing you want on your site is slow-loading pages. When visitors come by, you want them to stay, not get frustrated having to wait for huge files to download. And Google also values speedier pages over slowpokes in their results.
Here are some tips to make sure your images are not weighing your pages down:
DPI
Make sure you create your images at no more than 72 dpi (dots per inch). Higher dpi won't improve quality much and it will make the image file size much larger, slowing their load time. Photos taken with a digital camera are often 300 dpi or higher. Make sure to compress any digital photos before using them on a web page.
You can use a software program like Adobe Photoshop to compresses jpg files. You can buy the software at the site or use their online demo to compress one image at a time. With Adobe's Creative Suite you pay one monthly fee and you can use all the different Adobe software programs and they ara always upated.
Resizing
Never resize your images in the html code (by changing the width and height tags that tell browsers how to display your images). If you make the photos look bigger than they really are, the image quality will be very poor. If you force them to be smaller than they are, the file size will remain larger than necessary and the image will load slower than it should.
Instead of resizing images in the html code with height and width attributes, use an image-editing program like Adobe Photoshop or Macromedia Fireworks to physically resize your photos (and also compress them for file size).
JPG, GIF or PNG
Generally it is best to use JPG format for photographic images, although if a photo has large areas of a solid color, the file size may be reduced by saving it as a GIF. GIF is great for one to four color images. PNG is good for images that need transparency behind them.
