HTML, XHTML and CSS All-In-One for Dummies - Andy Harris [354]
Each layer has two icons next to it that you can activate. The eye icon toggles the layer’s visibility. The link icon allows you to link two or more layers together. Each layer also has a name. You can double-click the layer name to change it. This is especially useful when you have a complex image with many layers.
The bottom of the layers panel has the following buttons to help you manage various layers:
♦ New Layer: This button creates a new layer. The default type is transparent, but you can also choose to have the layer appear in the foreground or background color.
♦ Up and down buttons: Allow you to move a layer up or down in the stack. The position of a layer in the stack is important because higher layers have precedence.
♦ Duplicate Layer: Makes a copy of the currently active layer. If you’re modifying a layer, working on a duplicate is a great idea because if you mess up, you still have a backup.
♦ Anchor: When you copy and paste a part of an image, the pasted segment is placed into a temporary layer. Use the anchor button to nail down the selection to the current layer.
♦ Delete: Allows you to delete the currently active layer. Be careful you delete the correct layer.
Introducing Filters
Digital editors include a number of other very useful tools. Generally, these tools apply mathematical filters to an image to change the image in some way. The standard installation of Gimp comes with dozens of filters, but here are a few most common to Web developers:
♦ Blur filters: Blur filters reduce the contrast between adjacent pixels to make the image less defined, and can often be used to hide imperfections or scratches. The most common blur is Gaussian blur, but there are many others, including Motion blur, which simulates the blur seen in a slow camera taking a picture of something moving quickly.
♦ Unsharp mask: A class of filters called sharpen filters are the opposite of blur filters. They increase contrast between adjacent pixels. I don’t know why the sharpen filter is called the “Unsharp mask,” but it is. Note: There is no “enhance” filter like the ones so common on crime dramas. Sadly, you can’t just “zoom and enhance” endlessly to see the killer’s eye color on the reflection of a spoon.
♦ Colorize: This marvelous tool allows you to keep the contrast of a layer and change the color, which can be perfect for changing the color of hair, eyes, or clothing.
♦ Brightness/Contrast: Lets you adjust the brightness (overall value) and contrast of a particular layer.
♦ Color balance: Allows you to adjust the relative amounts of red, green, and blue in a layer, which can be used to improve pictures with poor lighting.
Solving Common Web Graphics Problems
Gimp, and tools like it, can be used in many ways. The rest of this chapter is a cookbook of sorts, showing how to build a number of graphics commonly used in Web development.
Changing a color
Frequently, you’ll have an image that’s good, but not the right color. For example, you may want to change the color of a person’s clothing, or make part of a logo fit the color scheme of the rest of your site. Gimp makes performing this effect quite easy:
1. Load your starting image into Gimp and make any other adaptations you wish to the original image.
2. Use the Fuzzy Select tool to select the part you want to modify.
You might need to use the Shift key to add several variants of the color to the selection.
3. Use the Copy command (Ctrl+C) to copy the section of the image you just selected.
4. Use the Paste command (Ctrl+V) to paste the selected area into a new layer.
The pasted area goes into a new “pseudo-layer” by default. In the Layers panel you’ll see a layer called Floating Selection – Pasted Layer. Click the New Layer button and you’ll create a new layer containing only the section you need.
5. Colorize the new layer by applying the Colorize