Pular para o conteúdo

Como fazer um gif para seu blog – parte II

Vamos continuar a fazer o gif que iniciamos na primeira parte desse artigo. Nessa segunda parte vamos manipular as imagens criadas no Corel no Photoshop, ou melhor, no Image Ready, que vem junto com o Photoshop. Se ainda não possui os programas, faça o download das versões trial nos links que deixei na primeira parte.

Abra o Image Ready e clique em File – Import – Folder as Frame e selecione a pasta onde salvou as figuras feitas no Corel Draw. Selecione a pasta inteira, não as figuras individuais e clique em ok. Você verá, como na imagem abaixo, que todas as imagens são importadas para o Image Ready.

Gif no Image Ready
Clique na imagem para ampliar

Agora vamos configurar o tempo de cada frame (imagem) no momento em que o gif for visualizado. Na parte inferior esquerda do Image Ready você pode ver a caixa Animation, onde aparece todas as imagens e embaixo um O sec (significa 0 segundos), clique no símbolo de play e veja como ficaria nessa configuração.

Configurando o tempo de execução

Para o nosso exemplo clique na seta ao lado de 0 sec e coloque 2 segundos nas imagens 150×1501, 150x1502x 150×1503. Se quiser adiantar e selecionar as três imagens de uma vez basta pressionar a tecla Ctrl e clicar com o mouse nelas, depois solte a tecla Ctrl e clique com o mouse em uma das setas e o valor inserido será válido para as três imagens. Para as imagens 150×1504 e 150×1505 coloque 1 segundo. Acione o play para ver como ficou. Agora vamos salvar nossa gif. Clique em Saved Optimized As… escolha uma pasta onde salvar o gif e dê o nome que quiser, no meu caso ficou banner. Pronto, pode fechar o Image Ready, se quiser pode salvar o projeto para alterar mais tarde, como salvaria qualquer outro arquivo de seu computador.

Ganhar dinheiro com blog

Publicando seu gif

Bom, agora que o gif está pronto, é necessário publicá-lo no blog, assim como fiz com esse na lateral direita do blog. Você precisará colocar seu gif na web (hospedagem própria ou em algum site gratuito como o Photobucket, se você utiliza o Firefox eu recomendo esse plugin para facilitar a tarefa) e de um código html para que ele possa ser “chamado” por seu blog e aparecer para os leitores.Faça o upload de seu banner para sua hospedagem (gratuita ou própria) e vamos ao código html.

<a href=”http://feeds.feedburner.com/bloggustavo” target=”_blank”><img src=”http://comoinstalar.com.br/banner/banner.gif”/></a>

Repare que o código abaixo não tem essa quebra de linha inserida aqui. Na primeira parte do código, logo depois do <a hef você deve inserir o endereço que deseja que abra quando clicarem no gif e na segunda parte, após o src você colocará o endereço em que está salvo sua gif. Esse código faz aparecer o gif que fizemos nesse tutorial.

Agora vamos colocar o código html no seu blog. Se você utiliza o Blogger, abra o painel de controle, clique em Layout, Elementos da página e em adicionar um gadget, escolha html/javascript, cole o código e clique em salvar. Visualize o blog e veja como ficou. Se você utiliza o WordPress acesse o painel de controle, clique em Design, widgets, escolha text e em edit no widget criado, cole o código e clique em change. Entre no blog e veja como ficou.

Conclusão

meu objetivo nesses dois artigos foi demonstrar que fazer um gif simples é “simples”. Agora um pouco mais de dedicação e buscas no Google e você pode fazer gifs maravilhosos e divulgar seu blog e ou promoções sem a necessidade da ajuda de outras pessoas. Como prometi, segue alguns programas gratuitos que podem substituir os programas pagos vistos aqui.

Photoshop

Corel Draw

  • Sodipodi

Lembrando que coloquei na primeiro artigo o link para o download das versões trial, funcionais por 15 e 30 dias dos programas Corel Draw e Photoshop, inclusive estou utilizando a versão trial do Photoshop, já que possuo apenas o Corel Draw original.

Marcações:

0 comentário em “Como fazer um gif para seu blog – parte II”

Deixe uma resposta

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.

Aguarde um momento…

0