Metodo Dinheiro Trignosfera - Alojamentos Nacionais Profissionais NextGen Techs  - Portal das Novas Tecnologias       Yves Rocher - 30% sem investimento!     Novidades de Cinema na Internet Performance e Psicologia Loja de Informática Online     Não é sexo mas é bom na mesma! Mais de 500 Jogos em Flash para Você! O Blog Desportivo Multi-Lingua       Notícias Tecnológicas Análises de Informática Logotipos Creativos       Wordpress Creativo a partir de 150€ Wordpress Creativo a partir de 150€ Wordpress Creativo a partir de 150€ Wordpress Creativo a partir de 150€   Livros Técnicos a Preços Fantásticos         Aprenda a desenvolver a web!

MyBlogLog . Technorati . StumbleUpon . BlogBlogs . Twitter . Del.icio.us . Facebook . Flickr . Orkut . diHiTT . FriendFeed . Plurk . Jaiku
1 Star2 Stars3 Stars4 Stars5 Stars (7 votos, média: 4.43 de 5)
Loading ... Loading ...





Envie o post para um Amigo! Imprima este Post Imprima este Post

Favicon significa Favorite Icon. Provavelmente nunca pensou que um favicon poderia ser visto como um dos elementos chave do seu blog, pois não? Então leia bem este post até ao fim, e provavelmente mudará de ideias.
O favicon para quem não está familiarizado com o nome, é aquele pequeno icon de 16×16 pixeis que aparece ao lado do endereço URL do nosso blog ou website, na altura em que o digitamos no browser.
Além de aparecer no browser, o favicon aparece nos favoritos (bookmarks) do browser ou de outra ferramenta de catalogação de websites, pelo que é importantissimo ter uma imagem sólida e atractiva relativamente aos outros websites ou blogs.

O favicon é então extremamente importante. Quantas vezes não ficou já de visitar alguns websites, mas perdeu-os no meio de tantos outros websites, pelo simples facto de não ter um favicon, ou não ter um favicon de que você se lembra-se?

Como criar um favicon e aplicá-lo no seu blog ou website

  • 1- Embora um favicon não vá provavelmente fazer disparar o volume de tráfego do seu blog ou website, irá provavelmente oferecer-lhe maior consistência e branding, na hora de ser clicado por um utilizador que procura algo nos seus bookmarks.
    O favicon é nada mais, nada menos, que uma imagem com 16×16 pixeis, gravada no formato .ico. É importante então perceber, que numa imagem tão pequena será extremamente complicado colocar uma imagem complexa. Foque-se em imagens simples e livres de complexidades, que sejam facilmente entendidas no meio de todos os outros bookmarks. Se conseguir marcar a diferença, certamente terá um sucesso acrescido.


    Este é um exemplo de diversas marcas de renome e dos seus favicons. Os melhores exemplos quanto a mim serão provavelmente o simbolo da Adobe, do MSN, da Amazon e do Yahoo. Imagens simples mas que ao mesmo tempo transportam o branding e a imagem da empresa, que todos conhecem.

  • 2- Utilizar ferramentas gratuitas para criar um favicon é o ideal. Uma das ferramentas que utilizo com maior regularidade para fazer trabalhos express, é o Paint.NET.
    Embora o nome possa enganar, este Paint.NET é um software extremamente desenvolvido. Costumo-lhe chamar o “Photoshop para Dummies”, porque na realidade é bastante completo ao nível de ferramentas. Inclusivé trabalha com layers (níveis).

    A utilização deste software é básica. Utilize-o para criar uma imagem com 32×32 pixeis, e depois visite o website Favicon from Pics, que lhe transforma a imagem de 32×32 num favicon de 16×16 em formato .ico.

  • 3- O Favicon from Pics é um projecto online fantástico. Pode criar e desenvolver imagens para os websites e blogs, e depois convertê-las automaticamente para favicons.
    Aconselho que, mesmo que produza imagens de maior dimensão, faça-as sempre quadradas, ou seja, com a mesma largura e a mesma altura, mas que na hora da conversão não fique desfocada ou pixelizada devido aos ajustes.
    O Favicon from Pics depois de fazer a conversão da imagem para icon, oferece-lhe ainda o código a colocar na sua página, e dá-lhe algumas dicas de onde o colocar. Veja o próximo passo.

  • 4- Se ainda não estiver satisfeito, e for um feliz proprietário de um blog Wordpress, então relaxe porque o plugin MaxBlogPress Favicon promete ajudá-lo e muito, a resolver este problema dos favicons.
    Embora seja gratuito, este plugin irá necessitar de um registo, também ele gratuito, na página da MaxBlogPress, para que depois seja utilizado por si e unicamente por si. Um género de chave API do Google. A utilização do MaxBlogPress é básica e certamente não irei necessitar de explicar o seu funcionamento aqui.
    Pode contar também com uma galeria (ver imagem em baixo) de favicons pré-fabricados, que poderá usar se não conseguir desenhar um à sua imagem e conforme aquilo que tinha desejado para si:

  • 5- Depois de converter o seu favicon através da ferramenta atrás descrita, deverá fazer o upload dele para a raiz do seu FTP.
    Entre no seu FTP (se não tiver peça ao seu prestador de serviços de alojamento), entre na pasta public_html, e de seguida faça o upload do icon.
    Tenha a certeza de que está a colocar o seu icon na raíz do blog/website (root directory).

  • 6- Alterar o header do seu blog ou website é agora um dos passos essênciais. Este passo só deve ser dado depois de ter feito o upload do favicon para o FTP.
    Visite o header.php do seu blog, e tome nota:

    Procure pelas tags <head> e </head> que é onde começa e termina o header do seu blog ou website.
    O código que deve inserir para chamar o favicon, deve ser colocado em qualquer local, desde que esteja dentro destas duas tags.
    Provavelmente o seu blog ou website já tem o código e a única coisa que tem de fazer é substituir o favicon no FTP. Por vezes acontece.
    No caso de estar a fazer de raíz, coloque então o seguinte código:
    <link rel=”shortcut icon” href=”/favicon.ico” type=”image/x-icon” />



    Ficará com algo parecido a isto no seu website ou blog.

  • 7- Agora é importante testar o novo favicon e ter a certeza de que se enquadra bem na temática do site. Abra o seu browser e se necessário limpe os cookies referentes à sua página, unicamente, para que o novo favicon apareça de imediato.
    Abra também algumas tabs e guarde o seu blog nos favoritos (bookmarks) e veja se este se distingue dos demais pela sua irreverência e qualidade.
    Se necessário faça todo o processo novamente, até encontrar o favicon ideal e que transporte consigo todo o branding e essência da sua marca.

