Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos.  Home Photoshop Web Layout Create Header for Designer Website

Create Header for Designer Website


Step 1:

Let's start out by creating a new file. I used a 1000x300 pixels canvas set at 72dpi, and I filled my background with #FFF2B4 color shade. Now create a new layer then draw a large rectangle with #2E2E2E color shade and 900 x 150 px dimensions.

image 1

Step 2:

Under Layer Style(Layer > Layer Style) add a Pattern Overlay blending option to the large gray rectangle layer.

image 2

image 3

Step 3:

In a new layer draw a large light brown rectangle with #FFEDC1 color shade and 900 x 150 px dimensions.

image 4

Step 4:

Under Layer Style(Layer > Layer Style) add an Inner Glow and Pattern Overlay blending options to the light brown rectangle layer.

image 5

image 6

image 7

Step 5:

Grab the Eraser Tool with a large soft brush and erase the bottom half of the light brown rectangle design layer.

image 8

Step 6:

In a new layer draw a long white rectangle with 900 x 31 px dimensions between the large gray and light brown rectangle designs. Then under Layer Style(Layer > Layer Style) add a Drop Shadow and Inner Shadow blending options.

image 9

image 10

image 11

Step 7:

Select the Horizontal Type Tool then set the font family to Arial, regular, 14 pt, none and #007B17 color shade. In a new text layer type out your navigation links with spaces, use #F7CFA3 color shade for the bar spacer between each link.

image 12

Step 8:

On the right end of the dark gray rectangle leave a space for a search box, grab the file here.

image 13

Step 9:

Now add a simple mouse door on the white rectangle, do this by creating a black ellipse in a new layer then cut out the bottom half of the ellipse.

image 14

Step 10:

On the left side of the header add your logo or use the painting plate design on this tutorial, grab the here.

image 15

Step 11:

Select the Horizontal Type Tool then set the font family to Arial, bold italic, 24 pt, and smooth. In a new text layer type your website name next to the logo, use different color for each word on your name.

image 16

Step 12:

Under Layer Style(Layer > Layer Style) add a Stroke blending option to your website name text layer.

image 17

image 18

Create Header for Designer Website



Author's URL: PsDeluxe
Final results of our readers
New!
Passed through all the steps? Share your result!
Your result will be premoderated.
Please make sure you choose the right image.
 
 



Captcha

*Required fileds
Grasp the chance to enhance your site with the best fitting layout, including elements like buttons, headers and logos. More Web Layout Tutorials: Featured Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

No comments yet...
Add comments to "Create Header for Designer Website"

Captcha