Como criar um site no Illustrator

Adobe Illustrator é um programa de design que cria gráficos vetoriais para uma grande variedade de usos, incluindo impressão, movimento e web. Os gráficos vetoriais utilizam fórmulas matemáticas para apresentar imagens, ao contrário de outros formatos, como o GIF, que utilizam um conjunto de pontos. Embora não especificamente concebido como um programa de web design, o Illustrator possui ferramentas avançadas para exportar os gráficos criados no programa para uso no site e também gera o código necessário para exibição em um navegador. Coisas que você precisa
Web design software de edição
Ver mais instruções
criar uma apresentação
1

criar um documento Illustrator tem 960 pixels de largura com uma altura à sua escolha, dependendo do conteúdo e design que você tem em mente . Um site com 960 px de largura está em linha com a largura de resolução de tela mais popular de 1024 px, uma vez que a barra de rolagem e as bordas das janelas são levadas em conta.
2

Criar um esboço desenhado à mão do layout visual básico do seu site, se ainda não o fez. Isso lhe dará uma referência útil para criar no Illustrator .
3

Crie o seu layout usando ferramentas de imagem e texto para um cabeçalho estilizado. Se o seu design inclui espaço para textos como posts em blogs , deixe o espaço nesta área em branco ou crie uma borda ao redor do limite fácil. <4

Adicionar guias ao seu design para delinear as diferentes secções do layout. Isto é muito importante porque você vai usar estes guias para fazer fatias, que definem os limites dos elementos do seu site. Os guias podem ajudá-lo a alinhar objectos com precisão. Clique na régua vertical ou horizontal e arraste o mouse até onde você quer que o guia seja colocado.
5

Dupla verificação da colocação das suas guias para precisão e precisão. Desenhe mais se necessário para separar cada elemento , como imagens de navegação que serão links em seu site.
Geração de código
6

Seleccione "Objecto" no menu, depois seleccione "Fatia" e escolha "Criar Guias . "Quando as fatias são criadas, você verá pequenas caixas pretas dentro de cada fatia com um número correspondente. Selecione "Arquivo" no menu e escolha "Salvar para Web e Dispositivos". "Selecione a ferramenta Seleção da fatia, que é o segundo ícone no menu de ferramentas à direita da tela, na forma de uma mão. Selecione todas as fatias. <7

Selecione as opções de configuração de otimização no lado direito da tela. Você pode escolher configurações pré-definidas ou criar um perfil personalizado dependendo se você quer que suas imagens sejam JPEG, GIF ou PNG . Você também pode ajustar a qualidade das imagens .
8

Visão geral das diferentes configurações clicando nos separadores "2 -up" e "4 -up" . No canto inferior de cada pré-visualização, você pode visualizar informações de otimização, como tamanho do arquivo e tempo de renderização do navegador. Clique no botão "Guardar". Decida onde você quer que suas imagens e código sejam salvos e navegue até essa área usando o botão "Onde:"
9

Escolha o formato do seu trabalho. . Se você é proficiente em HTML e só quer as imagens porque você estará adicionando código para elas mais tarde, escolha "Apenas imagens". "Se você é um iniciante ou prefere ter o código HTML gerado para você, escolha a opção "HTML e imagens". Se preferir que o posicionamento dos elementos seja organizado com Folhas de estilo em cascata em vez de tabelas, seleccione o botão "Default Settings" e escolha "Export as CSS Layers" no separador "Layers" . >br>