Web Design 12: Favicon

A favicon (short for Favorite icon) is a file containing a small 16×16 pixel icon, associated with a particular website. In the example, the Wikipedia website has a “W” favicon (circled in green); websites that do not have a favicon display have generic blank icon (circled in red).



  1. Convert any small PNG file (such as the University Logo) to ICO using Photoshop or an online converter such as ConvertICO.com.
  2. Rename the file to myicon.ico and upload the file to the root folder.
  3. Edit the HTML file and add the following code between the <head> tags:

<link rel=”shortcut icon” href=”http://example.com/myicon.ico” />