The See Through Image
by Jim McGee
If you're putting your images on the Web
or using it with a publishing package it's sometimes handy to be able to
drop out part the image and let the background show through as in the
image of the camera to the right.
The good news is this is really easy to do and will give you images
that will be smaller and load faster than just filling the background with
the background color on your Web page. It also means you won't have to
edit the image if you change the background colors on your Web page and
finally it means that the image will look correct if you copy the Web page
into a PDF or other format. The bad news is that you'll be limited to
using 256 colors.
The Technique
The technique couldn't be simpler in Photoshop. First use Save
As to save the image in GIF format making sure the Transparent
box is checked.
Reopen the GIF image and use the selection tool to choose the
areas you want to see through; then choose Delete
to remove that area.
When you load the image into a Web page you'll now be able to see
through the image to the underlying background. This opens up numerous
possibilites for artistically combining images, backgrounds and text on
your page. It's a simple - but extremely powerful technique.
|
|
The image on the left
is a "normal" image, meaning it is opaque and completely
covers the underlying background. |
In the image on the
right the area surrounding the camera has been deleted and the image
saved as a transparent GIF. This allows the underlying background to
show
through. |
Wisi
e nim admin im veniam, quis nostrud. In atsvulpate velt esse meleste
at semper manet sola. Ut lacreet dolore magna aliquam sic semper fi
tyrannis erat volutpat. Wisi enim ad minim veniam. Dolore eu sata
sfeugiat. Ipsum lorem vei illum sat dolor euis mod tincidunt vei
auminiure dolor in esse. Ultaceet dolore magna si napi. Wisi e nim
ad minim veniam, quis nos In a tsvulpate velt esse meleste at semper
manet sola. UT lacreet dolore magna aliquam sic semp fi tyrannis
erat volutpat. Wisi enim ad minim veniam. Dolore eu sata sfeugiat.
Wisi e nim admin im veniam, quis nostrud. In atsvulpate velt esse
meleste at semper |
Here a transparent GIF file is laid
over the underlying text. This can even be done with an underlying
image using the code snippet shown below.
|
<img
border="0" src="../31/images/FinepixS2_1.gif"
align="baseline"
style="position: absolute; left: 17; top: 1179"
width="277" height="300">
Subscribe to
Vivid Light
Photography by email
Tell
Us What You Think
|