Como Criar um Banner no Photoshop

Como Criar um Banner no Photoshop

Neste tutorial sobre o PhotoShop você vai aprender Como Criar um Banner no Photoshop para divulgar páginas internas, programas de afiliados ou qualquer outra coisa na Internet.

Como Criar um Banner no Photoshop

Passo 1
Crie um novo documento no PhotoShop com tamanho 468px X 60px. Como é um banner para ser utilizado na web defina a resolução em 72 pixel/inch, que vem por padrão.

banner

Passo 2
Defina um fundo para o seu banner. Tente escolher um no padrão do seu site/blog. No meu caso, escolhi o fundo do topo do meu site, para ficar padrão. Como eu não usarei este banner no meu próprio site, não haverá problema. Também ficará mais fácil das pessoas lembrarem e associarem a identidade visual.

banner2

Passo 3
Adicionar o conteúdo do banner. Primordial colocar a logo de forma bem aparente.

banner3

Passo 4
Adicionar o texto/mensagem que o banner utilizará para atrair cliques. Aqui você pode usar o slogan ou uma frase de efeito. Lembre-se sempre de caprichar na fonte. Caprichar não é enfeitar muito, mas sim fazer algo bonito e compatível com a identidade visual do seu site/blog.

banner4

O meu ficou idêntico ao meu topo do meu site, mas não precisa ser, fiz só para mostrar como se faz. Use sua imaginação e veja o que será melhor para o seu site. Pense no objetivo do seu site, o que você quer transmitir para os visitantes. Que frase, slogan, etc., atrairia o público alvo do seu site/blog a clicar no banner.

Outro exemplo é o banner que o Celso disponibiliza aqui no Criar Sites para quem quiser divulgar o blog.

468-banner-criar-sites1

Repare que ele não usou o topo do Criar Sites, mas, quem quer aprender a Criar Sites com certeza se sentirá atraído a clicar. E você, o seu banner atrai os cliques que você deseja?! Mostre o seu banner para nós!

Este artigo foi desenvolvido por Luigi, que é um designer profissional que trabalha desenvolvendo sites, logomarcas e outros trabalhos gráficos.

Gostou do artigo Como Criar um Banner no Photoshop? Ainda tem dúvidas ou sugestões? Então deixe um comentário abaixo.

Sobre Luigi Cardia

Meu nome é Luigi, sou designer gráfico/web por hobbie, criador do HelpNoBlog.com, que é um blog voltado para ajudar àqueles que querem iniciar no mundo da blogfera, e sou acadêmico do curso de Direito.
Adicionar a favoritos link permanente.

