Favicon, comes from “Favourite Icon”, can be simply described as an icon of a website, normally in 16×16 or 32×32 pixels. It can be a standar favicon image, transparent favicon background image, orĀ  animation favicon image. We can see favicon of a website in mozilla firefox and opera browser (sometimes i.e), bookmark pages, etc.

Nowadays, favicon is not only a common icon, but it also a brand of a website. For example, , will make everyone thinks about google. So do this icon, , will refer to yahoo by everyone’s thought.

How to create a favicon in your website?

  • Create your own design for the favicon. It can be a picture, word, or whatever. Usually use a jpg, gif, or png format.
  • Make sure that this image in a rectangle shape. Take a look at this design in a 16×16 sized pixels to make sure that your design can be seen as good as you want.
  • If you want to make a transparent background or a simple animation, save your design in a gif format. Otherwise, simply choose a standard jpg format.
  • There are a lot of free favicon generator. I recommend one from dynamicdrive, because of its powerfull and easy to use generator.
  • Simply browse your image, and click “create icon” buton.
  • A preview of your generated favicon will shown. Click “download favicon” to download your favicon.ico.
  • Upload favicon.ico to the root folder of your site. Make sure to verify it by typing http://yoursite.com/favicon.ico in your browser.
  • Finally, in the head section of your page, anywhere between the <head> and </head>, insert this code :
  • <link rel=”shortcut icon” href=”/favicon.ico” />

  • Finish! Your website has a new favicon now. Note that your favicon may not appear immediately, usually takes a few minutes. Try to refresh your page, and clean your cache to make it sure.

Related posts:

  1. blog template tutorial create wordpress template create template photoshop create website templates
  2. Three major steps of a website creation
  3. How To Get Free Website Templates
  4. Find Duplicate Image Using Image Comparer
  5. The Correct HTML Tag for Image In Website
  6. Create Professional WordPress Themes With New Book
  7. Create Professional WordPress Themes With New Book
  8. Power That an Ecommerce Website Can Bring
  9. The Most Trusted Website Hosting Services
  10. How to Create Good Web Design?

4 Comments