Editing Photos for the Web
By Dave Maloney
This goes back to a couple blogs ago about people not having the patience for a website with too much info. While pages are more visually appealing with images and pictures rather than all text, how long does it take your page to load with all those pictures on it? After only a few seconds, your viewer is already losing interest in your site if they have to sit and watch your images load. A couple more seconds and they're hitting the "Back" button to return to their previous search to pick another (hopefully faster) site.
Not to say you should get rid of your images, just make sure you have them prepared for web use. If you're editing your own site and uploading your own pictures, this extra step will be easy for you.
If you don't have one already on your computer, you'll need a program that will let you edit photos. Graphics professionals will recommend Adobe Photoshop or Corel, but luckily you don't have spend all your money on software. If you have a digital camera that you connect to your computer, it probably came with a program on CD with some simple photo editing features. There are also several FREE photo editing programs that you can find online and download.
Now that you've got your picture opened in your photo software, just look for a setting like "Save for Web". If you can't find anything in there that offers to do that for you, don't worry; here's all you need to check:
- "Smaller is Better." The smaller the file size, the faster the image will appear on your page. (Please note that file size here refers to the actual memory size of the picture file (in kilobytes, or kb) and not the width x height dimensions of the actual photo.)
- Set your image's resolution for 72 PPI (pixels per inch). Computer monitors display at 72 PPI, so if your image is set any higher than that, it's just wasting memory, and consequently, speed.
- Shrink or crop the picture to the size (dimensions) you want it to be on your webpage. The width x height (usually measured in pixels, or px) can be whatever you want it to be to work in your layout, but saving the image at a larger-than-needed size and then resizing it on your webpage is still just wasting memory.
This whole process isn't as complicated as I've dragged it out to be, and after doing a couple you'll be able to prep your images for the web in a few seconds; less time than it would take a potential customer to watch and wait for a larger image to load on their screen. You may even notice that your pictures upload to your site faster!