Kate's Point of View

I’ve mentioned in past posts that I’m teaching an upcoming Photoshop course at work. I’m not an expert but I can make my way around the tool. I’m sharing my class in pieces. This post is about balancing color in your image.

Assuming that you’re working with an image created with a point and shoot camera (film or digital), the exposure of your image is likely out of your control. With Photoshop, you can work with the colors of an image to make it darker, lighter or have specific colors pop.

Sometimes you have images with something in the picture appearing as a silhouette. Generally speaking, when this happens and you’d like the silhouetted image to appear in detail, you are out of luck.

Other times you have an image where things just look washed out or a little dark. That is when you have potential to improve the colors in the image using Photoshop.

Below on the left is an old family photo from the 70s. It looks like it’s from the 70s with the way it’s washed out and a little yellowed. Further down is the image where the levels have been adjusted, making the image look brighter and cleaner. It’s a subtle difference but adds more life to the image.

Original image:

Edited image:

There are a few ways to edit an image in this way. First, as some background, it’s important to know that Photoshop will display a histogram illustrating the distribution of colors in an image. (A lot of digital cameras will show you this, too.) The histogram looks something like this:

The right side of the histogram illustrates the distribution of light colors in your image and the left side illustrates the distribution of dark colors. If you view the shape in the histogram as a mountain, ideally you will see the base of the mountain on both sides. If the mountain is cut off on either side, then your image is missing some of the color data. In that silhouette image above? The silhouetted image cannot be edited very much because the lighter color data for the image is permanently lost.

To play with the color levels, there are several options. Regardless, you need to get to the screen above. You do that by either going to Image … Adjustments … Levels or by selecting the icon that looks like a black and white cookie in your Layers palette .

Your layers palette looks like this:

If you don’t see that, you can pull it up by going to Window … Layers.

Once you go to the levels window (which, again, you get to either by Image … Adjustments … Levels or by selecting the icon that looks like a black and white cookie), you can edit your image by:

1. Click the “Auto” button.
2. Move the small triangle in the slider beneath the histogram. Ideally the right and left slider will be the base of the “mountain” on their respective sides. You can move all three triangles as much as you would like. You will see your image get lighter and darker, sometimes to the point of all black or all white.
3. The last option is slightly more complicated but gives you more control. On the levels window you will see a drop-down that says RGB. By default you are seeing a histogram that illustrates all shades in one graph. You can also see them individually for red, green and blue by selecting the appropriate color from the drop-down. Then you can adjust the distribution of light and dark for just your greens, blues and / or reds. This can be particularly useful if you have an image that is particularly dense in one of those colors, such as an outdoor picture with lots of greenery.

Want to start from the beginning? View class 1, which reviews the Photoshop toolbar. View Class 2, which reviews pictures for print versus web. View Class 3, which explores cropping and resizing images.

As always, see something you disagree with or think is just plain wrong? Tell me! Seriously – I want to know.

I mentioned earlier that I’m teaching an upcoming Photoshop course at work. I’m not an expert but I can make my way around the tool. I’m sharing my class in pieces. This post is about saving your cropping and resizing your images.

Cropping
To crop an image, select the Crop Tool from your toolbar. It looks like . Place your cursor on your image at where you would like to begin your crop. Left click your mouse drag your mouse so a dotted line appears where you would like to crop the image.

After you release your mouse, a box will appear on the image with the handles on your crop lines allowing you to change the size of your crop.

Select the handles and size your crop accordingly. When you have your crop marks as you want then, hit Enter.

Resizing
You can resize an image using the menus in Photoshop. Simply go to Image … Image Size … Type in the size you would like for your new image … OK.

In the drop-down menus you have the option to size your image by pixels, percentage inches, centimeters, etc. Work with whichever ones makes the most sense to you.

In nearly all occasions you will want to leave the “Constrain Proportions” box checked. This means that Photoshop will keep your image proportional to the original image.

Want to start from the beginning? View class 1, which reviews the Photoshop toolbar. View Class 2, which reviews pictures for print versus web.