21 Comments

  1. Lucas - Otimizar Blog

    Gostei do tutorial , vou tentar por em prática em breve . Celso acho que a um erro de digitação no “Nível de Dificuldade” , está mostrando 12345 , acho que um tutorial desse nível e muito difícil rsrsr .

    • Lucas,
      Acho que o Luigi quis dizer que é nível 5 mesmo. Também não entendi direito, mas achei que fosse alguma linguagem utilizada entre as pessoas que mexem com este tipo de programa.

      Abraço!

  2. Luigi muito boa dica mesmo mais o que eu queria mesmo aprender é como criar uma logo-marca com identidade visual com o photoshop… será que pode criar um artigo ensinando
    Muito obrigado Fabio.

  3. Celso, será que foi só comigo ou a netaffilliation realmente finalizou a campanha de recrutamento de afiliados? Recebi um email informando que os links serão desativados, mas vejo que aqui no Criar Sites ainda continua a janelinha incentivando o cadastro. Você também recebeu esse email? Se sim, que outras campanhas você pensa em implementar para substituir essa?

    • Pablo,
      Realmente o NetAffiliation cancelou a recomendação de novos afiliados no dia 10 deste mês. Eu recebi o email.
      Eu retirei a janela do NetAffiliation para divulgar meu e-book. Pode me dizer onde você está vendo essa janela?
      Eu estou pensando em vender o espaço que antes ocupava o netaffiliation. Já tenho um possível comprador.

      Abraço!

      • Quando fiz o primeiro comentário, não consegui pensar numa palavra mais adequada. A janelinha a qual me referi era um balãozinho que aparentemente era ativado pela barra da wibiya. Se eu não me engando era na cor azul claro, inclusive. Ah, vc também ainda está mantendo o link pra netaffiliation entre os Links Recomendados na mesma barra ( quer dizer, não sei se vc tem intenção de tirar e não se atentou ao detalhe, mas enfim… )

        • Pablo,
          Creio que você tenha confundido alguma coisa. Eu já tinha trocado essa janelinha há alguns dias.
          Eu tinha me esquecido desse link aí. Vou dar um jeito de tirar.

          Abraço!

  4. Rafael de Araujo

    Para aqueles que NÃO POSSUEM photoshop já existe soluções online, é so da uma pesquisada lá no Google, algo semelhante a ”Photoshop Online”

  5. Parabéns Luigi, ótimo tutorial!

    Celso, estou com um problema chato em meu site! É que recebo diversos comentários que não tem nada haver com nada, um monte de palavras estranhas alguns estão em inglês outros não faço a menor idéia em qual língua estão, já outros são falando sobre viagra e coisas do tipo! Gostaria de saber se isto já aconteceu com você, o que você fez para resolver e o que você me indica fazer?

    • Olá Lázaro!
      Obrigado pelo comentário.

      Em relação ao seu problema, instale e ative o Akismet, isso resolverá!
      É um plugin para filtrar spams. Ele irá pedir um ID lá, mas é só criar uma conta no wordpress.com que você consegue esse ID. Super simples.

      Se já tiver instalado, só ativar.

      Abraços!

  6. Cursos e Site PHP

    Olá,

    Belo tutorial, gosto muito de utilizar o fireworks para desenvolver minhas imagens, mas não largo nunca do Photoshop.
    Obrigado!

  7. Humberto Muniz

    muito bom essa dica muitos usuarios deixam de fazer um bom bane nao por nao ter criatividade mais por nao saber usar o Photoshop

    • Humberto,

      Mas a criatividade é muito mais importante do que saber usar o Photoshop.

      Desenvolver habilidade para trabalhar com essa ferramenta é muito mais fácil do que desenvolver criatividade!

      Além do mais, se pegar um tutorial de Photoshop, mesmo que não saiba utilizá-lo, é só copiar o passo-a-passo que o resultado será o mesmo, ou muito próximo.

      Porém, a criatividade não tem como seguir um tutorial, não tem como copiar. Ou você tem, ou você não tem.

      Acredito que muitos mais usuários deixem de fazer por falta de criatividade do que por não saber usar o Photoshop!

      Obrigado pelo comentário!

      Abraços,
      Luigi

  8. Humberto Muniz

    Luigi,
    Você tem toda razão criatividade e tudo!

    Mais convenhamos que fazer um projeto gráfico ,simples ,direto e de qualidade não depende só da criatividade, e necessário o mínimo de conhecimento possível
    Por isso parabenizo pela iniciativa de compartilhar conhecimento e incentivar o processo criativo aos visitantes do criar sites .

    Abraço!

  9. quero saber onde eu posso arranjar a fonte que usaram pra fazer esse banner

    se puderem me ajudar eu agradeço 😀

  10. Valdir da silva Madureira

    Muito obrigado,no meu caso leigo em tudo com pesquisa assim tenho adquirido algum conhecimento,espero que outras pessoas descubram quanto ser útil ao próximo,desejo tudo de bom a tua pessoa e família .
    até mais ,obrigado mesmo.

  11. cara sinceramente adoreiiiiiiiiiiii e suas dicas foram de grande utilidades para mim ,pois eu estava confusa em relação ao tamanho ideal do banner

  12. Andreia,

    Obrigado pelo comentário!

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *