|
The
client, in this case, has asked that a drop shadow
be added to the logo and that the logo sits on a white
background on the website. What follows is the
typical process for making a logo web-ready.
-
First,
we need to expand the Canvas Size
so we can add a drop shadow to the logo.
Select Image/Canvas Size. We need to expand
the Width and Height of the Canvas.
Select percent from both the Width
and Height drop down lists and input 130
in both fields. Leave the Anchor Point
in the center. This is where the image data
remains relative to resizing the Canvas.
{Click} OK.
Canvas Size dialog box
-
Next,
we need to add a drop-shadow to the logo.
{Double-Click} on “Logo” in the Layers
Palette and the Layer
Styles dialog box will appear.
{Click} on the Drop Shadow checkbox
and adjust the Angle so it sits at 120 degrees.
{Click} OK.
-
{Click}
the Layer Options triangle
and select New Layer . Call
it “White” and use the Paint Bucket Tool
to fill it with white. {Click} and
drag the “White” Layer beneath the “Logo”
Layer. At this point, we’ve fulfilled
the client’s request for a drop shadow behind
the logo, which sits on a white background.
-
You’ll
notice that there is a lot of white space around
the logo and the drop shadow. We should
eliminate this space because the extra pixel information
translates into larger file sizes. Our goal
is to create a website that runs quickly and smoothly
as well as looking spectacular. To do so
you use only the absolute necessary amount of
pixel information. Use the Crop Tool
to cut away the extra white space.
When cropping it’s usually a good idea to expand
the size of the Image Window so you can
{Click} in the gray area of the Image Window
to begin cropping. {Click} and drag
a box around the area of the image you want to
keep. Try to get as close as possible to
the edges of the logo and drop shadow without
clipping or cutting them off. Press {Enter}
to crop the image. You may find you might
have to crop the image repeatedly to get the closest
cut.
-
At
present it’s highly recommended that you save
the file in native Photoshop (.psd) format.
Always keep a copy of your file in its native
form. In this case, we would keep a copy
of our Photoshop file and the original Illustrator
file (.ai). Save the file as travelogo.
-
Now
we have to optimize it for the Internet.
To do so select File/Save for Web. The Save
for Web dialog box appears.
|