Favicon secrets - Blissfully personalize your visitors’ bookmark of YOUR site
NOTE! If you enjoy this post, please feel free to share and twitter it with the tinylink http://tinyurl.com/23sy94 . Thanks, I appreciate it!
Ever see those cute ‘lil adorable images at the top of your browser that looks remarkably NOT like the typical IE or Firefox or Opera icon?
Those cute ‘lil adorable images are called Favicons and can be your visitor’s best friend!
Why, I hear you murmur to yourself?
Simple of course - unique, customized favicons give a visual clue to your visitor when they peruse all of THEIR bookmarked sites, and help them zoom back directly to yours. Plus, they look spiffy coolio as well.
Here’s the best part - they’re free to create and incorporate to your site! Here’s a simple guide on how to do this.
DO THIS FIRST) Have an image you’d like to use.
Favicons end up being 16 pixels by 16 pixels - not a whole lot of space indeed! You should have ready on your local computer the image (jpg, gif) that you’d like to use. You can use a larger one, of course - the free tool I’ll be showing you willautomatically smoosh it down.
Step 1.) Note where your source image is on your computer.
Whenever I create favicons, I generally name the source file
- favicon.gif
Sometimes I amaze myself with my grasp of the obvious.
Remember the directory that contains your source image.
Step 2.) Visit http://tools.dynamicdrive.com/favicon/ .
This is the site of the free Favicon Generator tool you’ll be using. You should see something similar to:
Click on the Browse button and browse to your source image. Once you’ve selected it, click on Create Icon.
Step 3.) Voila!
Download and unzip the favico.zip file that will be returned. Extract the file
favicon.ico
and upload it to the root directory of your blog or website. If necessary, add the following line to your header.php within the <head> tag:
<link rel="shortcut icon" href="/favicon.ico">
And that’s all there is to it!
Couple of things to note. One, it might take awhile for the favicon.ico to actually display in browsers. Two, sometimes IE displays them….and sometimes not. It gives you a loverly opportunity to experience great frustration!
But for the most part, this should work quite well for your blogs or websites. If you would like other ideas for favicons, check out:
- Designing Favicon with Photoshop simple way to do
- Do your site a Favicon
- Favicons from Hi Res pictures
Remember, every little bit counts when it comes to making your site visually arresting! Since it’s so easy and free to do to boot, why not take 5 minutes and dash one up yourself. Your visitors will thank you for it.
ThankYouVeryMuch!
Owlbert
Related posts:
- Easily add a signature image to your blog posts
- 1 easy way to make your blog load faster by reducing your image file size
- Google to reveal the Deep Invisible web
(By the way, if you have any questions about the topics in this posting "Favicon secrets - Blissfully personalize your visitors’ bookmark of YOUR site", do comment below - I'll try to clarify any issues).
If you find this blog posting useful, please feel free to share it below. And do feel free to let your friends know about it as well....I very much appreciate your time!
Spread the Word!
Like this article? Please feel free to subscribe
to our updates!




One Comment, Comment or Ping
Fariez
Hi Owlbert, nice tutorial of yours, and thanks for linking to my blog..
Mar 3rd, 2008
Reply to “Favicon secrets - Blissfully personalize your visitors’ bookmark of YOUR site”