Favicon ("favorites icon"), is an icon associated with a particular website or webpage that is displayed in the browser address bar next to a site's URL.
Favicon is a little icon, but plays a subtle and important role. It acts as a brand.
What Is It Exactly?
The BOB Favicon
Favicon is very familiar, which can be seen next to the Title of any CodeProject WebPage and some other places as described below.
Where this Favicon is Displayed?
It is displayed at three places.
- The URL in the address bar
- The websites name in the list of bookmarks
- In the browsers that support a new feature Tabbed Browsing (Tabbed browsing is a function of some Web Browsers that allow uses to surf and view multiple pages by loading the Websites into "tabbed" sections of one page, rather than multiple pages. This allows the user to view a selection of favorite sites in one window, view multiple search results at the same time, and would allow you to set several pages as your home page, rather than just one)
Using the Code
It is very simple and easy. Follow the steps described below.
Step 1: Go to some online Favicon Generator Website
I recommend Favicon Generator.
Step 2: Browse/Create Favicon for your Website
That would become your Website's brand image.
Step 3: Generate the Favicon and Download
Add it in your root directory and remember to rename it as sometimes it does not refresh itself if Internet Template is used.
Step 4: Add the Following Code inside head Section of Web Page
<link rel="shortcut icon"
href="http://www.codeproject.com/NAME of your FAVICON.ico" type="image/x-icon">
Put the above code in the
<head>.......</head> section of your webpages if Empty Template is used, else in the Layout Page for Internet template.
Points of Interest
While working on a demo, I saw a
Favicon in my root directory and got curious to know what is the use. I saw this when I used an Internet Template in
ASP.NET MVC4 not an Empty Template. Hope beginners like me get to know about this and use this with their Websites.
Give your Website a brand with these steps and enjoy.
- 05 March 2014 - First version