As always, see something you disagree with or think is just plain wrong? Tell me! Seriously – I want to know.

I mentioned earlier that I’m teaching an upcoming Photoshop course at work. I’m not an expert but I can make my way around the tool. I’m going to start sharing my class in pieces. This post is about saving your images for the web and for print.

Defining DPI and When To Use What
DPI stands for Dots Per Inch. Although somewhat of an oversimplification, one way to view DPI is that on print to make something look nice you need to squish a lot more dots of color into each inch while on digital platforms you don’t need to have as many dots. There are different rules for when to use what, but if you remember two measurements, you are good:

• 72 dpi for digital
• 300-600 dpi for print (you’ll almost always be dealing in the realm of 300)

What happens if you prepare a print image at 72 dpi? It looks something like this:

(It’s a little hard for me  to illustrate this on the web…)

What happens if you prepare web images at 300 dpi? It slows down the time it takes your webpage to load. For examples of slow sites, check out this top ten list.

How to Adjust DPI
You can modify the DPI of an image down and achieve the desired outcome. It is nearly impossible to adjust the DPI of an image up and achieve good results. To confirm or adjust the DPI of an image: Image … Image Size … Resolution. The field next to Resolution is the DPI value. You can adjust it by typing a new number into the field.

Saving Digital Images
The two most common ways to save images are as .jpegs / .gifs for print or web.

Note: .jpeg versus .gif … If it’s a photograph save it as a .job. If it’s a line drawing, like a cartoon, save it as a .gif. If you aren’t sure, save it as a .jpeg.

Method 1, which can be used for print or web, but assumes you have already set your image to the appropriate dpi: Save your image by File … Save As … Select .jpeg as format and type in file name … Save As … Select the image quality* … OK

*Image quality for a print image should be 12 (nicest). If you are saving for web, you can set the quality at 7 (medium quality).

Method 2, which can only be used for images that will only be used digitally: File … Save for Web and Devices* … Select version of file you want … Save

*The first time you save an image this way, I recommend you set up the next screen like the version below. Once you have set this up once, you should not need to do so again.

Some notes about this screen:

1. I recommend the “4-Up” layout.
2. Select ,joeg or .gif, as appropriate.
3. If saving a .jpeg, set the quality at 60. This will act as a good default for you.
4. You can change the quality setting for each block. The thumbnail in each corresponding block will show you how the image, saved at that quality, will look. Pay attention both to the image quality as well as the file size. You want to achieve the highest quality as the smallest file size.

File Types
There are many file types to select from when saving an image in Photoshop. Here are the most commonly used ones and when to use them.

• .psd: If you are doing extensive editing work in Photoshop, saving your file as a .pdf will allow you to save your editing history and multiple layers. (I won’t be covering layers in any of my posts but am happy to answer questions if people have them.)
• .jpeg: This is the most widely used and popular photo file format. This is a good format to save a file in when you are done editing. If you are still working on the file, it’s better to save it as a .psd so you don’t lose any data. Every time you save resave a .jpeg, you are losing a small bit of data.
• .gif: The Graphic Interchange Format is great for graphics but less appropriate for photos. These file types can display up to 256 colors, which works for graphics but limiting for photographs.
• .png: This is a lossless file type, meaning that, unlike the .jpeg, you can save this file type over and over without losing any data. Unfortunately, this file type is not as widely supported as .jpegs and it does not support CMYK colors, meaning commercial printers can’t use them.
• .tiff: This is another lossless file type, so you can save it over and over without losing data. It also supports CMYK so it is good use in commercial printing. Unfortunately the file sizes are huge and often too unwieldy to work with.
• .eps: Files in this format are often used by printers because they can be imported into many printing programs. Unless requested by a printer, this typically does not make sense to use because it cannot be opened by many programs.

Want to start from the beginning? View class 1, which reviews the Photoshop toolbar.


As always, see something you disagree with or think is just plain wrong? Tell me! Seriously – I want to know.