10 dicas para criar um banner funcional
-
Upload
thiago-khoury -
Category
Design
-
view
21.578 -
download
6
description
Transcript of 10 dicas para criar um banner funcional
![Page 1: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/1.jpg)
10 dicas para criar umbanner funcional
![Page 2: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/2.jpg)
1. Escolha as cores certas
Utilize um fundo neutro, com cores lisas, ou um efeito discreto, como o dégradé.
![Page 3: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/3.jpg)
Fundo vermelho com foco de luz ao centro (ou “dégradé radial”).
![Page 4: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/4.jpg)
Você tem apenas segundos para conseguir a atenção do seu cliente
2. Simplifique
![Page 5: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/5.jpg)
Banner não é carta e possui as mesmas regras de visibilidade de um outdoor: seja sucinto, sempre.
![Page 6: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/6.jpg)
3. Dê preferência para cor e fonte
A internet possui pequenos espaços publicitários que recebem arquivos “em baixa”, ou “qualidade para web”.
Dê preferência para um texto curto sobre uma cor em destaque ao invés de uma imagem que irá perder 95% de sua qualidade em um banner.
Ninguém espera o carregamento de anúncios, por isso eles devem ser mais leves do que o site.
![Page 7: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/7.jpg)
Sem utilizar fotos de celebridades para divulgar um site de entretenimento, o Yahoo! preferiu usar uma imagem gráfica em diferentes tons de roxo. Já a GOL
permanece atenta ao essencial: o preço. Todo o resto é desnecessário, inclusive imagens representativas das cidades anunciadas.
![Page 8: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/8.jpg)
NÃO utilize imagens que ocupem todo o espaço do banner: imagemnão é fundo de tela centralizado ou lado a lado. Imagem éapenas um detalhe: espaço em branco é uma dádiva, você nãoprecisa preenchê-lo.
![Page 9: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/9.jpg)
![Page 10: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/10.jpg)
4. Escolha imagens de uma mesma familia
Uma Paris ensolarada ao lado de uma Londres nublada vira uma poluição visual sem fim!
![Page 11: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/11.jpg)
Sevocê não abre mão de usar imagens de ilhas paradisíacas ou capitaiseuropeias para anunciar sua agência de viagens, escolha imagensque possuam a mesma iluminação e efeito; enfim, fotos quepareçam terem sido tiradas no mesmo dia e pelo mesmo fotógrafo.
![Page 12: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/12.jpg)
Ah, dica: não existe nada mais antiquado e que funcione menos do que transformar banner em rolo de filme fotográfico e preencher cada espaço com uma imagem diferente.
![Page 13: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/13.jpg)
5. Cuidado com o .gif
Use um banner animado que possua mais de uma imagem em rotação, mas não faça mais doque quatro transições e lembre-se que nem tudo precisa desaparecer: apenas o letreiro deveficar em movimento.
![Page 14: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/14.jpg)
6. Cuidado com as fontes
Qualquer texto com mais de três palavras não deve aparecer com grafia cursiva - alerta“brega” nível cinco em uma escala de um a três.
Descubra se a leitura do seu texto fica mais agradável com o uso de fontes serifadas -serifas são suportes que aparecem nas extremidades das letras.
Textos pequenos possuem destaque natural: negrito e itálico são usados apenas emtextos longos.
Lembre-se: você não deve usar mais do que 10 palavras para passar a sua mensagem.
![Page 15: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/15.jpg)
Com serifaSem serifa
![Page 16: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/16.jpg)
7. Troque o banner periodicamente
Nada de deixar o mesmo banner durante seis meses em um site; caso contrário ele passa a fazer parte do layout e já não será mais notado.
![Page 17: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/17.jpg)
8. Use as palavras certas
Quando usadas da forma correta, algumas palavras podem fazer milagres.
Foi comprovado que um discreto “clique aqui” e outros verbos no imperativo surtem efeito rápido.
“Corra, está acabando”, “só hoje” e “últimas passagens” também podem ser interessantes.
![Page 18: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/18.jpg)
![Page 19: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/19.jpg)
9. Faça banners harmônicos
Se você deseja exclusividade ao anunciar em um site ou pretende comprar todos osespaços que ele oferece, procure fazer anúncios harmônicos.
Com dois, três ou mais tamanhos diferentes disponíveis, siga uma mesma linha decriação e faça transações simultâneas para que o internauta não fique tonto.
![Page 20: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/20.jpg)
10. Nao tente enganar o seu cliente~
Criar um banner dizendo que o sujeito é a milésima pessoa a ver aquele anúncio epor isso será recompensado ou simular uma janela de Windows (“você tem umamensagem não lida”) é a maneira mais fácil de se tornar o menos clicado.
![Page 21: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/21.jpg)
Acesse e faça o seu proprio banner
http://www.mybannermaker.com/Monte seu banner em vários formatos previamente disponíveis
http://pixlr.com/Editor online de imagens
http://www.blog.spoongraphics.co.uk/articles/50-illustrator-tutorials-every-designer-should-see50 tutoriais de Illustrator para criar efeitos profissionais (em inglês)
![Page 22: 10 dicas para criar um banner funcional](https://reader034.fdocumentos.com/reader034/viewer/2022051015/5564b286d8b42a98268b4fd4/html5/thumbnails/22.jpg)
Agora é com você!
Diviagem.links para quem viaja
diviagem.com.br@diviagem | facebook.com/diviagem