Saiba como criar um favicon para seu website ou blog

Análise microfone de lapela sem fio BOYA WM6
19/10/2017
Dicas design para o seu site
25/10/2017

Saiba como criar um favicon para seu website ou blog

  1. O que é um Favicon

  2. Diretrizes Gerais

  3. Como criar um Favicon?

  4. Fazendo upload do Favicon para o seu site

 

Selection_711.png

Você tem um favicon personalizado para seu blog ou site? Se ainda não, realmente deveria ter um. Ele dá o toque final ao branding e ao design do seu blog. Hoje em dia ainda é possível ver muitos blogs e sites que usam o favicon padrão que vem junto com a plataforma de blog que eles usam ou, pior ainda, é possível ver muitos blogs sem qualquer favicon. Portanto, se você é um desses blogueiros que ainda não tem um favicon personalizado, siga este simples tutorial sobre como criar um favicon personalizado e deixe o seu blog ainda mais belo e conveniente para os visitantes.

O que é um Favicon

Um favicon (junção das palavras "ícone e favorito") é aquele ícone pequeno exibido na barra de URL do navegador, nas listas de favoritos e, em determinados navegadores, no lado esquerdo das abas e guias de navegação. Embora um favicon não mudará drasticamente o tráfego de seu blog, certamente irá melhorar a aparência dele, pois ao adicionar um ícone exclusivo ao seu blog você garante que os leitores poderão encontrar facilmente o seu site dentro das listas de favoritos deles.

 

Selection_721.png

 

Diretrizes Gerais

 

Um favicon não é nada mais do que um arquivo com ícone no tamanho de 16 pixels por 16 pixels que possui a extensão .ico. Como você pode imaginar, não é tão fácil colocar gráficos complexos em um espaço tão pequeno. Ao projetar o seu favicon, portanto, você deve se concentrar em imagens ou letras simples. Certifique-se de que a cor do favicon reflita a cor do seu site, para que os leitores possam associar o ícone ao site. Para deixar o seu site profissional, você precisa criar manualmente um favicon baseado em seu logotipo e, em seguida, adicioná-lo ao seu site.

 

Como criar um Favicon?

 

Felizmente, existem muitas ferramentas online que podem ajudar você a criar um favicon para o seu site ou blog. Aqui está uma lista dessas ferramentas:

 

 

Logaster - Criador de Favicon Online

 

Selection_674.png

 

O Logaster é um serviço online para criar logos, favicons e elementos de identidade corporativa. Como criar um favicon com o Logaster:

 

1. Acesse o Logaster e clique em “Criar um favicon”.

 

2. O Logaster é um gerador online de logos, que também é um gerador de favicon, contudo, primeiro você precisa criar um logotipo. O Logaster irá fornecer o favicon que você precisa baseado em seu logotipo. Mas não se preocupe, não leva muito tempo e nem exige esforço.

 

3. Escreva o nome do seu site ou blog e escolha o tipo de negócio. Serão mostrados para você dezenas de logotipos gerados pelo Logaster. Não é necessário criar um logotipo perfeito neste momento ou perder o seu tempo nisso. Você só quer criar um favicon, certo? O logotipo servirá como base para o seu favicon e pode ser modificado posteriormente.

 

4. Agora, clique em "Criar um favicon com este logo" na página do logotipo e escolha o design do favicon.

 

Selection_725.png

O Logaster não gera apenas uma variante do ícone (como os outros serviços on-line), mas ele gera dezenas de belos favicons prontos para usar. Selecione o design de favicon preferido. A pré-visualização permite que você veja como o seu favicon irá aparecer no site. Você pode editar o seu favicon se necessário.

Selection_727.png

 

O que você vai receber ao usar o Logaster? Arquivos .ico e .png em diferentes tamanhos. Além disso, você pode baixar um logotipo gratuitamente!


Favicon.cc

 

Selection_706.png

O Favicon.cc é um aplicativo online que permite que você crie um favicon personalizado para seu site. Como criar um favicon com esta ferramenta:

 

1. Acesso o Favicon.cc e clique em "Criar novo favicon".

 

2. Escolha uma cor para o seu favicon (pode ser a cor principal do seu blog ou site).

 

3. Clique nos quadrados e desenhe o logotipo usando a ferramenta de pintura pixel por pixel.

Selection_728.png

4. Baixe o ícone quando terminar e coloque-o em seu site.

 

De forma alternativo, você pode carregar qualquer imagem do seu computador e o serviço criará o favicon a partir dela. Além disso, você pode criar um favicon animado, se desejar.

 

O que você vai receber ao usar o Favicon.cc? Um arquivo .ico.

 

Genfavicon

Selection_672.png

O Genfavicon é uma ferramenta online gratuita para a criação de favicon. Como criar um favicon com esta ferramenta:

 

1.Acesse o Genfavicon, clique em selecionar arquivo para procurar o arquivo de imagem em seu computador e clique no botão "Carregar imagem" para gerar um favicon para seu site ou blog.

 

2. Usando o mouse, arraste o quadrado sobre a sua imagem para que ele cubra a parte da imagem que você deseja usar para criar o favicon.

Selection_729.png

3. Faça o download do seu ícone.

 

O que você vai receber ao usar o Genfavicon? Arquivos .ico ou .png em 4 tamanhos diferentes.

 


 

Fazendo upload do Favicon para o seu site

 

Quando você obter o seu arquivo favicon.ico, você deve enviá-lo para o seu site. Coloque ele no diretório raiz do seu site - é o diretório onde o arquivo index está localizado.

E por fim, basta editar a seção do cabeçalho do seu site, que é o código que vai entre as tags <head> e </head>. Tudo o que você precisa fazer é adicionar a seguinte linha:

 

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

 

Observe que este código só funcionará se o favicon.ico estiver localizado no diretório raiz.

 

Depois disso, tudo deve estar pronto para exibir o seu favicon, então, abra o navegador e acesse o seu site para verificar se o favicon está aparecendo ou não. Coloque o site em seus favoritos e abra algumas guias para ver como o ícone ficou. Se você não gostou, basta recomeçar e criar um novo ícone.

 

 

Philipe Cardoso
Philipe Cardoso
26 anos, Advogado, Carioca, Criador do Portal Zoom Digital, mantém desde a epoca que possuía formato de blog, Podcaster oficial do Zoom Cast. Amante por todo tipo de tecnologia.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *