O que é um Favicon e tudo o que precisas de saber sobre os Favicons

Sabias que uma das partes mais eficazes da tua marca é aquela que tomas como garantida todos os dias? Não é o teu logótipo, nem o teu esquema de cores meticulosamente elaborado ou o design do teu blogue. É a pequena imagem associada a cada um dos URLs do teu site!

É isso mesmo - é o teu favicon!

Um favicon (ou "ícone dos favoritos") é aquela imagem minúscula que aparece nos separadores do browser para ajudar os leitores a identificar sites individuais. Se já utilizaste um navegador Web, é quase certo que já viste um favicon.

Estás a pensar se precisas de ter o teu próprio favicon? Continua a ler para saberes mais sobre favicons e como podes criar e implementar um hoje mesmo!

‍

O que é um Favicon?

Um favicon, também conhecido como ícone de atalho, de sítio Web, de URL ou de marcador, é uma pequena imagem associada a uma determinada página Web.

Os favicons permitem que os utilizadores identifiquem o teu site, reconhecendo rapidamente o seu design, esquema de cores e logótipos. Destinam-se a representar o conteúdo do teu site num relance e podem ser facilmente vistos nos marcadores, nas listas de favoritos e nos separadores dos navegadores Web.

Porque é que o meu Favicon é importante?

O favicon do teu sítio Web é importante porque reforça o reconhecimento da marca. Os utilizadores são capazes de identificar rapidamente o teu site, recordando o seu aspeto e sensação. O esquema de cores do favicon recorda-lhes instantaneamente o design do teu site e o logótipo no centro da imagem recorda-lhes a tua organização.

Onde é que os favicons aparecem online?

Um favicon aparece na barra de endereços ou no separador do teu sítio Web para os visitantes que estão a navegar com um browser que os suporta. O favicon também aparece na lista do histórico do navegador da Internet e na secção de favoritos da maioria dos navegadores da Web, como o Google Chrome, o Firefox, o Safari, etc.

À medida que a pesquisa móvel continua a crescer, podemos esperar ver cada vez mais pesquisas a serem efectuadas em smartphones e tablets. Consequentemente, é importante que o teu site tenha um favicon para chamar a atenção dos utilizadores móveis quando estes fazem pesquisas a partir de qualquer lugar.

Quais são os benefícios de ter um Favicon?

Embora possam ser pequenos, os favicons são poderosos. As empresas que criam e implementam os seus favicons nas suas plataformas estão a tirar partido de várias vantagens importantes.

Eis como os favicons ajudam o teu site a destacar-se:

Melhora o reconhecimento da marca

Se os utilizadores do teu site conseguirem identificar rapidamente o teu site, lembrando-se do seu aspeto, isso aumentará as hipóteses de voltarem. Além disso, se outras pessoas virem o favicon do teu sítio num e-mail ou noutra página Web e se lembrarem dele, é mais provável que também visitem o teu sítio.

Reforça a credibilidade da marca

A consistência é fundamental para uma marca forte, e o favicon do teu sítio Web reforça este facto ao garantir que o aspeto e a sensação do teu sítio são consistentes em todas as plataformas. Imagina que uma pessoa vê um design numa conferência e outra vê o mesmo design na página Web da tua empresa. Nesse caso, é mais provável que te reconheçam como uma empresa legítima devido aos elementos de design partilhados.

Promove a utilização do site

Ter um favicon encorajará os utilizadores a marcar e favoritar o teu sítio, porque o ícone aparecerá sempre na lista de marcadores ou favoritos desse utilizador. O favicon lembrará continuamente essa pessoa da existência do teu sítio e incitá-la-á a visitá-lo novamente.

Atrai novos utilizadores

Um favicon é outra forma de o teu sítio Web se destacar da multidão e atrair visitantes que querem saber do que se trata. Um bom ícone, bem concebido, chamará a atenção e intrigará aqueles que o encontrarem.

Ajuda os visitantes a percorrerem o teu site de forma eficaz

Os favicons não só ajudam os visitantes a localizar o teu site, como também facilitam a navegação no teu site. Uma vez que o utilizador verá o teu ícone em todas as páginas, poderá navegar facilmente entre as páginas sem qualquer problema.

Um Favicon melhora o meu SEO?

Sim! Os favicons são uma parte importante da estratégia global de SEO do teu site porque têm impacto em todos os elementos seguintes:

1. otimização do URL: O teu favicon aparecerá no URL do teu site. Pode ser utilizado para otimizar o texto âncora para a otimização dos motores de busca (SEO).

2. Tráfego para o teu site: O teu favicon é mais uma forma de atrair visitantes e aumentar o tráfego do teu sítio Web.

3. Sinais de confiança: Quando um utilizador vê um favicon, sente-se mais confortável com o sítio, porque reforça a marca e a imagem da empresa. Os sinais de confiança são um aspeto fundamental para que a classificação nos motores de busca atinja um nível ótimo.

O que devo incluir no design do meu Favicon?

Há algumas coisas que o teu favicon deve ter para ser considerado um sucesso, incluindo:

Funcionalidade adequada: O teu favicon deve funcionar eficazmente em todas as plataformas e dispositivos. Uma vez que os utilizadores podem ver o favicon do teu site na lista de sites favoritos ou na barra de favoritos, certifica-te de que é apresentado corretamente em todo o lado. Um favicon eficaz é aquele que os utilizadores reconhecem instantaneamente e com o qual podem navegar facilmente.

Logótipo: O logótipo no teu favicon deve ser reconhecível tanto pelos utilizadores como pelos motores de busca, o que melhorará a visibilidade da marca do teu site.

