Monday, December 12, 2011

Tips to Create A Favicon for your Website
Posted on
  • Monday, December 12, 2011
  • by
  • Unknown
  • , in
  • .
  • A Favicon is the logo of any website that you can see from your browser. Whenever you visit a website, the logo of the website that you see on your browser’s title bar or on your browser’s tab – is the favicon of that site.favicons-of-websites

    If you own a website, then if you haven’t set up favicons for your site, then whenever you visit your site, you would probably would have the default image that the browser sets, instead of a favicon. If you don’t have a favicon, it is high time that you start setting up one for your website, so that all your incoming visitors don’t get turned away.

    Creating a Favicon image

    There may be many downloadable programs and many services on the internet, which lets you create a favicon on your website, but nothing beats creating it on your own. To start doing so, you would need an editor – something more powerful than MS Paint (you can use that too, but I wouldn’t recommend it) like Paint.net, Gimp, etc.

    Before you start designing your favicon, be aware of the fact that a favicon should be in a 16x16 size. Since you can design something good with that small size, I suggest you to create  a new image with huge dimension – like 800x800, design on it, and then resize it to 16x16. [Don’t forget to resize it!]

    Putting it up on your website

    Now that you have finished creating your favicon, you should save it as as <name>.ico format, instead of a gif,png,jpg format. Once you are through with that, you need to upload it to your server. If you don’t have one, then you can use a image hosting to host that file.

    Now that your favicon has a URL, you should link it to your website. In the HTML of your website, search for the <head> tag. Just below it, paste the code:

    <link rel="icon" href="http://www.example.com/favicon.ico" type="image/x-icon"/>
    <link rel="shortcut icon" href="http://www.example.com/favicon.ico" type="image/x-icon"/>

    where you should replace the URL with the address of your favicon.

    favicon-bloggerTip: If you use blogger, and want to use a favicon, then you can easily use your favicon  on your website by uploading your favicon in the Layout option of blogger.

    Subscribe to more tutorials

    Your privacy is taken very seriously.
    Share article: | Subscribe to RSS:

    0 Responses to “Tips to Create A Favicon for your Website”

    Post a Comment

    Modified Mash2 theme being used