O que é
Um favicon (abreviatura de "favorite icon", ícone favorito) é a pequena imagem quadrada que aparece junto ao título da tua página numa aba do navegador, numa lista de marcadores, e por vezes no histórico do navegador e nas sugestões de pesquisa. Costuma ser uma versão simplificada de um logótipo — suficientemente pequena para ser reconhecível a poucos pixels, como uma letra, uma forma simples ou um ícone.
Sem um favicon, os navegadores mostram em seu lugar um ícone genérico e vazio — o mesmo substituto usado por qualquer site que ainda não configurou um, o que torna imediatamente óbvio que este detalhe nunca foi tratado.
Por que importa
Um favicon em falta é um pequeno pormenor, mas também é um dos pormenores mais visíveis que existem: aparece em todas as páginas do teu site, em todas as abas do navegador, para todos os visitantes, o tempo todo. Quando alguém tem várias abas abertas, o favicon é muitas vezes a única forma de identificar visualmente a tua aba entre as outras — um ícone genérico e vazio torna isso mais difícil e transmite discretamente a ideia de "este site nunca chegou a ficar pronto".
É também uma das vitórias mais rápidas de toda esta lista: ao contrário de decisões de conteúdo ou design, um favicon demora apenas minutos a criar e adicionar, sem qualquer manutenção contínua depois disso.
Como corrigir
- Cria uma imagem quadrada simples (idealmente uma versão simplificada do teu logótipo) — ferramentas gratuitas de geração de favicons conseguem converter automaticamente uma imagem de logótipo existente nos formatos e tamanhos certos.
- Guarda o resultado como
favicon.icooufavicon.svge carrega-o na pasta raiz do teu site (ou onde quer que a tua plataforma de alojamento espere ficheiros de ícone). - Adiciona
<link rel="icon" href="/favicon.ico">(ou o equivalente em SVG) dentro da secção<head>da tua página. - Se usas um construtor de sites (Squarespace, Wix, Webflow, WordPress), procura um campo para carregar o "favicon" ou "ícone do site" nas definições gerais do teu site, em vez de editar código diretamente.
- Recarrega a página numa aba nova do navegador (ou limpa a cache do navegador) para confirmar que o novo ícone aparece — os favicons por vezes ficam em cache e demoram a atualizar.