Tuesday, August 10, 2010

Resizing Images - A Short Tutorial

My friend Stephanie Voss of Joyuslion wrote a short tutorial for our Digital Whisper group and she generously (as you always are Steph!) allowed me to post a copy here.  This tutorial came about from a conversation regarding the fact that so many people don't realize that all you need to post images on the web is an image sized at 72ppi (pixels per inch).  Most Web browsers are incapable of displaying anything other than at 72 ppi.  So unless you are going to print your graphics (usually 300ppi) it is best all the way around  for computers to keep them at 72ppi.  Remember computer space on your hard drive costs money.

Resizing Your Artwork for the Web
Every website that you upload photos to has a certain amount of storage space allotted to their servers. The more storage space a site needs the more expensive it is to maintain that site. This tutorial will show you how to size your artwork for optimal viewing on the web and at the same time save valuable, expensive, server storage room.
First of all I want to emphasis saving your artwork in the full size psd (photoShop layers) form. If you use another software product just make sure that you save a copy with the layers still in tack. That way if you ever want to come back and change something or even re-vamp an old piece, you still have the layers to work with.

Once you have saved your artwork with layers it is time to flatten it.

Go to Layer and at the bottom you will see “flatten image”

Now you want to save your image as a jpg. It is recommended to save your image at a resolution of 300 for printing purposes. This is the default resolution size and is found in the box that you use to set up a new document. If you right click the title bar of your work you will bring up the image size box. Or go to Image> resize.

This is a very important box with lots of important information! I save my 12x12 images at 3600 and 2400 ppi. 3600 is full size and 2400 is what my book printing company (www.artscow.com) uses for uploads. The resolution is still set to 300.

To make your image a smaller size for the web without losing any detail at all set the resolution box to 72 pixels/inch, and the height box to 600. Now click ok. You will see your image appear much smaller.

The image is still high quality but it does not take up that much space in cyberland. Save this image with your file name and the ppi size of 600. Example: BelieveWeb600. You can now upload this image to any website and the image will still sharp and clear…. but it will not hog up website storage space.

When you are saving artwork at a different dimension then a square (say an 8 x 10) just be sure to make the higher side 600 ppi. This will ensure that the image stays at or below that dimension. So in this case you would set the height to 600 ppi and the width would be smaller then that.
That’s all there is to it! It is quick and easy to do and it saves website storage space which ends up saving us all money!
s.voss 08/08/10

post signature

1 comment:

Sharon said...

Gail, What a great tutorial you have shared. And may I say that your blog is very pleasing. I didn't see it before but it sure looks nice now. Just wanted to pop over and say HI and thanks for signing up for the new class.