Free Favicon - The Blog

The Gremlins Did It!

Free Favicon — Mon, 24 Nov 2008 07:11:44 +0000

Well things had been running smoothly until we noticed that for some reason the favicon.ico file was not properly being created. You might have noticed that your favicon.ico file had a file size of 0kb. Opps, sorry about that. For some reason the code that created the favicon.ico file started to malfunction. I think the gremlins did it. It appears to be working properly again, but if anyone has a problem with 0kb files being created let me know and I will take a look and see what the gremlins were up to on the code.

How to Add Your Favicon to Blogger Update

Free Favicon — Fri, 21 Nov 2008 16:00:53 +0000

Google/Blogger broke the instructions in the previous post about how to add your own favicon to a blogspot blog by adding some HTML that referenced the Blogger.com favicon instead. Fortunately the fix for this is relatively simple. Here is what has happened.

Blogger.com has added their own HTML to the templates near the top referencing their favicon. It looks like this if you look at the source code.

favicon.ico’ rel=’icon’ type=’image/vnd.microsoft.icon’/>

The instructions on How to Add Your Favicon to Blogger in step three says to added your own HTML code referencing your favicon right below the tag. The web browser however will use the last reference so the Blogger.com favicon code was coming later on. The fix for this is to place your favicon code just before the closing tag that looks like this: .

Your code referencing your custom favicon then overrides the Google/Blogger.com code for the favicon and your custom favicon will return.

I tested this on the Free Favicon Blogspot blog and the favicon has returned. Give it a try on your Blogspot blog and let me know if it works.

Matt Cutts Gets a New Favicon

Free Favicon — Sat, 20 Sep 2008 16:10:39 +0000

This might not be as big of news as Google getting a new favicon, but Matt Cutts, the head of Google’s Google’s Webspam team decided to change his favicon. His previous one was well, interesting. I grabbed this snapshot of it from the Internet Wayback Machine from December 2006, so it might not be the one he was using just before this recent change.

As you can see from this screenshot he has gone with a favicon that uses his initials, and a green that matches the green from his blog. It is nice to see he made a change and the new favicon at least has some meaning to his website, so if you bookmark it you have an idea of who’s website you might be visiting.

If you like to keep up on Google Matt Cutts blog is a good source of information about Google, although it is not an official source of Google news, he often talks about many of the different Google products and how to use them better.

Blogger Favicon Showdown

Free Favicon — Fri, 25 Jul 2008 14:00:57 +0000

I wanted to do something fun this week and let you decide which popular blogger has the best favicon.

Shoemoney

Shoemoney’s favicon is a scaled down version of his logo and it shows up really well considering the small size of the favicon. It certainly helps to brand his blog.

Problogger

Problogger’s favicon changed when he got the blog design redone last year. The new logo and favicon complement each other and help with the his branding. You can easily see the P and the Ubuntu style circle and dots on your address bar or tabs when you are on the Problogger site making it easy to find in the tabs when you are looking for it.

John Chow

John Chow’s favicon is a picture of half of his face. Considering the small size and how little space there is the favicon does appear to resemble him. I would guess there was a little Photoshop work done to make his favicon appear that clear but they did a good job. I am a little surprised it does not match his blog more, but in many ways his face is his logo.

Daily Blog Tips

Daniel Scocco runs Daily Blog Tips a popular blogging tips blog. The Daily Blog Tips favicon clearly draws its inspiration from their blog name taking out the DBT. Considering the small space it works not to bad, although it does appear to be a little blurry to me.

Now it is your turn. Vote in our poll and help determine which popular blogger has the best favicon!

Which blogger has the best favicon?

Defender of the Favicon!

Free Favicon — Fri, 18 Jul 2008 14:00:46 +0000

favicons have gone from being just a graphic or an animated graphic to full fledged games thanks to Mathieu Henri who has created “Defender of the Favicon“. This favicon is a little different than the ones you will find here at FreeFavicon.com. The favicon is actually a Javascript that dynamically updates the favicon. It is playable but not viewable in all browsers. The best browsers to try the favicon game in are Opera 9.5, Opera 9.2 and FireFox 2. I was using Firefox 3 and it was working alright, other than the fact that I suck at Defender.

I was trying the site out in Firefox 3 on Ubuntu and it appeared to run fine. I also tried it on Firefox 2 on a Windows XP machine and it was pretty much identical. I could only ever play in the favicon. The instructions say that if you press Enter it should open in a canvas display but I could not get that to work on either machine.

Here is a short video of me trying to play Defender of the Favicon. Not easy to do but it is a creative use of the space. Perhaps a different game would be eaiser to play as a favicon. Pac-Man comes to mind or even Asteroids maybe.

This is a unique approach to creating a favicon and deserves to be recognized this week as the favicon of the week!

Expedia.ca Favicon

Free Favicon — Fri, 11 Jul 2008 14:30:25 +0000

Yesterday I talked about how Hotels.com did not even bother trying to create a favicon for their website, which is a real shame. While I was doing research for hotels for my holiday I also spent time on Expedia.ca. They have a nice site and they have a great little favicon for their site. I can always find their site fast in my bookmarks because of that little airplane favicon.

That is a great favicon that matches their logo and branding on their website and t makes it easy for me to find their bookmark when I am looking for them. Good job Expedia.ca on an easy to recognize favicon!

Hotels.com Needs a Favicon

Free Favicon — Thu, 10 Jul 2008 16:30:13 +0000

You might have noticed there have been no posts for a week or so. I was on a well deserved holiday. I had someone checking in on the site here but I did not get around to writing any posts to publish while I was away. Life just got to busy with holiday plans and booking hotels and packing. you know how it is I am sure. In making my travel plans I spent a lot of time using my favorite site for doing research on hotels, aptly named Hotels.com.

They recently did some work to their website and changed their logo and some of the colors. The site looks good but I was surprised that they have not taken the time to create a favicon. You would think that someone in their branding department would have thought of that little detail. Apparently not. I like the new logo and they have a great little icon around the “o” that looks to me like an elevator button. I thought it would make a great little favicon for their website.

Here is what I thought they could use as their favicon. It draws on their great new logo and fits the new design they have created for their site. Another idea I had was to use just the “h” with the background color but I never did anything with that idea.

What do you think? Do you think Hotels.com could use a favicon on their website?

Favicon Inspiration

Free Favicon — Wed, 25 Jun 2008 04:10:18 +0000

I was going to post a tutorial today about how to add your own favicon to a WordPress.com blog, but I was not quite done it when I saw this great post over at Smashing Magazine today. Favicon Episode 7 highlights some great examples of favicons that you can find on the Internet. If you are looking for some inspiration for your favicon you will certainly find some there to help you create your own for your website or blog. Of course once you design your favicon in your favorite graphic editor you can come here to Free Favicon to generate the ico file (hint hint). Don’t forget to check out some of the other posts they have on favicons as well. They have lots to inspire you!

Mozilla.com Favicon

Free Favicon — Fri, 20 Jun 2008 14:30:49 +0000

With the historic launch of Firefox 3 this week and a huge response to their download day I thought it was only appropriate to take a look at the great favicon of the home of Firefox, Mozilla.com.

The Mozilla.com favicon is a godzilla like creature, which does not seem to make a lot of sense, you would think it would be the Firefox logo or Thunderbird logo. If you read some of the history about how Mozilla.com got started and about the mascot the favicon makes perfect sense.

What I like best about the Mozilla.com favicon is how crisp and clear it is. It is easy to recognize as a godzilla type of creature. Hard to do in only a 16×16 space.

Hats off to Mozilla.com for a great favicon and congratulations on the success of the Firefox 3 download day! I know I have been enjoying Firefox 3!

How to Add Your Favicon to Blogger

Free Favicon — Tue, 17 Jun 2008 14:00:25 +0000

Update: These instructions do not seem to work anymore thanks to Google/Blogger changing something. I’ll post an update with new instructions if I find a way to fix it.
Update #2: Simple fix to this problem. The instructions have been updated in step three. Hopefully that will get it working for many of you again.

Blogger.com is one of the most popular blogging platforms on the Internet, yet if you have a blog with them you are often stuck with the default Blogger.com favicon. Hard to brand your blog with your own personal touch when you have the Blogger.com favicon on the address bar. If people bookmark your blog they won’t see your favicon and might quickly forget about your website. There is no reason why you can’t change the favicon on your Blogger.com blog to one of your own design. You just need to follow these easy steps and soon your Blogger.com blog will sport your great new custom made favicon.

First thing you need to do is create your own custom made favicon. In this case you do not have to use an image to favicon generator, but your image should be either a .gif or a .png. In you example we are going to use a .png file. If you are not sure what kind of image to use browse through some of the free favicons that we offer, perhaps there will be one there that you would like to use. If you do decide to use one of the many favicons we have to offer don’t click “Download this favicon” because that will give you a file in the Windows .ico format. Instead right click on the image of the and choose “Save Picture As”.
After you have the image you would like to use as your favicon, goto your Blogger.com blog and create a new post. It does not matter what you call it since you don’t need to publish it. Once you have created a new post use the image upload button to upload your favicon to your Blogger.com blog.