Elementos modernos: Os favicons são normalmente representados com uma imagem ou uma animação curta. Certifica-te de que o teu utiliza elementos modernos, como design plano, cores vivas e formas simples.

Texto legível: O teu favicon deve incluir texto legível que escreva o nome da tua empresa de forma clara e eficaz.

Relevância da resolução: Os favicons devem ser apresentados em vários tamanhos diferentes, por isso certifica-te de que o teu está optimizado para todas as plataformas e browsers.

Como posso criar um Favicon?

Estás pronto para criar o teu próprio favicon para utilizar com a tua marca? Aqui estão algumas orientações que te ajudarão a criar um design eficaz:

Escolhe um tamanho de favicon adequado

Os favicons devem ter entre 19 x 19 pixels e 128 x 128 pixels. Também devem ter um fundo transparente porque os favicons são normalmente apresentados em cima de outras imagens ou desenhos.

Tem cuidado com a animação

Embora seja aceitável incluir animação no teu favicon, certifica-te de que é mínima e não distrai os utilizadores. Se decidires incluir animação, certifica-te de que o movimento se enquadra no design geral do ícone.

Escolhe um tipo de letra

Tens de escolher um tipo de letra adequado para o nome do teu sítio ou da tua marca. Sê criativo! Utiliza um tipo de letra único para criar um design distinto. Os tipos de letra podem ser facilmente alterados utilizando CSS.

Considera as cores

Lembra-te de que as cores do teu Web site aparecerão no teu favicon, por isso escolhe-as cuidadosamente. Também deves ter em consideração outros Web sites que apresentem esquemas de cores, marcas ou estilos semelhantes. Se desenhares o teu ícone para se destacar entre os seus rivais, pode não funcionar bem com os deles!

Testa o teu Favicon

É importante testar o teu favicon antes de o publicares. Para isso, basta utilizares algumas plataformas diferentes, incluindo dispositivos móveis e browsers. Além disso, verifica se o teu favicon funciona bem com o texto e outros gráficos do teu sítio.

Como é que adiciono um Favicon ao meu site?

Adicionar um favicon ao teu site é bastante fácil e pode ser feito através de alguns métodos diferentes:

‍

1. Usa o backend do teu site - O método fácil

Este método aplica-se a sítios Web que têm um backend incorporado.

1. Acede ao painel de controlo do teu site vsble e clica no separador "Logótipo".

2) Desliza para baixo e clica em upload favcion, selecciona o teu favicon e carrega-o.

3. clica em guardar - pronto! 

Vê o vídeo abaixo se quiseres

‍

‍

2. Método HTML

Este método permite-te adicionar um favicon em qualquer website, bastando para isso introduzir o código no código fonte da página ou na área do cabeçalho. Segue os passos envolvidos nesta abordagem:

1. Adiciona uma ligação html ao teu favicon e fornece o URL e o nome da imagem.

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

3. Make sure you include this code within the <head> section of your code, as well as at least 68 characters before closing </head>.

4. Se estiveres a utilizar uma aplicação de servidor, certifica-te de que carregas o ficheiro de imagem do teu favicon na pasta "img" do diretório onde se encontra o teu sítio Web.

‍

3. Método dinâmico (CMS) Método

Este método permite-te carregar um favicon num sítio Web que utilize um sistema de gestão de conteúdos (CMS). Eis os passos a seguir:

1. Inicia sessão na tua conta CMS e procura uma opção chamada "Aparência", "Design" ou "Personalizar". Se não conseguires encontrar esta área, consulta a documentação do teu site para obteres mais informações.

2. Procura um separador chamado "Design personalizado". É aqui que vais introduzir o nome, o endereço e o favicon do teu sítio Web, para que apareçam em todo o sítio.

3. Introduz qualquer informação necessária (ou seja, título, URL, imagem) nos campos adequados e, em seguida, carrega o teu ficheiro de imagem para a pasta "img" do teu diretório ou subdomínio CMS.

4. Guarda as tuas alterações e testa-as! O teu favicon deve estar pronto para ser usado.

Como é que testo o meu Favicon?

Existem algumas formas de verificar se o teu favicon está a funcionar corretamente ou se precisa de alguns ajustes. Podes fazê-lo utilizando diferentes plataformas, browsers e dispositivos com resoluções elevadas. Certifica-te de que testas o design do teu site em todas estas plataformas antes de o publicares ao vivo! Se não vires o favicon no teu browser, isso pode dever-se à cache do teu browser. Consulta este guia de resolução de problemas para limpares a cache do teu browser.

Existem geradores de favicon?

Se não quiseres criar o teu próprio favicon ou se quiseres adicionar animação, existem algumas boas ferramentas que podes utilizar, incluindo:

Gerador de favicon

Ferramentas do Dan - Gerador de ícones e aplicações

Favicomatic

● Genfavicon

● Aplicação Icons8

Gerador de favicon real

Favicon CC

Cada um dos sites acima permite-te criar rapidamente o teu próprio favicon. Podes editar um favicon existente ou criar um novo a partir do zero. Há muitos ícones que podes escolher e cada site permite-te adicionar efeitos diferentes para o tornares único.

Cria e implementa o teu Favicon hoje mesmo

Estás pronto para criar o teu próprio favicon? De que estás à espera?! Segue os passos acima e, em pouco tempo, terás um ícone nítido e limpo que fica bem em qualquer dispositivo ou navegador! Em breve, verás os benefícios de adicionar um favicon ao teu site.

‍

‍