Giving your pages a bookmark icon.

Talk about HTML resources, styles etc.
Post Reply
User avatar
grelmar
Human Abacus
Posts: 474
Joined: Fri Dec 26, 2003 3:18 am
Location: Calgary, Alberta, Canada
Contact:

Giving your pages a bookmark icon.

Post by grelmar » Wed Jan 12, 2005 3:20 pm

We've all seen it on a ton of pages, including the GoStats main pages. When the page finishes rendering, up in the address bar, a little icon appears, and if you add that page to your bookmarks, the icon shows up. (This works in IE, Mozilla based browsers including FireFox, Opera, and prolly a bunch others I haven't checked recently).

Neato! But how do I do that?

Easier than you think

First step: Make the graphic.

The icon should be 16x16 pixels. If you use a larger graphic, some browsers will resize it, and some won't. In the end, they'll all end up showing a 16x16 pixel image, so might as well stick to that (Icons are made in default sizes of 16x16, 32x32, 48x48, and 64x64.)

Step two: convert the graphic to an icon file (extension .ico). Some graphics editors can do that automatically. Some can't. If yours can't, don't panic. Just save the file as an GIF or JPG image, and go to a reliable source of program downloads like Tucows or CNet. Look around for image converters, or even programs specifically designed to turn graphics into icon files. It shouldn't take long. On a random walk through Tucows last night, it took me under 5 minutes to find a shareware program that will do the trick.

NB: There are lots of freeware and shareware programs that will do this out there. If you only plan on doing this once, then that's all you need. Bu remember, most "shareware" programs expire after a certain number of days or uses, so only install the program once you've created the graphic you want to convert.

Step three: Ok, you have your icon created, now comes the fun part, adding it to your site. Wanna know the really cool part? It doesn't even involve the use of code. All you have to do is upload the icon to the root directory of your website, and name it "favicon.ico" - Browsers will then go looking for the "favicon" file when they visit your site.

Try it. It's an easy way to add a bit of "branding" to your site so that it will stand out a bit more in the bookmarks list.

User avatar
MutantCheese
web counter beginner
Posts: 3
Joined: Mon Jan 24, 2005 10:03 am
Location: New Orleans
Contact:

Post by MutantCheese » Mon Jan 24, 2005 10:10 am

You can also upload any image and this site will convert the image to a favicon in one click:

http://www.chami.com/html-kit/services/favicon/

mc Ÿ
"Behold the power of cheese"...MutantCheese.com

User avatar
JimBb
Deep Thought
Posts: 1964
Joined: Sun Nov 16, 2003 8:19 pm
Location: Dilbeek, Belgium
Contact:

Post by JimBb » Wed Jan 26, 2005 1:47 pm

You had linked to the "output" screen, I took the liberty of changing the URL so that it points to the place where people can upload their image.

Cool tool!

Jim

User avatar
MutantCheese
web counter beginner
Posts: 3
Joined: Mon Jan 24, 2005 10:03 am
Location: New Orleans
Contact:

Post by MutantCheese » Wed Jan 26, 2005 9:48 pm

Soory about that, it's the page I bookmarked, so I never noticed... :oops:

mc :twisted:
"Behold the power of cheese"...MutantCheese.com

User avatar
grelmar
Human Abacus
Posts: 474
Joined: Fri Dec 26, 2003 3:18 am
Location: Calgary, Alberta, Canada
Contact:

Post by grelmar » Thu Jan 27, 2005 11:47 am

Very definitely a cool tool. Nice to have access to a freebie for something most of us would use rarely, or only once.

Post Reply