Favicons

Favicon: meaning favorite icon.  These little gems are the icons associated with each website, visible on your brower's tab system and main URL search bar.  For instance, everyone is familiar with Blogger's favicon, the orange box with a big, white B in it.

So why install a personalized favicon on your blog?  Well, why not?!  :D  Yes, it's basically cosmetic, but since it's so easy and helps readers find your page easily in their sea of tabs, truly, why not spice up your blog in this small way?

Here are my favicons for The Bagel Factory and Lizzie Jane Photography:

Can you spot them?

And here is how to go about creating and installing your favicon:

Step 1.  Visit this website and browse for an image you'd like to upload to their favicon generator.  For both of my blogs, I used my blog buttons.  Once uploaded, you'll be given a chance to view how it will look both stationary and dynamic in your tabs and search bar.  Use the customization capabilities to try to clarify your tiny 16x16 favicon.  With mine, both looked much better once I made the background transparent rather than the default white.

Step 2.  Once you are satisfied with your favicon, download it.  It will be contained in a zip file, so be sure to extract the .ico file to a regular folder and rename it so that it is not just the generic "favicon.ico" file.

Step 3.  Visit FileDen and set up an account.  It asks for all sorts of personal information (including SS# of all things!), but you don't have to give it.  Even with the red asterisks beside the information fields, if you scroll down to the bottom of the page you will note that you can choose to PASS each page.  Just keep passing until you get to your dashboard.  Then upload your .ico file.  Once it is uploaded, you will notice a URL has been assigned to your favicon file.

Step 4.  Go to your blog dashboard --> layout --> edit html.  Hit Ctrl F and search for </head>.  Once you find it, paste the following code just before it:

<link href='YOUR FAVICON URL HERE' rel='shortcut icon'/>
<link href='YOUR FAVICON URL HERE' rel='icon'/>
<link href='YOUR FAVICON URL HERE' rel='shortcut icon'/>
<link href='YOUR FAVICON URL HERE' rel='icon' type='image/ico'/>

Step 5.  Save it and go check out your new blog favicon!  I must say, it looks much better than that bright orange Blogger box!  :D