Let's start with a new document, with the following size: 960 x 900 pixels. The size is not important but I suggest you to use this size, because the website will fit in almost any monitor.
With Paint Bucket
Tool add the following color on the background layer: #3f3f3f
Then go to Filter > Noise > Add noise and use the following values
Now it is time to download one of our Premium download: Pixel patterns
Load the patterns into Photoshop. To load the patterns you have to select Paint Bucket Tool, and from the top of the screen select Pattern
Click on the small arrow, and then go to Load Patterns. Browse the patterns on your computer.
On this layout I will create a selection with Rectangular Marquee Tool
I will create a new layer, (press CTRL+SHIFT+ALT+N), and with Paint Bucket Tool I will click one time inside my selection. Be sure you select a nice pattern from this set of Photoshop patterns
I will press after that on CTRL+E to deselect. The same think I will make on the footer, where I will create a shape like the previous one
With Horizontal Type Tool, I will write some minus signs
I will select Rounded Rectangle Tool, and I will create 2 shapes. In the following image you will see 2 different colors. I will change the colors, because it will be easier for you to see where I will place the shape
I will change the color of the red shape back to #1c1c1c, then I will select both layers in my layer palette, and I will press on CTRL+E to merge the layers into a single one
Now I will add a layer style for this shape
This is my result so far
I will create a new layer (press CTRL+SHIFT+ALT+N) above the background layer, and with Brush Tool I will create 4 points. I will hide for a moment the previous shape
I will create a selection with Rectangular Marquee Tool, and I will hit delete on my keyboard. Then I change the blending mode for this layer to overlay
I will unhide the big black shape, and I will show you how this layout looks so far
I will place an image from my stock image collection, and on the header and in the footer; I will create 2 white shapes
For the White shapes I will add the following layer style
This is the result
And for this layer I will change the blending mode to Overlay
I will write one more time some minus signs
The same think I will made also in the footer of this layout. I will add in the same time some text
With Horizontal Type Tool I will add some text. Click on the following image to see the full size pattern layout
On the top of the layout I will add another shape
I will add the same layer styles as we added to the big shape
Then with Horizontal Type Tool I will write Grafpedia
For the text layer I will add the following layer styles. I will use another pixel pattern from our set if 200 professionally designed patterns
This is my result
On the left side I will create a vertical line with Pencil Tool (set the brush size to 1 pixel)
I will select Eraser Tool, and with a smooth round brush I will delete the extremities of this line
Be sure you have this layer selected, and then press on CTRL+J (to
duplicate the layer)
Then go to Filter > Blur > Gaussian blur and use the following
settings
Duplicate this layer 2 or 3 times. This is my result
I will make the same blurry line also on the other side of the layout
With the same technique I will add also a line under the logo. This time when you create the line please use a light blue color
Create a new layer above all layers, and then with Brush Tool, add a simple dot over the logo
Then change the blending mode to Soft Light. And I think this is the final result. I hope you like it and you realize how important are good Photoshop Patterns
