All of us want to have a seperate website to showcase our creative works. By doing this tutorial you will get all the basic idea that are required to make your own website.Let me begin opening a new file .Have dimensions as 800 x 600 and 72 dpi (we want our website to load faster dont we :))

Now you would have opened a new file with the above dimensions (800x 600). What colors are we going to have? Well i’m going to use the gradiant effect to have a background created.. if you dont like this BG you can create your own background with a picture or other effects ..for now lets practices this one shall we

You should now be having a file similiar to the one you see below..the problem you might have faced is with the gradiant effect ,were you could have go the darker side below..no worriers reverse the way you apply the gradiant..dont worry if you dont have the colors similar to mine..after all its your own website aint it ;)..let move on

We are going to improve over normal gradiant effect to some thing cooler. I’m going to create this using the pattern overlay in the bleding options menu..you can use the same settings in the below image to create the effect..

Affter doing this on a new layer..create a grip layer (nothing but another new layer) and merge the pattern layer and the grip layer together (select the two layer and ctrl + E) . you can notice that the effects has vanished

You website should look like this..dont worry it will be made to look cooler trust me ..lets move on to the next step..

Now you have to change the layer mode to Soft light and have its opacity reduced to 55%.. you should have your result look like this …

This step i am going to create a simple logo using basic fonts ..i have used "wp iconic" font and the letter is H to create this shape that you see..i have add a black circle below it ..using marqee tool

I’m going to use Gradient tool again to create metallic effect for the logo..you can follow the settings in the below image.

After having applied the gradient effect ..click on the blending options menu and apply the same effect including the color to the black round and metallic wheel layers

Now on to the next option in blending modes > outerglow and apply the same settings..your logo should start looking like this ..Do you think this is cool..

This is a trick step.. we are now going to create ..the top UI for the website..there is no size restriction ..you can make it big small how ever you want it..this is how i made mine ..

Take the selection of the logos black circle and fill it using a black colour..the image below doesnot show the filling part but you need to do it..

This is a trick step.. we are now going to create ..the top UI for the website..there is no size restriction ..you can make it big small how ever you want it..this is how i made mine ..

Take the selection of the logos black circle and fill it using a black colour..the image below doesnot show the filling part but you need to do it..

you should have now created a circle black in color..move the selection toward your left hand side..till you see the shape that i have created and delete it ..you should have the same result as mine

In the same layer ..using the box marquee tool make a selection like a long rectangle and fill it black it should look like the one that i have created..now you are almost done with you top main menu

copy the effect hat you create for the log and paste it on you top menu shape..you should see something like you have below ..do you like it

This is a easy step ..all you have to do is to duplicate the layer (ctrl + J) and using transform tool (ctrl + T) flip it horizontally ..and move it to the other side of your logo .. the result should look like the image below.

Add the Name of youwebsite and a cool slogan..remeber to add the main menu link text too..you now done with the top navigation part of the website..

Create a shape similar top this one using pen tool

Apply Vivid light layer mode on this layer..you should get this effect

Copy the layer effect that you made for the logo and paste it onto this layer ..you should have something like this..

Any website design will require a lot of planning as to where you want to have what..Im going to have a dark area where im going to have text dummy onces that are going to welcome a veiwer to the website..

select the layer where you copyed the effect using a square marquee tool and paste it on a new layer change the layer mode to multiply vola !! you should have something similar to mine

Now add the text on to this remeber to have the font is sharp mode so the appear crisp and clear ..

This is the fun part..adding your images ..so that people know what is your recent work..you can have it in colour or toned or anyformate and size..im showing you a toned formate so that ot gels with the website colours

You can have as many thumbnail as you want i’m going to increase my works to the maximum

Now with the help of Pen tool create this ..

After creating it have it sized on the right hand side of you shape and reduce the opacity to 40% and layer mode to overlay..You should have an effect similar to this ..

Now im going to make the website look a lot cooler and funkier ..Thanks to www.sxc.hu. i got this stock image ..im going to use this image on my design

Cut the image and place it on the website design ..you may have to resize the image with the help of Transform tool (ctrl + T) ..and duplicate it 2 times (ctrl+D)..your image should look like this ..

I have used multiply layer effect for one of my image and created submenu with the help of custom shape tool (U)…THERE YOU GO..YOU VERY OWN PORTFOLIO SITE IS READY..