In this tutorial we are going to learn how to create a simple web layout. There are 2 major sections, layout design and HTML,CSS scripting.

We will need few tools to help us to do our job, in this case I am using Photoshop CS3 and  Notepad++ as text editor.

As for now, lets try to design a simple layout web using Photoshop…

• Create a new Photoshop document, width: 1000px and height: 1200px, then fill the background with #858264 color
• Put some additional  guides approximately 770px (don’t forget the outer lines for the shadow). View > Rulers (Ctrl + R). Click anywhere on the ruler and drag it down or to the left and release. There’s also a toggle to show/hide the guide. View > Show > Guides

  Read the rest of this entry »