ChillsQuote of the Week

"Life is too short to be little."
~Disraeli

Friday, March 11, 2011

Create your own favicon

Favicon, a short form for favorite icon, is used in many professional websites as part of the branding process. Nonetheless, anybody can add a custom made favicon to their website to make the website or blog more personal. If you wonder what changes you could make to your blog, start by having a unique favicon.

Take blogger for example. Usually, an alphabet “B” in an orange background is the default favicon in blogger blogs. Look kinda boring after a while right?

blogger favicon

If you have a blog, this is what you might have in your tab up there. Not very interesting.

It is not difficult to come up with your own favicon and having the default one replaced.

cl favicon

Looking at this favicon here, though the favicon isn’t really satisfactory, still at least it’s something else. It’s a complete personalization. Now instead of a “B” I have a “CL” on a green background. This is just an example though as the favicon is totally up to your creativity.

There are a few simple steps to make ye own favicon.

Step 1 – Design your own favicon

Use whatever designing tool at your possession like Photoshop or even paint and save it as an image.

Step 2 – Save the image as a .ico file.

For this step there are some options available. You could download any icon software or you could take an easier path – converting the image into .ico file in some websites. If you like challengers and prefer the former, try googling iconart.

For the easier way, these are some websites that offer image to icon conversions.

Step 3 – Uploading your favicon into the internet.

After having an icon, you have to host the icon in the internet so that the favicon will load when someone views your blog/website.

To host your icon, you can either upload it to your site or host it in free image hosting sites like , and a whole lot of others.

After uploading it to the internet, simply paste this code in the html of your site before </head>.

<link href=”favicon.ico” rel=”shortcut icon” type=”image/x-icon” />

If you have a website, note that “favicon.ico” should be your file name. So if you file name is blog.ico then it should be (link href=”blog.ico”) instead of the one above.

If you hosted your icon in an image hosting site, your link href should be “http://blablablabla.ico”. Just copy paste the URL of your icon.

Have fun making your own favicon and enjoy the results almost instantaneously.

En passant, have you checked out the English pirate version of Facebook. Go give it a try. I bet you’ll be laughing your heads out cause it’s damn funny. Just scroll right down to the bottom of the facebook page and click on English(US) or whatever your default is to change it.

See ye later matey!

No comments:

Post a Comment