|
Processing
And Saving The Photos For Web
Publishing the photos on the web is the best way to
share experiences and to learn with other photographers, and it is a
great way to publicize your work. To create an effective web
presentation, it is necessary to follow some basic steps top resize,
sharpen and save the photo.
Resizing and
two-step sharpening
The first thing to
do is resizing the full size file from 8/12/20 megapixel to
"web size". The full size photo is way too big and
heavy to be published on the web; usually I resize it to 720
pixels on the longest side: this size is a good combination
between quality and file size. To resize the photo, click Image
> Image Size. Be sure to check the box "Constrain
Proportions" and the box "Resample image";
set the combo box on "Bicubic" (this is the
most advanced resizing algorithm).
Other than that, remember to convert the image
to 8 bit and to sRGB colors space, if you have not done it yet
(it is not possible to publish on the web a 16 bit photo and,
while it is possible to publish a photo with Adobe RGB color
space, it would appear very flat and desaturated).
The resizing and the sharpening are closely
related, since resizing softens slightly the photo, and you
need to apply sharpening to get to improve the detail. Instead
of resizing directly the image
|
 |
| to 720px, I use a
two-steps technique and the layer mask to get the best
results. I begin by resizing the photo on 1200 pixels on the
longest side and I apply one or more times a simple sharpening with Filter
> Sharpen > Sharpen. The photo will appear quite
oversharpened: don't worry, this is just an intemediate step,
the oversharpening won't appear in the final image. If the
photo has out of focus areas, I make a copy of the background layer on a
second layer (Right-click on the layer Background and
select Duplicate Layer from the pop-up menu) and
I apply the sharpening on the copy.
Finally, I resize the image to the final size (720 pixel on
the longest side) and I apply the much finer Smart Sharpen. |
Smart Sharpen (and
Layer Mask) for web-sized photos
 |
The Smart Sharpen, introduced with
Photoshop CS2, is one of the most powerful sharpening algothms
currently available. The SS uses an algorithm that is far more advanced than the
one of the old Unsharp Mask; the practical difference is that
the images processed with the Smart Sharpen are crisper and
they have less artifacts than the ones processed with the
Unsharp Mask. After resizing the photo to 720px, I select the
SS from the menu Filter > Sharpen > Smart Sharpen.
I use the Basic interface: it is easy, fast and it has all
the controls that I need. First, I set the "Remove"
box on "Lens Blur" (the default value is
"Gaussian Blur", that works like the less
advanced Unsharp Mask). Other than that, it is
important to check the "More Accurate" box,
to get the best results.
To get good results, it is very important to set the Amount
and Radius on the right values. Depending by the image, I used
a Radius of 0.1 or 0.2 pixels, and an Amount
between 30% and 120%.
|
These values looks pretty low, but they work really
well for the images that had been resized in two steps as described
in the previous paragraphs. That said, many times it is necessary to
apply the sharpening with the Layer
Mask, to avoid the artefacts. In landscape photos, it is easy to
get sharpening halos around the edges. To avoid the halos, after
resizing the photo to 720 pixel, I make a copy of the layer and I
apply the Smart Sharpen on the copy, then, using the Layer Mask I
apply the sharpening on the entire image, except the edges.
In fauna, flora and macro photos, there are often
out of focus areas. If you apply sharpening on the entire image, it
is easy to see some noise, in particular using very effective
sharpening techniques as this one. In these cases, I make a copy of
the background layer as first step (after resizing to 1200px, but
before applying the simple Sharpen filter). I use the Layer
Mask to apply the sharpening technique only on the subject, without
exacerbating the noise into background.
 |
 |
| Before
and after: it is impressive to see how much you can improve
the photo with a good sharpening technique |
In some photos taken at high iso (400
or 800), I apply even a bit of noise reduction on the background,
even for web-size photos: the resizing eliminates the majority of
noise, and by using even noise reduction it is possible to get silky
smooth backgrounds at every ISO. Of course, it is necessary to use the
Layer Mask to apply sharpening on the subject and to apply
noise reduction on background.
This technique takes a little of time,
and it is necessary some experience to get good results (it is easy
to oversharpen the photo). If you want to minimize your effort with
Photoshop, resize the photo directly to 720px and apply the Smart
Sharpen with Radius 0.2 pixels and Amount 80% (the
results are quite good, even though not as good as the results of
more advanced techniques). Personally, I prefer to spend a little
more time with PS, since I want to get the best possible results.
Applying the
signature
 |
It is not essential to apply a
signature or copyright to your photos: all photos are
copyright of the photographer, even without any copyright
notice. That said, I like to apply a small copyright notice
and the name of my website on the photos: it is pretty easy
and it is a good "reminder" of the copyright.
The
text should be easy to read (use a white font for dark
background and black font for light backgrounds), but it
should not distract from the photo; I recommend to use small
fonts and to place it in a corner. |
In my opinion, it is a nonsense to publish photos on
the web with big watermarks or text right in front of the photo: it
is almost impossible to appreciate the image. If you are so worried
that someone might steal your photos, don't publish them at all.
Personally, I have earned more thanks the good web presentation
rather than what I've lost due to unauthorized use of my images.
Saving for web:
the JPEG format
The last step to
publish the photo on the web is to save it as JPEG. The JPEG is surely the most popular image format for
the web: it allows to compress very effectively the images and it is widely compatible; all the image editing programs,
the
browsers and many other programs can show JPG images.
The JPEG ( Joint Photographic Experts Group ) is an image compression algorithm used by many file
formats; nowadays the most popular JPEG format is JPG (.jpg).
The human eye is not able to perceive with precision minor color
changes, so JPEG compression analyzes the image and it sacrifices some color information to reduce the
file size (a
JPG image can be 10-20 times smaller than it uncompressed
equivalent, while maintaining a good quality).
The degree of JPEG compression can be set by the user; if you use a
strong compression you have a very small file size but poor
image quality, and vice versa. Remember that it is a lossy compression algorithm; in other
words, when you save the file you throw away some information to
achieve a smaller file size.
|
|
| You must avoid to work two or more
times on a JPEG image, because every time that you save as JPEG the
compression artifacts accumulate. If you plan to edit again an image
before preparing it for web, save it
as TIFF. |
To save the image for web, select File > Save
For Web. Saving an image as JPG requires a little of
experience; many photographers uses a wrong compression value,
resulting in unnecessary heavy files or in exaggeratedly compressed
images that show very evident artifacts. In the "Save For
Web" window, be sure to select JPEG as file format (the default
format is GIF), and set the Quality on a value between 60 and
80: usually, these values gives the best results. In the preview
window, you can see the effect of JPEG compression and the size of
the image. The size depends by the detail of the image (very detailed
photos have a larger file size than photos with out of focus areas)
and by the compression value. I recommend to choose a compression
that gives a file size near 100-120kb; in any case the file must be
no bigger than 200kb, otherwise the photo takes a lot of time to
load (remeber that not everyone has a fast internet connection!).
Do you have
comments or questions?
If you have comments or questions about this
article, feel free to ask in the Juza
Nature Photography Discussion Forum!
|