Once you have uploaded the image, you will need to switch to “Edit HTML” mode if you are using the “Compose” mode. Once you are looking at the HTML you will see something like this:
. You need to highlight and copy the part in quotes right after src. In this case it would be: http://bp0.blogger.com/_7rflRHkQmUU/SFc_ZW22lcI/AAAAAAAAASA/Y99-skckaeM/s400/favicon.png. You should paste it into Notepad or another text editor. You don’t want to lose this and you will be closing the Blogger.com editing window next.
Once you have the location of the image you uploaded copied, you can click on the Layout tab of your Blogger.com blog. Once you are at the Layout, you need to click “Edit HTML” Look in the HTML for a tag that says and right ~~below~~ above it paste:

Once you have those lines pasted into the template, copy the src of the image you want to use as you favicon that you uploaded earlier and paste it into the two lines you just added where the href=” is. In our case it looks like this:
Click save template and your Blogger.com should now have your fancy new custom favicon showing on the address bar when you visit your blog.

If you want to see how we did it take a look at our Blogger.com Free Favicon blog where we added our great favicon.

You can use other free hosting services to host your custom favicon, but you don’t want to use an image hosting service that deletes images after so many days. Using Blogger.com to host the images works well, but you could also use Google Page Creator, or even your Flickr account.

Have fun adding your custom favicon to your Blogger.com blog!

CBC.ca

Free Favicon — Fri, 13 Jun 2008 14:30:06 +0000

One of the regular features we are going to have here on the Free favicon blog is a look at some of the great favicons that you can find inspirations from on the Internet. Creating a great favicon can be a challanging task, the 16×16 pixel space does not give you a lot of room for adding detail, shadows, and bevels tend to disappear or become blurs. Faces usually turn into blobs, and logos can turn into an unrecognizable mess.

There are some logos that have survived the conversion down to favicon size well and this week we would like to highlight the great favicon of the Canadian Broadcasting Corporation (CBC). There current logo works very well as a favicon and goes a long way to help brand their website with viewers who are accustomed to seeing the logo on television. Accorinding to Wikipedia the current logo has been in use since 1992, and was simplified from earlier versions of the logo. It is that simplified version of the logo that makes it work. If they were still trying to use the more complex logos that are listed at Wikipedia they might have ended up with a favicon that was just an unrecognizable mess.

Hats off to the CBC for a great favicon from their logo!

Design Google’s Favicon!

Free Favicon — Tue, 10 Jun 2008 04:00:34 +0000

It has been big news all around the web, Google changed its favicon from the upper case G that people recognized, to a new lower case g that has caught many people by surprise. The new Google favicon is not the last and final version yet and there will be more new favicons to come. Google’s official blog talks about how they have come up with the new favicon and how it is part of several new favicons that they are changing.

It sounds like Google tested 300 or so different versions of favicons before choosing the lower case g that we see now. If you think you can do better make sure you submit your favicon creation to them. If they choose your favicon design you could become famous overnight, if you are not already famous. Go get those ideas together and blow Google’s socks off with a great favicon design.

You can also read about this over at TechCrunch: The Story Behind Google’s New Favicon.

Free Favicon - The Blog

Free Favicon — Sun, 08 Jun 2008 03:00:45 +0000

Welcome to the Free favicon blog! Here we will highlight different tutorials on how to create a great looking favicon for your website, how to add it to your website, talk and highlight great looking favicons from around the Internet and most importantly we plan on allowing you to show off your great favicon. We are stll dusting around here so there is sure to be changes in the coming days and weeks as we get things in order, but feel free to subscribe to keep up with the latest about favicons.

favicons have become more than just a 16 x 16 pixel image in your web browser of your favourite website, they have become branding and marketing symbols that help people identify with your website. This can be seen most recently with Google’s changing of their favicon from the classic capital G to the new lower case g. Google has made small changes to their homepage over the years, but the change to their favicon has people talking. Google’s favicon has become their brand. There has even been rumors that Google might be looking at changing their logo and the favicon change was the first of a series of changes. What ever might happen it is clear that Google favicon equals their brand on the Internet.

All the more reason you need to find and create that perfect favicon for your website.