http://xtutorials.net

In this tutorial you will learn how to make a professional hosting layout using Photoshop.

Now we ad a rectangular the same size as the document. This will actually be the background. The colors should be something dark. I used #252525.

Now we create the main menu. Make a white small rectangle on the stage. Size about 40x155. Now ad two anchor points just like in the image below.

Now move the two bottom anchor points outside until you have something similar to this:

Now ad this gradient to it:

Also ad a white inner glow to it:

Make about five copies of it and put them in line just like in the image below:

Now just ad the text: Size 14, color White.

Now create an almost white (#efefef) rectangle about 940x200 and place it under the buttons. Also make sure covers the bottom part of the buttons so that you can't see the white inner glow there. Also ad a 1pixel black stroke to it.

Now create a new layer and make a selection that has the same hight as the big white rectangle but only 1px width. Now select the Gradient Tool. Set the gradient from black to transparent and set it as Diamond Gradient. Now drag the gradient in the selection from the middle, to the top. Now you should have something like this
This will actually be the separator between contents. Now we ad some text and use the separator we created earlier between the content.

Now create another rectangle with the following dimensions: 570x230. Also ad a 1px black stroke to it. Now we search for a nice stock photo with some servers. I used the one from this link.

Place it in the rectangle you just created. Scale it proportional so it has the same hight as the rectangle.

Now ad a layer mask to it. Now ad a linear gradient form black to transparent to it from the right to the middle of the image. Something like this:

Make sure you have the layer with the servers selected and press CTRL+U. Click on Colorize and drag the sliders until you have a nice orange color. Something like this:

Now just ad some text next to it. Also make a Read More button. To do this make a rectangle that is the size you want your button to be. Don't make it to big. Ad the same gradient from the buttons at the top, but don't ad the inner glow. Over it type "Read More" and use a nice orange color. Put it at the right of the button.

To the left ad a smaller and lighter rectangle and over it place an arrow. Your result should be something like this:

To the left ad three rectangles just like in the image below:

Ad some text and also the Read More button:

Now ad three smaller rectangle just like this:

Ad a white 1px stroke to them. Now from top to bottom ad the following gradients:

The result:

Now just ad the prices:

Now it's time for the footer of the page. Create a rectangle that is 940x36. Ad this gradient to it:

Also ad the same white inner glow to it.

Using the same technique create a new separator for this rectangle, but this time from white to transparent. Now ad some links and put the separator between them:

Now at the top just ad the company name and slogan and the layout is complete. Final result below:

Hope you have enjoyed this tutorials. If you liked it please don't forget to leave a small donation to cover up hosting bills.