We start this off with
the understanding that you have a basic computer knowledge
and expect that you have extracted the .zip file containing
your template onto your computer (using a program such
as Winzip) into
a place that you will remember. You have then opened
the folder containing the template and have found the
.psd file (not all templates include .psd files, be
sure to read the full description of each template
for what files it does contain).
We are going to start out using Template
#10026901.
Click here for a free linkware version of this
template!
Photoshop is a very complex program
that is actually quite simple to use once you get the
hang of it. There are a lot of tools that you may never
even use, however as you advance further into learning
about the flexibility of Photoshop, you will really
be able to design like the pros in an environment that
is very well laid out and easy to use.
When you first open Photoshop there
are a bunch of different extra windows that pop up
along with the program. Most of them have "x" boxes
so that you are able to close them. If you are a beginner
or have a smaller monitor/higher resolution it may
be easier for you to go ahead and close all of the
windows that you see except the "layers" window.
The tool bar does not close, and it is a very important
part of using Photoshop. If the "Character"
window is not open, you will need it. In order to open
any of these windows again, simply click on "Window"
and there will be a list of the windows. Some of the
windows will have check marks next to them, this means
that you have that particular window open and in focus.
You are free to open any windows you might think you
need, including the character window. If you ever want
to have all the windows go back to their original positions
click on "Window", "Workspace",
then click on "Reset Palette Locations".
This will bring you back to a fresh start. For now,
you may just want to have the toolbar, layers, and
the character box available.
Go ahead and open the .psd file in Photoshop (File,
Open, browse to the location of your template and click
open or double click on the .psd file from the folder).
You will then see the template just like the image
below.
 As
you can see, there is not much text in this particular
template that is included in the .psd. This is not
always the case. Many of our web templates include "filler"
text which actually is only so that you are able to
get a better idea of how the template will look while
you are in the design process. We have chosen this
template because it is clean and easy to use for this
purpose. The only part of this template that will need
to be changed in Photoshop for this template is the
company name.
On your toolbar click the "T"
icon which we have clicked in this sample. You will
see when you click any of the different icons on
the toolbar they will change to be highlighted. When
you click on the "T" you are able to edit
or add text. You will want to change "Company
Name"
to reflect your company name. With that tool, simply
click that text and you will be able to edit it. Type
in your company name, click the checkmark box at the
top, and you are done! In the event that a template
would contain other things such as navigation, button
text, or even headers that would require you to change
them you can follow the same process all the way through.
This template uses .png (Fireworks)
files to create the slices in the image to assist in
creating the final product. Some templates use Photoshop/Image
Ready for this process however Fireworks is the easiest
to use and optimizes the graphics to be of the highest
quality possible while still being a small file size
which decreases the load time for your website.
In order to prepare your newly edited
design first be sure to save it! Once you have saved
it in the .psd format (File, Save) go ahead and save
it as a .jpg (File, Save As - then choose a name for
it and choose the .jpg format in the highest quality
possible).
Click the button below to proceed
to the next area:
|
