Crie um template como a de um webdesigner

01 O primeiro passo para desenvolver a criação de um layout web com o Photoshop é definir o tamanho da tela de trabalho.
Portanto, selecione a opção File no menu superior. Depois disso, determine o valor de 1460 pixels para Width e 1588 pixels para Height. Por se tratar de uma página para web, a resolução deve ser de 72 dpi e o modo de cor em RGB.
 

02 Utilize as linhas-guia para formar a estrutura básica do site, ou seja, defina a posição exata da imagem do topo, do menu lateral e da área de conteúdo. Em seguida, com a ferramenta Gradient Tool, selecione as cores que desejar e pinte o background.

03 Agora, abra a imagem lights e arraste-a para seu arquivo de trabalho. Esta será a primeira imagem para o topo do site.

04 As linhasguia são importantes para o alinhamento do layout, porém, algumas vezes podem atrapalhar na visualização do trabalho. Por isso, clique em View, Show e Guides para deixá-las escondidas enquanto você desenvolve o layout.

05 Um efeito muito importante que será usado durante todo o tutorial é a transparência. Selecione a opção Add Vector mask na janela de Layers.