De um modo geral, o trabalho concluído pelo web design é realmente: converta as renderizações do PSD em páginas de modelo HTML+CSS. Geralmente, obteremos o PSD do artista, e pessoas diferentes terão abordagens diferentes:
1. Fogos de artifício aberto e exporte a imagem para HTML.
2. Use diretamente ferramentas como o Dreamweaver para arrastar e colocar o layout, importar imagens relevantes e recursos flash.
3. Depois de concluir o corte no PS, primeiro olhe as renderizações no editor de texto e faça com que elas sejam passo a passo.
Os acima são os métodos mais usados, mas nenhum deles é bom:
O primeiro método é o pior, esse código não é mantido ou legível.
O segundo método também não é bom, o código será inevitavelmente redundante e as coisas que você faz precisa ser verificado.
O terceiro método também não é bom, porque você precisa olhar para as renderizações pouco a pouco, ou seja, ao escrever a tag HTML, você está constantemente assumindo como exibir esta peça.
Maneira correta de fazer isso:
1. Depois de obter o PSD, não faça mais nada mais. Escreva a estrutura da página da web diretamente no editor de texto. Não assuma como renderizar esse CSS no futuro. É uma etiqueta completamente naturalizada sem adicionar nenhum CSS.
2. Depois de escrever, verifique se não há problema com o posicionamento geral após a execução de cada navegador.
3. Escreva o CSS geral, aqui o CSS é responsável apenas pelo posicionamento e estilo dos grandes blocos.
4. Corte os recursos de imagem necessários, construa -os pouco a pouco na estrutura escrita, depra -os constantemente e finalmente se torne o produto final.
5. Finalmente, adicione comentários ao seu próprio código e adicione comentários ao seu próprio código adequadamente no CSS e no HTML.
Ainda há muitas coisas para prestar atenção se queremos fazer uma mudança flexível para fazer a pele e deixar o CSS dominar o desempenho, mas o processo geral é assim. Obviamente, não podemos escrever HTML diretamente no início, mas pelo menos devemos ter essa consciência e prosseguir passo a passo. . .
PSD Arquivo Corte sites de dois pontos principais:
1. Uma página independente
1. Analise esta página e primeiro descreva a estrutura geral em sua cabeça ou no rascunho.
2. De acordo com a situação do rascunho do projeto, analise a distribuição de imagens de fundo, a distribuição de imagens da OIC etc.
3. Corte as figuras correspondentes, exporte e mescla imagens
4. Escreva a estrutura geral XHTML Código no editor, incluindo a estrutura de todos os elementos que aparecem na página
5. Escreva o código geral e do módulo no estilo CSS
6. Ajuste detalhado
7. Após o trabalho, o navegador verificará se está correto
2. Local pequeno ou grande composto por várias páginas
1. Navegue a todos os rascunhos de design e unifique a distribuição de módulos, imagens e arquivos do site
2. Inicie o primeiro ponto de operação, mas é importante planejar a distribuição de conteúdo do site.
Consideração geral:
1. Merção de imagens para reduzir o número de solicitações
2. Racionalidade estrutural e semantização
3. A simplicidade do estilo facilita a manutenção posterior
4. Considere principalmente a manutenção posterior e o desenvolvimento do programa, como simplesmente alcançar o efeito.