Creating A Basic Web Layout In Photoshop

Below i will show you how to create a professional Looking website , i reccomend only intermediate + users attempt this!

Make sure your foreground color is : #FCF8F8

Step 1. Create a new document with background color white , 780 x 600 pixels

Step 2. Then Select the Marque Tool And Create A Top Section Like this Below: ( I have cut this image a bit to fit on this page , make sure it goes all away accross!

Step 3. Create This as a new layer and name it top, then right click on the slected area and go to fill , and then click ok!

Step 4. Then go to layer > later style > stroke , and set it to 1px , black sroke!

By now you should have something looking like this >

Step 5 . Now go to Layer > Layer Style > Gradient Overlay , And use these following settings! ( click on the picture to view properly!! )

Step 6 . Then Add Your text!

Step 7 . Select the Maraque Tool and now create a left navigation area down the side

Do the same Again as before , Create new layer this time calling it Left Nav , then right click and fill , and then create a 1px black stroke! you can also insert a drop shadow and inner shadow effect to it!

thats were all your content will Go!

Step 8. now create a bottom footer for your site , by selecting the marque tool again , arrange the layer to the front , and also fill the layer to its foreground color , and also make a black 1px stroke!

Step 9 . Then simply go to layer > layer style > gradient overlay , and use these settings below: ( Click image for larger view! )

Then you are done! Your layout should now look something like this! > Below

Click to enlarge