, , ,

Garantindo a compatibilidade do seu Favicon com todos os navegadores

Blogger Hacks 

Exemplo de FaviconUm dos grandes problemas com os Favicons, principalmente pra quem possui um blog no Blogger/Blogspot, é fazê-los funcionar em todos os navegadores da mesma forma e com um único Hack. Nessa postagem você verá algumas dicas para garantir a compatibilidade do seu Favicon com todos os navegadores.

Verifique se o Hack do seu Favicon corresponde com todas as orientações dadas na postagem Colocando um Favicon no seu Blogger, o que já o torna compatível com o Firefox, Internet Explorer, Safari e Google Chrome.

Então vamos encontrar o código original do Hack, logo antes da tag </head> (utilizando o Ctrl+F do seu navegador): 

<link href=’URL DO FAVICON’ rel='shortcut icon'/>
<link href=’URL DO FAVICON’ rel='icon'/>

Não se esqueça de fazer o backup do seu template antes de realizar as alterações no código, clicando em Baixar modelo completo.

Para garantir maior compatibilidade e estender a exibição do Favicon à navegadores como o Opera, ofereça o Favicon em dois formatos de arquivo diferentes. Um .ICO para o Internet Explorer e um .PNG para os outros browsers. Para obter o segundo formato do arquivo, utilize o site iConvert. Então hospede-os num servidor como o Yahoo! GeoCities, Image Boo Hosting ou o Picasa (somente para .PNG) e coloque-os dessa forma no código: 

<link href=’URL DO FAVICON .ICO rel='shortcut icon'/>
<link href=’URL DO FAVICON .PNG rel='icon'/>

Utilize o nome de arquivo “favicon” para evitar bugs com o Internet Explorer e outros browsers mais antigos. Um favicon.ico e outro favicon.png.

Procure não alterar frequentemente o Favicon do seu blog, pois isso pode fazer com que ele deixe de aparecer para usuários do Internet Explorer (até que o cache do navegador seja renovado).

Visualize para ver se está tudo correto e clique em Salvar Modelo. Agora seu favicon será exibido corretamente em todos os navegadores, inclusive os menos populares.

Se o Hack não funcionar, tente limpar os arquivos temporários do seu navegador e reabrí-lo. Também verifique se os arquivos .ICO e .PNG estão corrompidos. Se o problema persistir, utilize o backup que você criou e clique em Fazer Upload, então refaça todo o processo.