Thursday, February 22, 2007

An Easy Way To Dress Up Your Site

Do you know what Yahoo.com, Google.com, MSN.com, Clickbank.com, Paypal.com, htmldog.com, Mozilla.com, EzineArticles.com, GoArticles.com and Microsoft.com all have in common?

I'll give you a clue.

Look at the page url in your browser's address bar. It's way up at the top of your browser.

And if you happen to be using a browser that has tabs like Explorer 7 or FireFox and have several tabs open then look at the tab for this page.

Do you notice anything?

Hopefully you see an image with the letter "B" for Blogger in front of the url.

That little picture is called a favicon and favicons are used by many of the better known sites to help you remember them.

Another great things about favicons is that they not only show up on the browser but these little guys also show up in your Favorites or Bookmarks list. So when someone adds your site to their favorites, instead of getting lost in the other hundreds of listed sites, your site stands out.

Now making a favicon isn't difficult. The big things to remember are:

  • Favicons must be 16 pixels by 16 pixels.
  • Favicons use 24 bit color.
  • Favicons must have a file type of .ico

There are 2 easy ways to create a favicon from 1 of your images.

  1. The do-it-yourself Method

    Get a free copy of Irfanview, it's 1 of the free resources inside our member area. (It's listed under Website Help.)

    After it's installed open Irfanview and turn on it's screen capture. (That's under the Options menu.)

    Then using your text processing program like Word or your favorite html editor, insert the picture you want to use on a blank page. If you want the picture to be surrounded by a color other than white change the page color.

    Do a screen capture. (That's Ctrl plus F11 for Irfanview.)

    Crop off all the extra stuff around your picture.

    Resize the picture to 16 x 16.

    Save the picture as file type ico.
  2. The Use-A-Tool Method

    There is a Favicon Creator tool that does all of the above steps for you.

After you have the favicon created you simply add this line of code between the <head> and </head> of your web page.

<link rel="shortcut icon" href="favicon.ico">

You can name your favicon anything you want as long as you remember to put the .ico extension on it and you can have the favicon anywhere on your site as long as you put the correct path to the file inside the "favicon.ico" quotes.

After you save your page upload it and your favicon.ico files to your host.
Now you've just made your site stand out from the crowd in your visitors' sea of bookmarks.

So have some fun and dress up your site by creating your own favicon.

To Your Success,
Susan

PS Using a tool to create your favicons can really save time so you'll be able to create more. Then you can use different ones for different pages on your site if you like.

To get more information about the tool mentioned in today's tip Click Here.