Criar seu próprio site sempre começa com o desenvolvimento de um esboço e design futuro, e uma parte integrante desse desenvolvimento é a visualização do design do site no Photoshop e o corte do design finalizado em blocos para layout subsequente. A capacidade de cortar corretamente uma imagem do design do site afeta diretamente o sucesso do layout e o posicionamento correto dos arquivos gráficos no servidor.
Instruções
Passo 1
Abra o layout de design criado no Photoshop, que é uma imagem sólida com a resolução desejada. Na barra de ferramentas do Photoshop, selecione a ferramenta Fatia. Desative temporariamente a visibilidade de todas as camadas de texto, campos de entrada, ícones e elementos semelhantes.
Passo 2
Desenhe com a ferramenta escolhida as linhas-guia ao longo das quais você cortará o terreno - essas linhas na imagem serão verdes. Divida o layout de uma peça cuidadosamente em elementos estruturais do tamanho e quantidade desejados.
etapa 3
Pense em como você cortará a imagem - não deve haver muitos elementos individuais nela. Para criar linhas-guia, coloque o cursor na régua superior sobre a imagem, clique com o botão esquerdo e arraste a guia para baixo. Solte o botão do mouse.
Passo 4
Depois que todas as guias forem definidas (verticais e horizontais), prossiga para o corte do layout.
Etapa 5
Usando a ferramenta de corte selecionada acima, corte o layout clicando com o botão esquerdo do mouse no início de cada linha-guia e esticando o campo exibido para o tamanho do objeto desejado que você deseja cortar. Solte o botão esquerdo do mouse para que um número de série apareça no canto esquerdo do fragmento cortado.
Etapa 6
Ajuste as bordas dos fragmentos esticando-os manualmente. Para salvar as partes fatiadas da imagem geral, clique na opção "Salvar para páginas da Web" no menu Arquivo e selecione o formato JPEG. Na janela de salvamento, selecione "Todos os fragmentos".
Etapa 7
Depois de salvar os fragmentos da imagem recortada separadamente, salve todos os elementos visuais do design da página - blocos de texto, botões, linhas e assim por diante.
