Reforce a marca de seu site com o Favicon.ico
O que é o Favicon.ico
Favicon.con é um pequeno ícone que serve para representar um site na barra de endereços, nos favoritos e abas dos navegadores.
Trata-se de uma imagem com a extensão .ico que deve ter o tamanho máximo de 16×16 px.
Confira o atual icone do Criar Sites
Acima você pode conferir os locais onde o Favicon.ico pode aparecer no Firefox 3.
Pra que usar o favicon.ico
Destaque nos Favoritos - O favicon serve para dar mais destaque a um site que tenha sido adicionado aos favoritos dos navegadores, já que o ícone é adicionado antes do nome do site.
Destaque nas abas dos navegadores - Em navegadores que permitem navegar por abas, o favicon.ico é adicionado a aba antes do nome do site.
Reforço da marca - Ao ver várias vezes o ícone de seu site, sua marca é reforçada na mente do visitante.
Como criar seu favicon.ico
O atual ícone que está sendo utilizado aqui no Criar Sites eu fiz com a ajuda do site Dinamyc Drive. É necessário que você tenha previamente criado uma imagem quadrada com até 150.00 kB para que o favicon maker possa trabalhar com a imagem.
Também existem outras opções que permitem criar seu favicon como o Favicon from Pics ou o Favicon.cc que permite que você desenhe seu favicon.
Você também pode criar o seu utilizando um editor de imagens que permita trabalhar com arquivos .ico
Como inserir o favicon.ico em seu site
Se você tiver acesso FTP do seu servidor, basta que você envie para o servidor seu favicon.ico a pasta raiz de seu site. O próprio navegador se encarrega de encontrar o favicon.
Para quem não tenha acesso ao servidor como os ususários do Blogger, poderá hospedar o favicon em um serviço de armazenamento de imagens e incluir o favicon utilizando o código abaixo.
Insira entre as tags <head>e </head> das páginas de seu site o seguinte código
<link rel=”shortcut icon” href=”http://www.criarsites.com/favicon.ico”>
Deverá ficar algo assim:
<head>
<link rel=”shortcut icon” href=”http://www.criarsites.com/favicon.ico”>
</head>
Troque o atual endereço para o endereço onde o arquivo favicon.ico esteja armazenado.
Obs: Mesmo que você tenha inserido o ícone diretamente no seu servidor, é aconselhável que inclua a linha acima para ter certeza que o navegador encontre o seu favicon.ico
Nota
O favicon não é suportado por todos os navegadores e suas versões. No meu site eu testei no Firefox 3, no Internet Explorer7 e Ópera. Em todos funcionaram perfeitamente.
Se após incluir o Favicon em seu site, ele não aparecer no navegador, experimente limpar os arquivos temporários e reiniciar o navegador.
Artigos relacionados
Crie banners online facilmente
Gifs animados - 20 sites grátis
Animador de imagens - Gif Animator
Confira também
Artigo Anterior: WebNode - Crie seu site Grátis com um assistente passo a passo
Próximo Artigo: 7-Zip - Compactador e descompactador de arquivos Grátis
Não tem tempo para acessar o Criar Sites para conferir as novidades?
Celso eu tbm não conheço nd...
Parabéns pelo artigo! É interessante como você trata de assuntos bastante específicos. Particularmente, me identifico com sua maneira de analisar, principalmente no que diz respeito à recursos de WordPress e relacionados.
Contudo, você esqueceu de citar uma outra coisa importante: nem todos os provedores de hospedagem suportam arquivos com a extensão .ico.
É importante verificar esta questão antes de passar um tempão criando o arquivo. Afinal, perda de tempo pode ser frustrante e desgostosa (não que isso tenha contecido comigo…rsrs…).
Marcos,
Não tinha pensado nesse pequeno detalhe, vou procurar algum serviço de hospedagem de imagens que aceite arquivos .ico
Obrigado pela dica. Abraço!
Hj eu estava pesquisando como colocar o tal do favicon no site e encontrei este como primeiro na pesquisa(parabens ^^) e queria complementar que para aparecer corretamente eu tive que adicionar mais coisas no codigo, ficou assim:
Onde eu inclui o ” type=”image/x-icon” ” só assim apareceu no meu site!!
Esta de parabens pelo site, estou comecando com sites e to achando muita coisa aqui, precisando é só falar, terei prazer em ajudar!!
Abraços!!
Fabio,
Obrigado pela visita e pela dica.
Vou averiguar isso.
Abraço!
Caro Celso, como visitante antigo do seus sites, tenho a obrigação de te mostrar o caminho, http://www.iconj.com/icon_generator.php aí você cria ou carrega o seu ícone já pronto, hospeda o seu ícone e ainda pega o código html prontinho pra usar. É mole ou quer mais…
Detalhe, no internet explorer só aparece o ícone se você fizer uma limpeza no cache. Pra deixar ainda mais fácil, deixo este caminho também completo: Dentro do Internet Explorer vá em ferramentas/opções da internet/ excluir/ excluir tudo/sim.
Confiram o resultado do meu ícone:
http://megaciencias.blogspot.com/
Espero ter ajudado.
Celso
Muito obrigado, ajudou muito.
Leandro
Você também ajudou, se não fosse esse site ficaria boiando….
Abraços