Step One: Preparing Your File For Saving

Step 1.1:

Before you can save your file for the web, what you need to do is to remove any UNUSED layers from your document.

To do this just open your header.psd file by clicking FILE> OPEN.

When you locate the header.psd file, select it then click the OPEN button:

Step 1.2:

When the header.psd file is open in Elements, go to the MENU BAR and choose WINDOW, then LAYERS

Step 1.3:

When the LAYER PALETTE opens, you will see the layers that make up your graphic header, like this:

In the example above we have a layer that we are not going to use called "Layer 2", so we are going to have to delete it. See below for steps on how to do that.

Step 1.4:

Below you will see a layer that's not used. I've highlighted it below in red:

What we need to do is SELECT that layer, then DRAG it to the GARBAGE CAN icon near the top left hand side.

Step 1.5:

That leaves only the layers we need to include and makes for a smaller file size after saving.

Step Two: Saving Your Header

Step 2.1:

When you are ready to save your file, just go to the MENU bar and choose FILE: SAVE FOR WEB

Step 2.2: Here is an OVERVIEW of the SAVE FOR WEB options:

The SAVE FOR WEB options are shown below in three different sections, starting with the ORIGINAL and OPTIMIZED IMAGE preview window.

What you see highlighted in yellow on the bottom right side is the total file size of the image you are saving.

63.07 KB (Kilobytes)

It also shows the number of colors you're using:

256 colors

And finally, the last important section is the file format:

GIF

Step 2.3: To optimize the file, first decide whether you need to save your image in .GIF or .JPG format.

Remember, if your image is primarily photographic, choose .JPG. If your image has a lot of text or solid colors, choose .GIF.

SAVING IN .JPG FORMAT

In our case, we've got an image that is made up primarily of images so we'll choose .JPG as the format we need to use.

To choose .JPG, look at the #1 below and see how you select .JPG from the drop down menu:

Next we need to specify the level of compression. (See #2 above)

The largest file size with the least compression is 100. The lowest (worst quality) is 0. The best "middle of the road" option is 40, like you see above next to the #2.

What you do to determine the acceptable level of compression is to change the number and as you do, look AT the OPTIMIZED image itself and you'll see the changes in quality.

When you see a level of quality that works for you and the file size is acceptable, click the SAVE BUTTON.

Saving in .GIF format

In your case, if you've got an image that is made up primarily of blocks of color or text, you need to choose .GIF format.

To choose .GIF, look at the #1 below and see how you select .GIF from the drop down menu:

Next we need to specify the number of colors to use. (See #2 above)

What you need to do is start with the LOWEST number of colors, then as you change the number and start to go higher, you need to look AT the optimized image and see how few colors you can use while retaining the best file size.

When you see a level of quality that works for you and the file size is acceptable, click the SAVE BUTTON.

Tip: If your image has any transparent areas to it, click the TRANSPARENCY checkbox to select it. That keeps the transparent areas clear when saving in .gif format.

Tip: It's not possible to save an area of transparency in .jpg format.