Are you a new blogger? Have you installed a favicon yet? Are you wondering what the heck a favicon is? Have no fear! I have all of the answers you need.
NOTE: I created this tutorial while using the Blogger platform for Kinder-Craze. Since writing the post, I have migrated to WordPress. This tutorial is intended for Blogger users.
The word favicon is short for “favorite icon”. It’s the little picture you see next to the name of your favorite blog or website. And, just like your blog button, a favicon is super-important for helping visitors recognize and identify your blog because it is displayed frequently in web browsers. As you can see from the photo above, the favicon image is shown on the page tab when someone views your blog, in the address bar beside your web address, and on the bookmarks toolbar (or menu) when someone adds your blog to their list of website “favorites.”
Your blog’s default favicon is the orange and white Blogger logo that looks like this. I think we can all agree that the Blogger logo doesn’t really project the image or fun of your blog and it needs to be changed.
Designing your Favicon
Before you can install a favicon, you need to CREATE one! I made mine in Pages for Mac, but you can use Publisher or PowerPoint to create your image. As you create your image, it is important to keep in mind that the favicon must be shrunk to 16×16 pixels. That’s really small! Don’t include too many details because you won’t be able to see them. Many bloggers have success shrinking their blog button down to 16 pixels, but this did not work well for me at all. Here is my attempt at shrinking my blog button. The image is not distinct and my colors just sort of run together. See what I mean?
So, I chose to create a simple favicon using the cream dot and pink motif from my blog. The final favicon is much easier to identify.
Once your favicon image has been created, save the file as a jpeg or png. Crop any unwanted edges from the image, and resize the final image to 16×16 pixels.
Installing your Favicon
Now that you have a favicon, you can easily install it using your Blogger Dashboard. I made a quick video tutorial to demonstrate the process. The installation doesn’t require you to use any HTML code and you won’t believe how simple it is!
Can’t see your newly installed favicon?
You probably just need to clear your browser cache, then just reload the page. It should work for you. If you need instructions for clearing your cache, Google has all the answers! They provided easy instructions for clearing the cache of any browser.
Have you installed a favicon yet? What image did YOU use?