Monday, September 15, 2008

Favicon Tutorial -
Making a little tiny
picture thingy

A couple weeks ago, I posted here on this blog, and here on my other blog, a little tutorial on how to find hex codes when you're tweaking the color of your blog template.

In the screen shots used for the tutorial, you can see the Firefox various tabs I had open at the time. I was careful to make sure that the visible items were suitable for world-wide viewing, and didn't think much beyond "Is that private information or not?"

I had a good chuckle when Brad from left this comment on the post:
LOL. It's pretty cool seeing your favicon in a tab on a screenshot..
Thanks for visiting!

Yeah Brad, that actually is pretty cool. I guess the secret's out about what I read when I post. (I haven't heard from Chris Brogan, yet. Score one for Brad for picking this up first - of course Brad, you have two tabs to Chris' one.)

To my dear readers, if you are wondering what the heck Brad is talking about, the favicon is the little picture thingy that you see on the left side of each tab in the picture below. There's also a favicon in the address bar on the browser in the picture. (Brad's favicon is a bold, dark letter "B")

If you look up at the address bar at the top of your screen right now, you probably see a favicon, too. It could be the orange Blogger "B" or my pink zinnia that I use as my avatar everywhere I go.

Would you like to make one for yourself? It's pretty easy. You can do this.

There are a lot of good tutorials out there, so instead of repeating what other folks have said, I'll just point you toward two that are well-written and not too tech-y.
Short and sweet. Easy if you already have a website or hosting to which you can upload your favicon image.
Here, Sarah mentions using Flickr to host your favicon image.

When you get yours installed, leave a comment here and share your link so we can see your favicon masterpiece.

PS: Hey Brad, when you leave a comment here, would you mind sharing how you found this post? Technorati, Google Alerts, etc? I'd like to use it as an example for a future post.


  1. Rats! That Brad. Always beating me to the punch. : ) Pretty neat tips, too.

  2. LOL!
    And thanks for the compliment. I'm honored and flattered that a marketing giant such as yourself likes my tips.


Thank you - I appreciate all comments, questions, praise, criticism, suggestions, requests, reports ...