post-favicon

O que é Favicon?

Mas afinal, o que é favicon?

Favicon é uma pequena imagem que representa o ícone do seu site no navegador. Eles servem, entre outra coisas, para que o usuário consiga identificar um site mais rapidamente.

Um pouco de história

O primeiro navegador a utilizar o favicon foi o internet explorer 5 e, naquela época (1999), serviam para contabilizar quantas pessoas favoritaram um site. Por isso o nome “favicon”, da junção das palavras “favorite” + “icon“.

No entanto, ele parou de servir para isso quando passou a ser utilizado também na barra de tarefas, independente do site estar no favoritos ou não.

Qual o formato do arquivo de um favicon?

Um favicon pode ser criado em diversos formatos, no entanto, os mais utilizados ainda são o .ico e . png, pela compatibilidade com os principais navegadores.

Recomenda-se que um favicon não ultrapasse o tamanho de 20kb.

De qual tamanho ele deve ser?

O primeiro ponto a se pensar é que o ideal é que os favicons sejam quadrados. Se seu favicon não for quadrado ele será distorcido para que fique nesse formato.

Devido à sua utilização em dispositivos móveis para identificar sites favoritados, ele pode ter um tamanho maior que 16px. Vai depender da finalidade do site e tudo o mais. O recomendado é que você tenha pelo menos:

  • a versão clássica de 16px
  • uma versão HD de 32px
  • os touch icons para iOS

Me dá um exemplo?

Um exemplo é o coraçãozinho que representa o Mundo da Má, vê só:

FavIcon Mundo Da Ma

Como adicionar no meu site wordpress?

Para quem está com a versão 4.3 do wordpress

No painel de controle, acesse o item de menu “APARÊNCIA –> PERSONALIZAR”. Na opção “Identidade do site”, inclua a imagem do favicon em “ícone do site”:

Adicionar Favicon 01

Adicionar Favicon 02

Para quem ainda não está com essa versão

Se você ainda não atualizou a sua versão do wordpress, pode utilizar o plugin All in one Favicon!

Após instalar, ele vai aparecer no menu “Configurações –> All in one Favicon” e lá você pode adicionar todas as versões de favicons que ele suporta.

Adicionar Favicon 03

Para finalizar…

E você, já adicionou o favicon ao seu site? Ainda não? Então corre adicionar porque embora pareça somente um detalhe, detalhes fazem toda a diferença 😉

Se você gostou desse artigo e acha que ele pode ser útil para mais gente, compartilhe ele com os seus amigos!

Ah! E me conta o que você achou aqui nos comentários!

Um beijo!

Curtiu? Então nos ajude a espalhar esta mensagem por aí!



  • Muito bom o artigo! Nem sabia o que era isso. Já coloquei no meu blog.

    • Eba! Que bom que gostou, Aline! E foi uma ótima ideia já adicionar no seu site! Já vi aqui e ficou uma gracinha 😉