Crie favicon.ico para o seu site a partir de uma única imagem

Um favicon é muito mais do que um pequeno ícone – é um elemento essencial da identidade da marca na web. Os navegadores apresentam-no no separador, os utilizadores veem-no nos favoritos e no histórico, e o Lighthouse verifica a sua presença como boa prática. Sem favicon, um site parece incompleto.

Os sites modernos precisam de favicons em vários tamanhos: um favicon.ico para navegadores antigos, ícones PNG para navegadores de desktop, um Apple Touch Icon para dispositivos iOS e ícones maiores para instalações PWA no Android. Esta ferramenta gera todos os ficheiros necessários a partir de uma única imagem.

O Google apresenta os favicons junto ao URL do site nos resultados de pesquisa. Os resultados em dispositivos móveis mostram favicons desde 2019. Os resultados em computador incluem-nos desde janeiro de 2020. O favicon é um elemento visual da marca presente em cada pesquisa no Google.

O Google define requisitos específicos para a apresentação de favicons. O ícone deve ter pelo menos 48×48 píxeis. Deve ser quadrado. A imagem deve ser claramente visível sobre fundo branco. O Google rejeita ícones com conteúdo inadequado ou vazio.

O Googlebot rastreia e indexa os favicons de forma independente do conteúdo da página. A atualização do favicon nos resultados pode demorar de vários dias a várias semanas. O ficheiro favicon não deve estar bloqueado no robots.txt - caso contrário, o Google não conseguirá obter a nova versão.

O Bing também apresenta favicons nos seus resultados. O DuckDuckGo mostra os ícones do site junto a cada ligação. Um conjunto completo de favicons garante uma aparência de marca coerente em todos os motores de pesquisa. Os utilizadores reconhecem os favicons familiares mais rapidamente, o que contribui para uma maior taxa de cliques.

A coerência visual entre o favicon e o logótipo fortalece a memorização da marca. O ícone aparece nos separadores do navegador, nos favoritos, no histórico de navegação e no ecrã inicial do telemóvel. Quando um utilizador tem dez ou mais separadores abertos, o favicon é o único elemento visível que identifica o site.

Em Portugal, plataformas como Shopify e WooCommerce permitem configurar o favicon nas definições do tema. No Brasil, Loja Integrada e Nuvemshop facilitam a personalização visual das lojasm mercado mobile-first - mais de 80 % dos acessos à internet provêm de smartphones, tornando o favicon no ecrã inicial ainda mais relevante.

Sites de comparação como Buscapé e Zoom exibem favicons nos resultados, aumentando a diferenciação visual entre os vendedores. Um favicon profissional sinaliza credibilidade e destaca a loja entre dezenas de resultados concorrentes.

As empresas de serviços - desde escritórios de advocacia até clínicas médicas - constroem confiança já ao nível do ícone no separador do navegador. A ausência de favicon ou o ícone predefinido do navegador pode sugerir falta de profissionalismo.

As Progressive Web Apps requerem ícones adicionais para além do favicon padrão. O ficheiro manifest.json deve incluir um array de ícones com dimensões 192×192 e 512×512 píxeis em formato PNG.

Os ícones maskable são um tipo especial de ícone para dispositivos Android. O sistema operativo recorta os ícones maskable em diferentes formas - círculos, quadrados arredondados ou gotas. A zona segura cobre os 80 % interiores da superfície da imagem. Todos os elementos gráficos essenciais devem estar dentro desta zona para evitar o recorte.

A Apple exige um ficheiro apple-touch-icon separado de 180×180 píxeis. Este ficheiro deve ser declarado na secção head do HTML - o iOS não o lê a partir do ficheiro manifest.

O Brasil lidera a adoção de PWA na América Latina. Magazine Luiza, Mercado Livre e iFood utilizam tecnologia PWA para oferecer experiências rápidas e similares a aplicações nativas. Em Portugal, bancos e serviços adotam progressivamente esta tecnologia.

A auditoria Lighthouse nas ferramentas de desenvolvimento do Chrome verifica a presença e a validade do favicon e dos ícones PWA. Um favicon ausente ou inválido gera um aviso na categoria PWA da auditoria.