Melonpool
Stolen from a forum I frequent:
____________________________________________________
Understanding how to properly crop and size your photographs for optimum web viewing is important if you’re trying to share your photos with the community.
Although it seems that most everyone is on high-speed internet connections these days, there are still a substantial amount that log on using dial-up. Huge digital images will always time out for a slow internet connection, but can also bog down even higher speed providers. It may very well be true that your images are timing out for some of your viewers or loading so slowly that your potential viewer is navigating away from your page!
Nearly every single image you capture digitally is going to require some form of post-capture work in editing software. Not all these programs work the same or have the same options, so please, if any of this information doesn’t seem to fit in with your workflow or your software program, just ask a question!
~***~
There are some users who are uploading photographs directly from their camera – nine times out of ten; these files are just too large to load quickly or at all. If you can downsize your images in-camera and you know you won’t be doing any software editing, then please consult your manual and set your camera options to those best suited for web viewing.
File Size vs. Image Size
File size and image size are two different things. Some people prefer to think of their images in pixel sizes, I don’t because I worked with film-based photography for too long to go completely pixelized. I find that cropping to “Industry Standards” for image sizing is the best way to maintain a consistent and easily viewable sized image.
However, you need to keep in mind the highest output of YOUR camera – you may or may not be able to print larger image sizes at high resolution.
Industry standards for photograph sizes are as follows: 3 ½ x 5, 4 x 5, 4 x6, 5 x7, 8 x 10, 11 x14 and so on. These are standard sizes and these sizes are based on rectangles. Discussions about breaking out of these “standards” are fine – but keep in mind that framing for custom sizes is very expensive as is custom printing, even on home printers; you are going to have paper waste.
4 x 4, 5 x 5, 8 x 8, etc are square images and something that go in and out of fashion. Square for the most part is relegated to an “artier” look than rectangular images. Bear in mind, if you use square you should be using it consciously and with purposeful intent. DaVinci’s Vitruvian Man http://www.visi.com/~reuteler/vinci/vitruvian.jpg is a perfect and flawless example of the best imaginable use of “square.”
Cropping and value sizing are important in printing images, not as important online, but still there are dimensions that need to be understood so that the correct crop can be obtained for your image. Obviously, you can disregard this entire thing and crop to whim, but if you are going to pursue photography, either in school or at your local PicturePeople in the Mall, you will need to understand Standard Image Size.
(I’m not a conformist by any *cough* stretch of anyone’s imagination, but sometimes you have to go along with the program until you don’t have to anymore. I know that sounds “zen-ish” but think about it.)
4 x 5 is probably the smallest size you want to crop. 3 ½ x 5 is almost too small. 4 x 6 is awkward for most portrait work because it’s narrow (and yes, that is the size print you get back from your store-based printers). A 4 x 5 crop will automatically resize to 8 x 10 which is far too large for online posting, and a 3 ½ x 5 enlarges to a 5 x 7 which is the largest photo that is easiest to view online. Esthetically, if you’re posting multiple images together, you want to keep rectangles with rectangles and squares with squares. Sizes complement each other – 4 x 5 photos should really stay with 8 x 10 and 3 ½ x 5 crops should be used with 5 x 7 enlargements.
You should have an idea before you begin image manipulation what size you want your final photo to be, remember that a 4 x 5 enlarges to an 8 x 10 NOT a 5 x 7, so if you create a fantastic 4 x 5 image it will NEVER be a 5 x 7 and the different crop required could very well alter the composition of your beloved image. This is a mathematical situation, obviously, but something that could affect a final size of your finished photograph.
The FORMULA
Here is the mathematical formula needed to figure out the pixel height and width of your image for both print and web use.
For print multiply the image size by 300dpi, for web mulitply image size by 72dpi –
Example –
5 x 7 inch print will be 1500 x 2400 pixels
5 x 7 inch web image will be 360 x 504 pixels
The Work Flow
Set your camera to its highest/finest resolution. Take your photograph.
Bring the image into your software. Look at the image for a moment, decide if it’s vertical or horizontal. Decide if it’s a 4 x 5 or a 5 x 7. Set your crop options to size the crop in inches. Use your cropping tool to crop the image to that size.
(In Photoshop CS2- Click the crop tool. At top there are fields where you can put in width, height and resolution amounts.)
Then use “save as” say - ”GrandCanyon1” Close the original image – do not save any changes made to it!!! This is your pristine original and if you have the harddrive space, you should keep it in its raw form or if not, burn it to disc.
(You will end up with two more images saved to your harddrive – one that will be a 5 x 7 but at minimum 300 dpi in case you want to print your photo, the other will be a 5 x 7 at 72 dpi – this is the one you’re going to use online.)
Begin working on “GrandCanyon1.” This could be a tiff file, a jpg, or any other number of imaging file types.
Use your “image size” option and make sure you’ve got the correct size print – ie 5 x 7, then change the dpi to 72. Your image should shrink considerably, tell your software to show you the image at the actual pixel size and you should see your image become the size of your original crop - you should now be looking at a 5 x 7 image. Use “save as” once more, but you will have to change your title to…”GrandCanyon1 lowres” and save it as a jpg file. Now you have three images in the folder – the original raw, titled by your camera’s software, the large res “GrandCanyon1” and the low res “GrandCanyon1 lowres”
You are now ready to close the image – you should be prompted with a window that allows you to downsize the image digitally even more. Again, you can lose quality if you go to low, but a mid- point should keep the quality and yet make the image substantially smaller kb-wise.
_____________________________________________
I do something similiar to this work flow, but with a few tweaks here and there. Here is my work flow.
1. Open Image in Editing Software
2. Open a New image at 300 res and the specs at 5 inch x 7 inch.
3. Select all of the original image
4. Copy the original image.
5. In your new image, paste the copy.
6. Click transform (In photoshop ctrl+T)
7. Hold shift and bring the bounding box down to fit inside the new image. (There will be extra that will be outside of your image space. This is how you can crop your image to the new specs. All sorts of creative can come from this.)
8. Click "Save for Web".
9. When the Save for Web application comes up, click the "Image Size" tab.
10. With the "Constrain Proportions" box checked, change the numbers in the width and height fields to the numbers you came up with before when you multiplied by the size. For example, we want an image to be 72 res for web viewing. So we will multiply 5x72 to get 360. That is the new width. Do the same with the height. (7x72=504) This has made your photo now 72 resolution, and perfect for web viewing.
11. Select the quality and image type. Be sure to keep an eye out for the file size though. Photoshop tells you in the bottom left hand corner.
12. Select the lowest quality you can without compromising the image. (If you see those blocks of pixels, that is too low.)
13. Click "Save" and name it whatever you like, as long as it isn't the same as the original.
14. Now you have a proper file size that fits perfectly in all windows, doesn't take forever to download and doesn't make baby jesus cry.
15. Upload that baby and you are ready to go!
_________________________________________________
The reason why we do those proportions isn't just for print, but because they look balanced to our eyes. They are usually mathmatically balanced and so will make your images look better and more professional.
__________________________________________________
Feel free to post your own work flow, or questions. I'll be willing to help in any way I can.
You are butchering those poor little images!
