How to make your own Layout using only Photoshop ^^,

Screenshot:


Hi! I made this tutorial for those who want to make their own web layout. This is so simple. All you need are:
1.Adobe Photoshop
2.Images from the net
3.Net connection
4.Time and patience

Here,
i used two sets of brushes only. We will use the basic photoshop tools:
Slice, Brush, Paint Bucket, Move, Text, and the Rectangle tools.

I
didnt make a sample tutorial (because i dont want anyone to copy-paste
it without my permission /lol). Please DONT RIP! Anyone posting this to
other sites will...die../pis

Lets start!

1. Create a new document.
Follow:
File > New > input the width and height. We will create a layout
so the width must be wide enough. You can use other size (the size here
is quite big though).


2. Painting the Background.
Follow: Click the Paint Bucket tool . Then click the Set foreground color and choose black. Click on the work area to color it black.

3. Creating box/border.
Follow: Click the Rectangle tool . See the properties above, there should be no style. And beside it, pick a color you want. (see image)

Create a box in the middle. (see image)


4. Creating a new layer
In
the Layers window, click Create a New Layer (see image). You can create
as many layers as you want depending on the style of layout you want,
whether the brush be in front of the box, or behind it. Just drag the
layer up or down.


5. Brushing up!
Here's my favorite part, brushing!
Click the Brush tool . Choose a set of brush. You can download brushes in DeviantArt or click this for Brush and Font Links
Now we will have something like this (see image). I added a new layer for the other brush to look a bit outside.


6. Adding Navigation
Click
again the Rectangle tool and create your navigation boxes. Duplicate
the layer so it would all have the same sizes. You can free transform
it by CTRL T so it may look like no in place eheh! Use the Move tool to
move it. You can also put your pic there or anything you want to put ^^,

7. Adding Text
Click the Text tool and type in the About Me, My Photos, Credits, Chatbox, Music, Home, etc...

8. Add some images from the net. (the metal thing) And you'll get something like this. (see image)


8. Slicing
Now here comes slicing the images so it can be used in web.
Click the Slice tool
and slice the About me, My Photos, Credits, etc.. (those that you want
to have a link on it). And we will have something like this (see image)


9. Adding link
Now click the Slice Select tool
(its just behind the Slice tool, right click it to see). For example,
double click the PxDesign. A Slice Option will appear (see image). Type
in the URL where you want to link it.
the URL i placed here is directed to PxDesignz site.
http://www.pxdesignz.net/forum.htm
...and do the same thing on the others.


10. Saving
Now,
were done in making and slicing the layout. Click File > Save for
Web and Devices. A new window will appear. Just click Save. Be sure to
save the right format : HTML and Images (see image)


11.
Open up the folder where you saved it, and the file will look something
like this. ( I used Firefox thats why ehhe) see image

Double click it and it will open up your own made website! ^___^


Original post: Krzteli
DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP DONT RIP

ahhmm ndi naintindihan hehehe...

hehe you should have Adobe Photoshop first for you to understand ^^,

Thanks :]