Quick and Easy Photo Editing with Pixlr
Why bother?
If you upload pictures to the SharpSchool web site as they come from your camera the file size is over
fifty times the size that is needed for your web page. When you upload a picture and change the picture
size in the dialog box below you are only changing how the web browser displays the image not the
actual image size.
Please take a minute and resize your pictures with Pixlr—a photo
editing program that is unbelievably good for a web based program.
Pixlr can do many of the edits you can do in Photoshop.
If you spend a few minutes with Pixlr you can save a great deal of
bandwidth for those accessing our web site.
You can find it at: http://pixlr.com/editor/
I suggest that pictures be in the 480 x 360 pixel range for group
photos. A large scene might be 640 x 480 pixels. A recommended
individual portrait shot size is 400 x 300 pixels. The numbers
represent pixels wide x pixels tall. Any variation of these numbers
work for a web picture—whatever is needed to show the subject.
Pixlr’s Easy Interface
You start here with an easy choice. Most often you’ll open a picture
from your computer.
Once your picture is open you can control the
display size using the Navigator Panel. This does
not change the picture size, only the size it
displays in the browser window.
You notice that you can work with layers and
picture history as in Photoshop if you are
interested.
You can learn the toolbar tools (seen at right) by
running your mouse over the tool and waiting for
the dialog box to appear. It describes the tools
function.
Your First Task
The first task after opening the image is to either crop the image to size or to resize the whole image
without cropping.
Cropping
Cropping is a good way to reduce image size and to control the main content of the picture. The
crop tool is pictured at the left. You have choices about how the tool helps you calculate the crop.
The most useful is to constrain the crop to a particular pixel dimension—crop to size. See the picture:
This lets you crop the picture and resize at the same time. In the next picture I’m doing just that.
The area to be saved is enclosed in the
bounding box. Double click in the box and
the crop is completed.
Results of crop.
Resizing
Resizing is done under the Image menu at the top of the main window. You should constrain the aspect
ratio.
Second Tas –Fix the Color
These tools are under the Adjustments menu at the top of the main window. You will probably only do
this step if your picture is underexposed, overexposed, or needs a bit of a boost in color. All of these
adjustments can be done easily, but go easy on the controls.
Here are the three tools you will try first:
1. Exposure – lighten or darken your image.
2. Brightness & Contrast – does what its name says
3. Color Vibrance – this tool saturates select colors—makes them more intense. It leaves colors
commonly found in human skin alone. It works subtly but makes a difference.
Move the slider to the left and watch the difference.
Final Task – Sharpening the Image
This task is saved for last. You cannot fix a picture that is badly out of focus by sharpening—select a
better picture instead.
To sharpen a picture you should actually use the unsharp mask tool found under
the Filter menu.
When you select this filter you will get a dialog box. I suggest settings close to those in the picture.
If you’ve had experience with the same operation in Photoshop
you’ll understand the settings. If not, start here and vary the
Amount from about 50% to whatever maximum makes the
picture look sharper—edges more pronounced, main objects
more defined.
If you over do it the picture will look like the next example.
Far too much sharpening!
Now It’s Time to Save
You should save your pictures in either jpg or png file formats.
Most often you’ll select jpg. This allows you to create smaller file sizes. You have only one important
decision to make at this step if you select jpg. That is the jpg compression to use as you save the file. This
is a little counterintuitive. A lower number means more compression and a smaller file—more picture
data is lost. A higher the number means less compression, a larger file, but a higher quality picture. Here
are two examples:
Quality = 80, file size = 25 KB
Quality = 20, file size = 9 KB
This picture has a smaller file size, but is of
terrible quality.
Generally I set jpg quality to about 50. You can set the quality to around 50-60 and not really agonize over
the decision.
You now have pictures ready for web display without much trouble and no expensive software. If you
have any questions contact me at [email protected].