Beginning HTML: Creating Images

Option 1: Find an Image

There are hundreds of sites for free images on the web. You can also use some clip art disks (with the warning that they are mostly designed for printing so some don’t look good on the web). Try these sites or search "free images" on

Option 2: Scan an Image

Scan an image using one of the scanners in the lab.

Open your scanned image in Photoshop to make modifications (crop, color adjustment, etc.) and save as a gif or jpeg by using the steps below.

Option 3: Create an Image

Use Adobe Photoshop to create a Title Image and Background Image.

  1. Find Adobe Photoshop on your hard drive and double click the icon to open the application.
  2. File/New
  3. Photoshop now asks for the dimensions of your new document. Mode=RGB, Resolution 72 -max. screen res. Follow the suggested guidelines below according to the type of image you are creating.

Background Gradient: 1024 pixels wide by 5 pixels high. The image should span the entire width of the largest monitor. Because a background image is tiled, the height can be small. This decreases file size.

Title Image/Banner: 525 pixels wide by 95 pixels high. This is an average size used on the web. 525 is the maximum number of pixels that would fit on a printed piece of paper.

You should now have a new image window on your screen. Go to either "create a gradient" or "create title image" below.

To create a gradient:

To save as JPEG: Because this image contains a gradient, save in JPEG format.

To create a Title Image:

To save your image as a JPEG follow the steps above.

To save as a gif: