A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is an icon associated with a particular website or webpage. A web designer can create such an icon and install it into a website (or webpage) by several means, and most graphical web browsers will then make use of it. Browsers that provide favicon support typically display a page's favicon in the browser's URL bar and next to the page's name in a list of bookmarks. Browsers that support a tabbed document interface typically show a page's favicon next to the page's title. The Microsoft Windows Shell uses favicons to represent "Internet shortcuts" to web pages.(Wikipedia)
Internet Explorer originally only used favicons for bookmarks (for instance MSIE 6.0), which created a minor privacy concern in that a site owner could tell how many people had bookmarked their site by checking the access logs to see how many people downloaded the favicon.ico file. This is becoming less of an issue since newer versions of Internet Explorer (e.g. 7.0) and most other browsers also display the favicon in the address bar on every visit.(Wikipedia)
If a picture is worth a thousand words, why don't u put your picture as a Favicon.
In this tutorial you will learn how to :
- Make a favicon image
- Make HTML code for a Favicon
- Put HTML code in your blog
- Create an image 16X16 pixels in size
- Save the image as an ICO file (named "favicon.ico", of course). to make ICO file easily, you can use online favicon generator. So many web host provide favicon generator, to find that web host just put "favicon generator" as keyword in search engines, or u can use this one favicongenerator
- If u use firefox browser u can save image as PNG or animated GIF too.
- Upload image to get URL
- <link rel="shortcut icon" href="http://sample.com/hotcoffee/favicon.ico"/> For ICO File
- <link href='http://sample.com/hotcoffee.gif' rel='icon' type='image/gif'/> For GIF File
- <link href='http://sample.com/hotcoffee.png' rel='icon' type='image/png'/> For PNG File
Note : Replace the red word with your URL Image
3. Put HTML code in your blog
- Sign in at blogger with your ID
- at dashboard click "layout"
- Choose "Edit HTML"
- Find <head> tag in HTML code
- Put the Favicon HTML code below <head> tag
- Here the example
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<link rel="shortcut icon" href="http://sample.com/hotcoffee/favicon.ico"/>
- Save your template
That's it... se you at next post c yaa
No comments:
Post a Comment