Insert Images and Text in Photoshop CS3

[This is Step 2 of the Photoshop CS3 Tutorial]

If you plan to use stock photos you should find the appropriate images and keep them ready. You should also have logos, bylines and some sample text ready. If your home page has a different layout from the rest your site you will have to create 2 different layouts. For the home page design you should be clear about what you want to communicate, things that you want to highlight and other usability principles. You should also be clear on your navigation based on your site plan.

Insert Images

Insert any images that you plan to use [File > Place]

  • Browse for the image file
  • Select the file
  • Click the 'Place' button
  • The image will appear in a sort of grid (see picture below) and the cursor will change
    insert image into photoshop
  • Click on the image and drag it where you want to place it within the canvas
  • You can also resize and rotate the image by dragging the corner nodes or hovering near the corner node till the rotate cirsor appear and then rotating.
  • Double click when you are happy with the placement, size and rotation of the image. The image will be placed there.

You will see that a new layer appear in the 'Layers Palette' where the image is placed. If you are unable to see the Layers Palette you can open it by via Windows > Layers.

layers palette
Layers Palette

You have many tools to clean up and enhance the image within Photoshop .

You can use auto levels to bring out the best in photos [select photo > Image > Adjustments > Auto Levels ]. If this option is grayed out - you might have to rasterize the layer first [In the 'Layers Palette', right click on the layer where the image has been placed > Rasterize layer]

auto levels

You can also try out the other filters.

Photoshop Filters

You can undo if you're not happy with it. By default you can undo 1 action in Photoshop . Use Edit > Step Backbard to revert to previous steps. You can also do this via the 'History Palette' [Window > History]. THe History stores a default of 20 states but you can change this from Edit> Preferences > Performance > History States.

history palette
History Palette

You can make changes to the images - remove backgrounds, resize etc. You can also create shapes.

Take some time to explore the options provided in the 'Tools Palette' [Window > Tools]. Notice that the options in the 'Options Palette' [Windows > Options] changes for each tool selected. Also click on the tiny triangle besides some of the tool icons for even more options.

Tools Pallette
Photoshop Tools Pallette

Insert Text

Use the text tool to insert text like a sample heading, sample textual content, menu items, byline, sample links, footer - copyright info etc. Style the text by using the options in the 'Options Palette'.

text options

You can specify the color, font, size etc. You can also add filters, alignments, spacing, leading etc. Explore what you can do with text.

Go to Step 3 >>

Photoshop CS3 Tutorial Menu

Step 1: Create a new Photoshop document

Step 2: Insert images and text

Step 3: Create the website design template

Step 4: Slice and export the images

Project: Create a simple layout

Photoshop Tips and Tricks

Suggestions for Improvement? If you have a suggestion to improve this tutorial please contact us. We would love to hear from you.


Photoshop Creative Suite 3
Create powerful images with the professional standards. Order Now!

Photoshop Video Tutorials

Adobe Photoshop CS4 Training

God Loves You! "For God so loved the world that he gave his one and only Son (Lord Jesus Christ),
that whoever believes in him shall not perish but have eternal life." - John 3:16, Bible