O que é? Para que serve? E como adicionar um favicon no meu site?

Você sabe o que é um favicon e para que serve? Neste post vou mostrar como adicionar um favicon ao seu site e qual sua finalidade.

Wolmir Cezer Garbin por Wolmir Cezer Garbin - - SEO - TUTORIAL

Última atualização em: | 1065 Visualizações

O que é um favicon?

Provavelmente você já deve ter visto que alguns sites possuem uma imagem ao lado do seu título na aba do navegador ou ao lado do endereço na barra de endereços, este é o favicon.

Segundo a Wikipédia, "Favicon é uma palavra derivada de favorite (favorito) e icon (ícone). Uma imagem no formato .ico (ponto ico) com cerca de 16×16 pixels que ficam guardados em um site para visualização pelo navegador".

Para que serve um favicon?

O favicon é associado ao logotipo do site, sua principal função é ajudar a compor a identidade visual do site ou da empresa através de seu site.

A grosso modo, o favicon ajuda que seus clientes saibam que aquele é seu site e o reconheçam no meio de outros.

Como criar um favicon?

Para criar um favicon você precisa ter uma imagem (png ou jpg) de 16x16 pixes, após você pode utilizar um gerador web para transformar a sua imagem em .ico

E como adicionar um favicon ao meu site?

Está é sem dúvida a parte mais simples! Tendo o arquivo .ico, adicione ele na pasta raiz do seu projeto, ou seja, que fique acessível pela url:

http://meusite.com.br/favicon.ico

Por padrão os navegadores iram encontrar seu favicon.ico neste endereço, mas se pretende adicionar em outra pasta dentro do seu projeto ou servidor ou até mesmo com outro nome, adicione em todas as páginas o link apontando para onde esta seu .ico, veja:

<link rel="shortcut icon" href="/minha-pasta/favicon.ico" type="image/x-icon" />

Note que utilizar um .ico em seu site é muito fácil e isso ajuda até a melhorar as questões onPage de SEO do seu site.

Caso tenha alguma dúvida, deixe ai nos comentários que te ajudaremos a resolver!


Não esqueca de deixar suas dúvidas nos comentários e compartilhar este post.



Apoiadores

Publique seu post no Receitas de Código

Aguarde, estamos trabalhando para que você possa publicar sua postagem no Receitas de Código!