Favicon – It’s About Time!
Posted by Jon Lee in Site stuff, Web Development, tags: branding, favicon, HTMLI’ve been putting off making a favicon because I haven’t found anything I liked that could be fit into a 16×16 icon. So this weekend, I finally spent a little time to create a favicon for my site.
What is a favicon?
A favicon (short for “favorites icon”) is the little image that shows up beside your URL in the address bar, beside your site title in opened tabs and beside bookmarks of your page. Favicons are displayed in almost all browsers (Firefox, IE7, Safari and more).
In my opinion, a favicon is one of the most important things you can do to brand your site and make it memorable. Ideally, it is something that should be done before even launching the site so I’m kind of ashamed it took me over 3 months to get it up. Since the release of Internet Explorer 7, this icon is even more important since this means almost all users will have the capability of seeing it!
How do I make one?
It is essentially a 16×16 icon (.ico) file. Creating one yourself isn’t hard, but can be difficult if you don’t have the right programs. Luckily there are plenty of free favicon generators out there. All you have to do is to upload an appropiate image for them to resize! (I used DynamicDrive to make my favicon.)
Once you have the file, simply upload it to your website and add the following HTML tag to the <HEAD></HEAD> section of your page:
<link rel=”shortcut icon” href=”/favicon.ico” />
replacing /favicon.ico with the path to your own icon of course. A piece of cake!
More Options
Your favicon can also be animated! HTML-Kit offers animation and text-scrolling options. You’ll have to add an extra HTML tag to make it work. Here are some examples:
If you can’t come up with a good favicon of your own, Favicon.co.uk has a gallery for some inspiration.
What do you think of my favicon? Anyone know what it is? (Aside from the fact that it’s a “J” for Jon Lee) 
Popularity: 2% [?]
Entries (RSS)