Design a web 2.0 website header in Gimp

Designing websites is easy in Gimp, but in this tutorial I am going to show you how to create a web 2.0 style website header that will end up like this:

Click for full size image

1. Open Gimp and create a new canvas with a width of 860px and a height of 140px
2. Go to the main Gimp window and change the foreground and background colors from the color chooser to foreground: 55bded and background: 4f636d
3. Now go back to the canvas and press Ctrl + . which will fill the background with the darker blue
4. Press L or select the Gradient tool from the toolbox and drag from the top to the bottom of the canvas, so that you get this:
   
5. Then go to the Layers window by pressing Ctrl + L
6. Create a new layer by clicking the first button on the left of the bottom
7. Name the new layer “top”
8. Now go back to the canvas making sure that the layer you just created is selected
9. Press E or click the elliptical option on the toolbox
10. Drag an oval shape on the top half of the layer
    
11. Now go to the main Gimp window and change the foreground color to white (FFFFFF)
12. Go back to the canvas window and press Ctrl + ,
13. Now go to the layers window and change the opacity of the layer to 30.0
    
14. Now to add a title to the banner, press T or select the Text tool from the toolbox
15. You can change the text properties (font family, size, color etc.) in the tool options on the bottom half of the main Gimp window
16. I have also added a drop shadow to the text by selecting Drop shadow from the Script-Fu –> Shadows menu, and set both offsets to 0 and the blur radius to 15
17. If you have followed this tutorial properly then you should finish up with this:
    
    Click for full size image

Simon North