Posted on September 27, 2008 - by Matthew Heidenreich

Header for Blog Layout

Introduction…

In this tutorial you will learn how to create a simple header that can be used for a personal blog. If you have any questions about this tutorial be sure to ask in the comments and i’ll be happy to answer any questions. Also, remember with all the tutorials, the psd is available for download.

Download the PSD…

Don’t have time to do the tutorial, but would like to see the results? The PSD is available to anybody who would like to use it.

Lets get started…

1. First we need to create a new document in Photoshop. We want it to be 1000×205.

2. We want to go ahead and get rid of that dull white background, so right click your background layer and choose blending options and input the following:

3. Next, while using your Marquee Tool, make a selection similar to the following and fill it with a solid color:

4. On this newly created layer, input the following blending options:

5. Your document should look something like this:

6. Next we want to go ahead and use our marquee tool again to create a selection similar to the following, and fill it with #FFFFFF

7. Now, on that layer, input the following blending options

8. Now, CTRL+CLICK that layer and it will make a selection of the layer. On a new layer, fill the selection with #FFFFFF. We only want the top half of this layer, so using your marquee tool select the bottom half and choose EDIT>CLEAR. It will look something like this

9. Now lower the opacity of the layer to 68%, and set the layer style to Soft Light.

10. The next thing we want to do is add our text that will represent our links. The font I used is Reznor.

11. We want to show what an active link will look like. To do so, use your rounded rectangle tool with a radius of 5px and a foreground of #000000.

12. lower the opacity to 30%, and it will look like this:

13. Next, you just need to add a logo, and you can add some ad spaces, and you’ll have something that looks like this:

**If you have any problems, or have any questions about this tutorial, please leave your comments and I will get back to you. Also, remember the PSD to this tutorial is available for download.

If you enjoyed this tutorial, why not check out our other Adobe Photoshop Tutorials?