Favicons are important for your brand. A high quality crisp favicon is the finishing touch for many bloggers, tying together the style and identity of a great-looking blog. Your users remember your blog through this favicon.
Today, I added a high quality favicon to my blog. To my surprise I saw my favicon is very blurry.
Why does my favicon look blurry?
So I decided to know more about this problem. Because I know that when you know why the problem occurs, you know how to fix it.
Why is my favicon blurry?
The main problem is with resolution of favicon image. Some Content Management System like Blogger reduces the size of the favicon which affects its resolution.
And sadly there is no way to stop Blogger from doing this. Also, Blogger does not support PNG icons yet.
How do I make my favicon clear?
Yes. there is a way to fix all these problems and to tell you it is very simple.
I want to share this method with you so that you can add a high quality favicon to your blog.
Follow the steps below:
How to fix low resolution favicon on blogger?
By following the steps below you will be able to override Blogger favicon and even use PNG icons for your blog.
1. Create a high quality favicon png image of size 64 by 64 and upload it to any server where you can access it through a URL. Keep thi URL handy.
6. Again click on the Customize dropdown button. Then click on ‘Edit HTML’
8. Replace the 'https://www.example.com/favicon.png' to the URL where you have your favicon uploaded in Step 1.
9. Save the theme template.
10. Open your blog in the browser and you would see a high quality favicon.
If you encounter any problem, let me your questions in the comments below.