Resizing Photos for Use on Websites

kitten headshot I find fellow writers (and illustrators) who struggle with getting their book cover images and pictures of themselves in the correct format to upload on websites. In fact, they might have as much of a startled look as this little guy does.
Here’s a how to…
GENERAL GUIDELINES
or WHAT YOU NEED TO KNOW FIRST

Determine what formats are acceptable. Most common ones are: jpg (jpeg), png or gif. (This is the ending after your file name.) Most pictures out of a camera will be .jpg. When scanning an image, you can usually choose your format.
Check to see the required size for the document or website. Often this will be listed in k or mg (thousand or million). It may be listed in pixels. For example on the SCBWI.org website for book covers or profile pictures, it says: “(must be less than 4MB and a jpg, png, or gif).”
Save your picture with a new name (or duplicate and rename) and work on the copy, so you don’t lose the original high quality image. VERY IMPORTANT!
Crop your picture if necessary before resizing. For a cover image, crop to cover only. For an image of you, it depends what the image is for. Many times you’ll want a head and shoulders shot, versus the whole body.
After you resize save your picture under the new name again.

FOR MAC USERS
Cropping on a Mac

Using FINDER open your duplicate picture in PREVIEW by double-clicking on the copy of the image you want to change.
Choose EDIT on the menu bar.
Click on SELECT ALL. (dotted lines will show around the image)
Sometimes my computer lets me use the mouse pointer as a double-headed arrow to drag the image from corners or sides. Other times, I have to follow the next two steps below. (I’m sorry I don’t why it is different at different times!)
Choose TOOLS on the menu bar.
Click on CROP and use your mouse to click and drag a frame around the portion of your picture that you want to keep. (The icon for your mouse pointer will be a plus.) You can move the frame in or out by the dots on the sides or corners.
When satisfied, go back to TOOLS and click on CROP. Your picture will be “cut down” to the image you want.
Happy with your cropping? Go to FILE on the menu bar and click on SAVE. If not, go to FILE and click on REVERT TO and choose the older “new original” file.

Resizing on a Mac

Using FINDER open your duplicate picture in PREVIEW by double-clicking on the copy of the image you want to resize.
Choose TOOLS on the menu bar.
In the popup window click on ADJUST SIZE.
You’ll see a FIT INTO ___ PIXELS drop down arrow at the top of the new window. Click on the arrow. Choose 640 x 480 or 320 by 240.
Near the bottom of the window a message will flash saying “Calculating Size.” It will tell you how big the picture was and how big it is now. If too small, choose a larger dimension of pixels.
Happy with your image size? Click OK to save.

FOR PC USERS
Cropping on a PC – using Microsoft Office Picture Manager
(If you have Microsoft Office products, you probably have Microsoft Office Picture Manager.)

- Open your duplicate of your picture in Microsoft Office Picture Manager either by opening the program and locating the copy of the image OR using FILE EXPLORER (windows explorer on older PCs to navigate to the copy of the image and right click so you can choose EDIT which will probably open your file with MS Office Picture Manager.
- On the TOOLBAR at that top click on EDIT PICTURE.
- In the popup window on the right, choose CROP.
- Drag black line icons from corners or from each size to crop image. You can move these in or out.
- Click OK.
- Happy with your cropping? Go to FILE on the menu bar and click on SAVE. If not, click on UNDO and start over.

Resizing on a PC – using Microsoft Office Picture Manager
(If you have Microsoft Office products, you probably have Microsoft Office Picture Manager.)

- - Open your duplicate of your picture in Microsoft Office Picture Manager either by opening the program and locating the copy of the image OR using FILE EXPLORER (windows explorer on older PCs to navigate to the copy of the image and right click so you can choose EDIT which will probably open your file with MS Office Picture Manager.
  - On the TOOLBAR at that top click on EDIT PICTURE.
  - In the popup window on the right, choose RESIZE.
  - In the new popup window you can choose, PREDEFINED WIDTH X HEIGHT (or Custom width x height or percentage of original width x height)
  - Using the dropdown arrow choose WEB – LARGE or WEB – SMALL, E-MAIL (large or small). After you select one, look at the difference between the old size and the new size. It will show you in pixels!
  - Click OK.
  - Happy with the size? Go to FILE on the menu bar and click on SAVE. If not, click on UNDO and start over.

ANOTHER PC PROGRAM
Windows 10 will open a program when you click on a photo that also allows cropping, but I don’t see resizing. You can get to it by going to Windows icon in the left bottom corner, then clicking on PHOTOS.

- - As before, make a copy of your original picture first!
  - Go to website. http://picresize.com/
  - Select picture by clicking on browse to find the picture on your computer.
  - Click continue.
  - In the new window you can Crop if needed.
  - After you’ve cropped, rotated, etc., you may make your picture smaller in Resize Your Picture by clicking on the drop down arrows.
  - I wouldn’t recommend Special Effects.
  - Click on I’m Done, Resize My Picture!
  - Now you can View Image or Resume Editing your picture.
  - When happy with it click Save to Disk – you will not get a chance to rename your file, which is why it is so important to have a copy of your original file first.

cropped photo courtesy of morguefile.com

Please follow and share:

Resizing Photos for Use on Websites

Author: Susan Uhlig

Susan's bookshelf: read