Web designers são usados para projetar suas maquetes em Photoshop. Quando você precisa converter seu mockup para um site ao vivo, algumas habilidades HMTL e CSS será útil. Se você precisa exportar o seu mockup em seu software de desenvolvimento ou plataforma , como o Dreamweaver Joomla , você pode fazer a conversão em poucos passos . Coisas que você precisa
Photoshop
Dreamweaver
Mostrar Mais instruções
1
Clique duas vezes em sua maquete Photoshop. Clique em " Arquivo" e "Salvar para Web e Dispositivos " para exportá-lo para um formato Web amigável. Selecione um formato de arquivo, como JPEG ou PNG . Definir uma qualidade de imagem na caixa de diálogo próximo . Clique em " Salvar". Digite um nome para a sua imagem.
2
Cortar e separar o conceito de fundo, sombra e efeito de borda transparente , rodapé e barra lateral conceitos. Guarde-os em um diretório local . A maioria deles são de layout relevante.
3
Ir para Dreamweaver. Clique em "Arquivo " e " Novo arquivo HTML. " Um novo arquivo HTML será configurado com os principais quadros , como cabeçalho e secção do corpo . Digite um nome para o arquivo.
4
Crie um arquivo CSS para o site clicando no botão " Estilos CSS " no canto superior direito do Dreamweaver. Botão direito do mouse na área em branco para criar novas regras CSS . Escolha " Tag ( redefine um elemento HTML) " a partir do Seletor de tipo . Escolha " corpo " e " Folha de Arquivo New Style ". Clique em " OK" para começar a definir arquivo CSS
5
Importe sua imagem de fundo e outros elementos conceituais em seu código CSS: background: url ( /images /background.jpg ); rodapé: . URL ( /images /footer.jpg ); .