O favicon aqui do Fique-Rico foi construido com todas estas ferramentas. O paint.NET foi o software onde dimensionei a imagem e a trabalhei, e depois utilizei o fantástico Favicon from Pics para converter a referida imagem em icon.
Entretanto com as mudanças visuais aqui do blog, tenho de procurar trocar novamente o favicon, para algo que tenha a essência e o visual daquilo que aqui se faz. Faça o mesmo!

Convido-o agora a dizer-nos como criou o seu favicon, e se quiser deixar uma imagem com ele, seria também muito interessante.

Até Já!


Se gostou deste post, considere subscrever o nosso RSS Feed Completo!
Ou então Subscreva o Fique Rico por Email!

Novo aqui no blog ? Talvez queira subscrever o nosso RSS Feed Completo ?

Outros posts de interesse:

  • Faca uma doacao!

    EUR

  • 20 Comentários até ao momento..
    Diogo Pinto | May 17th, 2008
     Add karma Subtract karma  +0

    Para a criação de favicons utilizo: http://tools.dynamicdrive.com/favicon/

    Funcioa sempre e é um espetáculo! Bom post Paulo!

    Abraço ;)
    Diogo Pinto publicou um post sobre..Halterofilismo no seu melhor

    Paulo Faustino | May 17th, 2008
     Add karma Subtract karma  +0

    Olá Diogo. Obrigado pelo comentário.
    Muito interessante. Vou analisar também. Obrigado pela dica. :D

    Marcos Elias | May 18th, 2008
     Add karma Subtract karma  +0

    Olá, ótimo post! Muita gente nem pára pra pensar no favicon :)

    Só o que acho ruim é ele ser no formato “.ico”, poderia ser um GIF qualquer. Dá a falsa idéia para muitos de que seria difícil criar ou converter um ^^

    Marcos Elias publicou um post sobre..Livro Linux - Entendendo o Sistema, para ler de graça pela web :)

    Paulo Faustino | May 18th, 2008
     Add karma Subtract karma  +0

    Olá Marcos. Obrigado pelo comentário.
    Nesse aspecto também concordo. Embora a conversão para .ico seja bastante básica, como expliquei no post. Através da ferramenta “Favicon from Pics” é extremamente simples fazer um novo favicon para o seu blog ou website.

    Vou agora tratar de fazer um novo aqui para o blog :D

    Dourado | May 19th, 2008
     Add karma Subtract karma  +0

    O engraçado é q vc não tem um favicon!

    eu fiz dessa forma

    http://querumbloggratuito.blogspot.com/2008/03/how-to-change-favicon.html

    abraço

    Dourado publicou um post sobre..Mais dicas e um selo

    Dourado | May 19th, 2008
     Add karma Subtract karma  +0

    foi mal, agora vi

    mas é q tá muito desfocado, ou é um efeito?

    abraço

    Dourado publicou um post sobre..Mais dicas e um selo

    Paulo Faustino | May 20th, 2008
     Add karma Subtract karma  +0

    Olá Dourado. Obrigado pelos comentários.
    O favicon é para alterar imediatamente. O próximo já deverá ficar melhor.
    Depois diga-me o que acha quando o vir.

    Até Já!

    David | May 20th, 2008
     Add karma Subtract karma  +0

    Extremamente exclarecedora a postagem, acho o favicon uma ferramenta muito interessante. Ja estou a criar o meu…

    Paulo Faustino | May 21st, 2008
     Add karma Subtract karma  +0

    Olá David. Obrigado pelo comentário.
    Criar um favicon é uma questão de poucos minutos. Espero que as ferramentas indicadas o ajudem na criação do seu. Alguma dúvida por favor coloque um comentário.

    Até Já :D

    José Martins | May 24th, 2008
     Add karma Subtract karma  +0

    Em relação ao favicon aqui do fique-rico, só aparece na página inicial. Quando se carrega no titulo da mensagem para ver o resto da mesma o favicon não aparece.

    José Martins publicou um post sobre..Formatar folhas de dados

    Paulo Faustino | May 25th, 2008
     Add karma Subtract karma  +0

    Olá José. Obrigado pelo comentário e pelo reparo.
    Vou analisar o que se passa, eehehehe :D

    Daniela | May 26th, 2008
     Add karma Subtract karma  +0

    Muito obriagada, este texto é de grande ajuda, estava a tempos pensando em colocar um favicon no meu humilde blog… :)
    Daniela publicou um post sobre..Indiana Jones no cinema

    Daniela | May 26th, 2008
     Add karma Subtract karma  +0

    E acabei de assinar os feeds, porque esse blog promete me auxiliar muito nas minhas incursões pelo mundo dos blogs (sou blogueira desde 2004, levo a sério desde 2006 e pretendo que meu blog melhore de qualidade a cada dia.

    Daniela publicou um post sobre..Indiana Jones no cinema

    Paulo Faustino | May 27th, 2008
     Add karma Subtract karma  +0

    Olá Daniel. Obrigado pelo comentário e bem-vinda ao Fique-Rico.
    Agradeço a subscrição e espero corresponder com conteúdos à altura.
    Alguma dúvida por favor contacte.

    Até Já! :D

    David Rabello | May 31st, 2008
     Add karma Subtract karma  +0

    Necessito de um Help! Crie o favicon utilizando as ferrementas descritas, fiz o upload da imagen.ico e insertei o codigo, fiz o teste no favicon from pics validadtor e foi identificado imagen e codigo corretamente, no entanto nao esta a aparecer em meu browser,,,

    se alguem puder ajudar agradeco.

    diretorio raiz: alfamotor.50webs.com

    Paulo Faustino | June 1st, 2008
     Add karma Subtract karma  +0

    Olá David. Obrigado pelo comentário.
    O seu favicon aqui funciona perfeitamente. Penso que seja um problema com a cache do seu browser. Aguarde alguns dias ou limpe a cache do browser.

    Até Já.

    David Rabello | June 1st, 2008
     Add karma Subtract karma  +0

    Blz, Valeu Paulo, vou limpar o cache.

    Abraco

    David Rabello | June 1st, 2008
     Add karma Subtract karma  +1

    A propósito, este foi um recurso que implantei no Alfa Motors 100% graças ao Fique-rico!

    Paulo Faustino | June 2nd, 2008
     Add karma Subtract karma  +0

    É esse o objectivo colega. Se necessitar de alguma ajuda por favor coloque um comentário. Boa sorte com o projecto.

    Até Já!

    Alcione | August 9th, 2008
     Add karma Subtract karma  +0

    Como faço para esse troço funcionar no Blogger? Não consigo de jeito nenhum!!

    Alcione publicou um post sobre..Arte com alimentos II

    COLOQUE UM COMENTARIO

    :D :) :o :eek: :( :lol: :wink: :arrow: :idea: :?: :!: :evil: :p

     

     

     

     

    Subscrever RSS

    Subscreva o Fique-Rico por E-mail:

    Não deixe para amanhã, o que pode subscrever hoje!

    Contactos Rápidos

    O autor deste blog chama-se Paulo Faustino e é um Freelancer/Blogger profissional, que divide o seu tempo entre os blogs pessoais e os trabalhos para clientes. Poderá contratá-lopara construir o seu novo blog ou website, ou simplesmente para pedir ajuda ou dar um conselho.