CRIAÇÃO DE NEWSLETTER – PARTE 3

 

Olá galera, tudo bem com vocês?!

 

Neste tutorial vou dar seqüência ao tema “Criação de Newsletter” pelo Fireworks. Uma amiga internauta enviou-me um e-mail com dúvidas referentes aos processos posteriores a criação da newsletter pelo Fireworks. Como creio que a dúvida seja geral, resolvi escrever este tutorial explicando o processo da criação da página HTML para a newsletter.

 

Este tutorial será dividido em duas partes para que sejam bem detalhados e explicados todos os processos até a obtenção do resultado final.

 

Ao final teremos um resultado semelhante ao seguinte:

 

Figura 01: exemplo final.

 

Chega de papo. Vamos à prática!

 

1) Abra, através do menu File, Open... o arquivo com extensão .PNG que você criou seguindo as partes 1 e 2 desta série (Criação de Newsletter).

 

Figura 02: menu abrir.

 

Figura 03: newsletter criada no Fireworks.

 

2) Com o arquivo aberto, nossa primeira tarefa é dividirmos o layout em fatias. O motivo de se fatiar a newsletter é devido à facilidade que teremos para estruturá-la lá no Macromedia Dreamweaver. Selecione a ferramenta Slice tool.

 

Figura 04: ferramenta slice tool.

 

3) Com a ferramenta Slice tool selecionada, selecione o topo da newsletter. Para selecionar basta clicar com o ponteiro do mouse no ponto inicial desejado e arrastar até o ponto final desejado. É como se estivesse desenhando um retângulo. Veja:

 

Figura 05: fatiando o topo da newsletter.

 

4) Ainda com a ferramenta Slice tool selecionada, repita o mesmo procedimento e crie as fatias para as demais regiões da newsletter. Abaixo listo as etapas uma a uma:

 

Figura 06: criação da segunda fatia.

 

Figura 07: criação da terceira fatia.

 

Figura 08: criação da quarta fatia.

 

5) Prontinho. Nossa newsletter foi devidamente fatiada. Selecione todas as quatro fatias criadas (usando a tecla Shift) e na propriedade Slice export settings escolha a opção JPEG – Better Quality.

 

Figura 09: configuração para exportação.

 

Os próximos passos são exportar as fatias e estruturá-las lá no Macromedia Dreamweaver. Mas estes são assuntos para o próximo tutorial.

 

Estou à disposição de todos! Envie suas críticas e/ou sugestões para o e-mail webdesigner.pro@pop.com.br. Terei todo prazer em atendê-lo.

 

Pessoal, trago uma boa notícia a todos os que acompanham a série de tutoriais da série Fireworks aqui no site do Júlio Battisti. Já está à venda o curso de Fireworks Básico – Passo a Passo, de minha autoria. É uma maneira fácil e didática de se aprender esta maravilhosa ferramenta de design. São inúmeros exemplos práticos que irão te levar a um mundo totalmente real em se tratando de design em geral. Clique aqui para saber mais sobre este curso.

 

Galera, participem do Fórum de Fireworks no site https://juliobattisti.com.br/ e troque conhecimentos com diversas pessoas. Acesse já!

 

Chegamos ao final de mais um tutorial da série Fireworks. Caso tenha dúvida(s), entre em contato comigo através do e-mail webdesigner.pro@pop.com.br

 

Para desenvolvimento de Sites, Layout, Apresentações, Flyes, Banners, Identidade Visual, Diagramação, Vetorização e Serviços Gráficos em geral, envie e-mail para: webdesigner.pro@pop.com.br e solicite seu orçamento. Profissionalismo sempre!

 

Até a próxima!

 

Um cordial abraço a todos,

 

Fábio Almeida