Adicionando um favicon ao seu site
Colaboração: Rubens Queiroz de Almeida
Data de Publicação: 07 de agosto de 2012
Favicon é uma abreviação para Favorite Icon. Quando nós visitamos um site, na barra de endereços, no canto esquerdo, aparece uma pequena imagem. Esta imagem é um pequeno logotipo do site:
![]() |
Para a dicas-l, até hoje, eu (e mais 55 milhões de sites sobre softwarelivre) usava uma imagem de um pequeno pinguim. Eu resolvi então criar algo mais em linha com a identidade visual do site e procurei por um site que gerasse, gratuitamente, um novo favicon para mim, usando o logotipo criado para o site alguns anos atrás por Ricardo Burile.
No endereço FreeFavIcon você consegue criar seu favicon gratuitamente. Além de um favicon estático, você também tem a opção de criar uma imagem animada, que exibirá o seu logotipo e uma mensagem que ficará sendo exibida no espaço reservado ao ícone.
Basta fazer o upload da imagem e o site se encarrega de criar tudo o mais para você. Ao final do processo, você recebe instruções para baixar um arquivo zip contendo todos os arquivos:
unzip favicon_19636e04b992329b6b381abcdc584d05.zip Archive: favicon_19636e04b992329b6b381abcdc584d05.zip replace favicon.ico? [y]es, [n]o, [A]ll, [N]one, [r]ename: A inflating: favicon.ico inflating: readme.txt inflating: preview_16x16.png inflating: preview_32x32.png inflating: animated_favicon.gif
As instruções de uso estão contidas no arquivo readme.txt.
Para referenciar as imagens, basta inserir, no cabeçalho de suas páginas html as seguintes diretivas:
<link rel="shortcut icon" href="/favicon.ico" /> <link rel="icon" href="/animated_favicon.gif" type="image/gif" />