Crie um favicon para o seu site em 3 passos
Ontem em conversa com um colega meu, ele questionava-me como se chamava aquele ícone que aparecia sempre na barra de endereços e que mudava de site para site.
Depois de 5 minutos de conversa sobre este tema, lá lhe expliquei que esse ícone se chama normalmente de favicon e que certamente no pplware tínhamos lá um artigo sobre isso.
Quando cheguei a casa, lembrei-me de pesquisar no pplware sobre favicon e verifiquei que já existiam alguns artigos sobre o tema e inclusive um sobre como construir um favicon animado (ver aqui). Como os artigos já foram escritos há mais de um ano, decidi fazer uma pesquisa na Internet na tentativa de saber qual o melhor serviço actualmente. Depois de algumas pesquisas fiquei-me pelo serviço online favigen.
O serviço favigen caracteriza-se pela sua simplicidade na criação de um favicon. Para a criação de um favicon o utilizador apenas tem de realizar os seguintes 3 passos:
- Fazer upload de uma imagem
- Escolher o tamanho do favicon (normalmente 16x16)
- Carregar no botão Create Favicon
Depois de realizados os passos anteriores, basta carregar no botão Download your favicon. Além da produção do favicon, o serviço disponibiliza de imediato também o código a incluir na vossa página web. Para tal, basta editarem as páginas do vosso site e incluírem o código (Não se esqueçam que de acordo com o código abaixo, o favicon deverá ter o nome favicon.ico)
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico"> |
Experimentem e não se esqueçam de nos mostrarem o resultado.
Artigos relacionados
Homepage: favigen
Este artigo tem mais de um ano
12×16 ou 16×16?
16×16, senão fica rectangular 🙂
Não sabe nada aquele que não desenha uma imagem de 16×16 de raiz, e apenas faz resize.
Exacto. Muitos sites fazem resize de uma imagem grande e acabam com uma imagem que não se entende mesmo nada.
Ou em .png.
Olás,
Na verdade até podemos utilizar .ico, .png, .jpg.
Só temos de mudar a linha:
Abraços.
Bruno Santos
Cordelima.com
Podem usar o http://www.favicon.cc/ que ade da para criar o proprio favicon online.
Num blogue, onde deverei colar o código?
Para o Blogger e WordPress veja aqui: http://www.ferramentasblog.com/2010/02/como-trocar-favicon-blogger-wordpress.html
Eis uma coisa que eu nunca soube fazer, e agora terei uma ótima chance.
Dá para usar isto numa pagina no facebook?
Boas!
Como faço para inserir um favicon num site feito em wix (não tenho acesso ao codigo fonte) e claro sem ter de fazer um upgrade.
Obrigado
Deve colocar-se também a regra para o Iphone, visto que é diferente.
O ícone deve ter o formato PNG e deve ter, como dimensões, 57×57 pixeis.
O código a usar é:
Devem colocar esta linha abaixo da linha de código referida acima, neste post.
Tenho um e-commerce sob a plataforma Magento. Na última atualização, criou-se um modo de inserir o Favicon automaticamente. Minha recomendação é usar sempre o tamanho 16×16, para ficar bem definido e evitar distorções na imagem.
Abraços a todos