Cropping and Resizing Graphics for the Web

This June-July in San Antonio, I'll be teaching a NECC workshop on Google Sketchup. I'm really looking forward to that. Each year, however, at our local VSTE (Virginia) state conference, I teach a popular workshop on Photoshop. I was recently asked a question about resizing images for the Web, and thought I'd share my tutorial.

Tutorial 3: Cropping and Resizing for the Web from John Hendron on Vimeo. The big deal here is when you create thumbnails, you don't simply put a "smaller" version of your photo online. Instead, you should perform a crop and zoom. Since you're cutting out real estate in a smaller thumbnail, you should increase the meaning by cropping-out the distracting content.

Tags: adobe, howto, images, photoshop

0 members like this

Comment by Julia Ault on May 18, 2008 at 8:56am: This tutorial is sorely needed by many folk on the web I am afraid. I have been writing tutorials on web graphics fro amateurs and hobbyists using Paint Shop Pro for years and one of the main things I always tried to stress was resizing and optimising....the amount of enormous images out there is truly frightening!!

Comment by Steve O'Connor on May 19, 2008 at 7:54am: I think it is needed by more than just folks on the web. Basic skills with digital imagery are woefully lacking it seems. Go to any digital photo kiosk at a WalMart or other such store. You will see the photo processing technicians in their white coats leaning over and guiding people through a vastly simplified process. My experience is that a lot of people don't even understand enough to get the pictures off their cameras--and if they manage to do so, they can't find them or print them (which gets into another area--understanding directory structure).

Manipulation of digital images is becoming a basic lifeskill that needs to be taught--particularly as we guide students into the world of Web 2.0.