Make a custom favicon for your blog!
Do you have a favicon? Do you even know what a favicon is? Read on. At the end, you will know it all!
A favicon (short for favorites icon) is a 16×16 pixel square icon associated with a particular website or webpage.
From Wikpedia
I'm going to show you the easy way to make one. There is one program that I highly suggest downloading. It is free, and you can use it for all your quick photo needs. It is IrfanView. I use this program as my default photoviewer on my computer simply because it is so quick and great to use.
When I do a custom favicon, I generally use part of my blog header. Take a look at SeaSide Sharon and Buttermilk Clouds. Do you see my favicon in the address bar? And in Firefox, the favicon is also displayed on the tab. Each of those favicons were taken from my header image.
Here is how to do it:
- Open your blog so you can see your header (or the part of you blog you wish to make a favicon with)
- On your keyboard, click the PrtSc Sys Rq button (top row, third from the right)
- Open IrfanView
- Click Edit | Paste
- Placed your cursor in the header and select a 16x16 pixel area
- Click Edit | Crop Selection
- Click File | Save As | ICO - Windows Icon
Now you have a little custom favicon! To install your favicon, follow the instructions on this post Adding a Favicon. Since there was some sort of problem with favicons on blogger, I had to find a fix. So be sure to follow the link at the end of that post for a easy fix.
EDIT: please post a link to your blog with your new favicon so everyone can see!!!!
337 Comments:
You have blend of various topics. And it looks like you have knowledge of all of them.
Very interesting, I never really new how to make a favicon.
Here you have a very nice tutorial regarding this topic. Before this I was using iconj.com for this purpose that is almost closed for this purpose and now I shall follow you. Thanks
I'd like to try this favicon on my blog. Very interesting about this post.
Thanks so much Annie! I always wondered what you called those thingamabobs and as soon as I found out you could change them I was all in! I found that personal pics that are lighter work best because of the small size. Otherwise you don't know what you are looking at.
But anyway, I followed your directions and it worked instantly. Thanks again!
Useful article. A favicon makes a website to be more interesting. I'll add a favicon to my website soon. Thanks!
Good advice for Blogger users to get a custom favicon. I use Wordpress myself, but have used Blogger in the past - good tips like this really help bring Blogger up to speed.
Looking for a blog to guest post on? Visit http://blogswithwings.com and contact me there. I love guest posters.
Thanx much for this post. I ve been looking for the solution to add my custom fevicons to my sites. IrfanView is good.
Great article. It amazes me how simple it is to create a favicon. It baffles me why others are not using this "branding" to bring additional recognition to their websites.
nice post.thank you for this nice blogu.
Can u tell me about your label cloud.In your blog(BlogU) 'when we click any one the label then a page opens with the post titles only and the font size and color of that titles are different than original post title' how u changed the posts title's font size and how u removed the border of the posts..??can u plz post an article related to my doubt or email me at suree.onweb@gmail.com
see my blog http://j2schools.blogspot.com/ i want to remove borders of the titles present in the label page..
Thanks for the info. A favicon is a surprisingly important part of the website...image wise, I think it is essential.
Woww thank's BlogU it's works, now my blog have fav icon, here my blog Advance News & Technology Information..
Awesome! Thanks! I've been looking for a good set of instructions on how to do this! Great post and nice and easy instructions to follow!
Thank you for the information
I usually use favicon dot cc to generete favicons for my websites
Cool!That is really a big help for people like me! Thanks for the info, I will surely try this on.
Wow, very nice tutorial. I always have done in a much complicated way.
True story, I did like you said :)
Thank you for the instruction for how to custom a favicon. Using a favicon is a good way to make your Blog a little more noticable. It can make the Blog more remeberable. I'll sure use it!
Thanks for advice))))
Creating an animated favicon can be tricky sometimes though, hehe
Good article.
favicons should be built into dreamweaver! awesome tutorial!
Favicon although not that important can still be a good factor to gather traffic for your site.
Favicon is a very neat logo app you can use to brand your website or blog. The logo will appear on the address bar of browsers which I think is an awesome way for people to remember your brand.
Good post..simply tell us the best way to do blogging, looking forward to try this one on my blog..thank you for this article...
This helps me a lot!
work from home
Easy to follow.. good tutorial.. thanx for sharing :)
OH thank
I want to make Favicon Easy For this
Thank bloggeruniversity.blogspot.com
I wish all online tutorials were like this. Short, sweet, consise and pictures of how things should look made it so easy to follow along.
wicked post thanks alot.
from
Trysordy Crafts
nice post my friend...it's really helpfull for me thanks a lot
Annie, I'm amazed at how few websites use this technique. A favicon to me adds a touch of professionalism to a site or blog. Its one of the "little things" you can do to make your site better. Thanks for the "how-to".
This was really a knowledgeable post...Expecting more posts like this !
We can do number of things to our favicon before downloading it to our system.
Thank you for telling me how to add the picture to the favorites was woundering how people did that
I do love blogging and putting pictures in my blogs is current pastime. I am currently interested on how to make fast photo editing and about making favorite icons. Thanks for sharing this information it will it's a great help for me.
Thanks for this tips, do you know how to cufon like you) with a plugin ?
Thanks for the awesome post and the cool info :)
For those whop are a bit to lazy(or preoccupied) to make a custom fav icon, there are plenty to choose from. All it takes is a google search with the "favicon collection" query. Having a custom favicon(even if it wasn't made by you personally) will show some dedication and catch a glance sometimes.
Thanks, very useful tip, I wonder if there's a similar program for Mac though.
Until I read your post I was not even quite what a favicon was. Now that I've put the two and two together I look forward to customizing my blog. I really appreciate the straight forward step-by-step tutorial. Also, I find myself using Irfanview exclusively now instead of Windows media player and picture viewer. Thanks.
Favicon is somewhat cute for if you've had it on your blog, once loaded you can see small icon on it..yet little though fascinating enough to know that you have loaded your page just because of that tiny trademark for your site.
I love the favicon in this post, but do I have to download Irfanview? Is it free? Thanks.
Fav Icons are a small details that make your site worth visiting again. Its always in my list of things to do when starting up a new project
There was a time that I opened several websites and all of them have Favicon. I was amazed! I enjoyed looking all the tabs on my Firefox web browser. And what I did, I compared which among them has the best favicon.
Favicon is a very favorable icon! :)
Has gone to do favicon.Спасибо for the information
you can upload the favicons at http://imgclub.org
Really powerful image hosting website.
This is helpful. I never knew about Favicons were created. I notice some of my websites have one, and I didn't make one. I guess it came with the theme.
Thanks for this! I have always used http://www.chami.com/html-kit/services/favicon/ for this but your guide shows me how to do it manually. Thanks again.
Good advise, thank you! Do you know how to shrink a picture (or better say a logo) down to 16x16 pixels?
Favicon is the symbol of the subject,which represent your blog theme and nature.Your post has useful information for the users.
@Melamin Geschirr , IrfanView has a feature that allows you to resize an image. Just put in the pixels you want.
I really have wanted to do a favico for a while now but never got around to it. This makes it look easy. Thank you very much.
i was in search of such tool the help me in creating FAVICON at last i found your post thanks a lot for the info
This is obliging. I never knew about Favicons were shaped. I see some of my websites have one, and I didn't make one. I deduction it came with the theme.
Iraqi Dinar
Thank you for telling me how to add the picture to the favorites was woundering how people did that
Useful app for bloggers and site owners who wants to have a custom made icon in a jiffy1
I finally found how to make a favicon.
Thanks a lot.
I read somewhere that having a favicon for your blog increases the page speed of the website and in turn affects the google crawl rate as well.
Favicons are a royal pain in the behind. They just don't tend to stick in either IE or Firefox. Sure, they look schmick against your domain name, but hey, don't count your chickens until they hatch.
Great tip however we have another one that may help!
1) Create a 16 x 16 pixel image in MS Paint
2) Save it as a BMP file
3) In Windows Explorer rename as a .ico file
Worked a treat for us :)
I just started my blog, this post is going to help me alot!
Thx
Thanks so much for this! I knew what they were, I see them all the time but I never knew they had a name and never knew how easy they were to do. I'm off to make me some favicons!
Thanks for your nice post.I have visited lot of site but yours is very nice to read.
I read different type of article but yours is very nice from others.Thanks for that.I read your article about"Make a custom favicon for your blog!"Good job keep it up..
erudition
Hi,
This is great advice! In the past, I haven't really used favicons on my site.
Thanks,
Jake Ruston.
This information is very useful. Certainly help me a lot. Thanks!
It doesn't need to be 16x16. Larger ones will scale down. For speed and saving bandwidth, that size is obviously best, though.
This is 32^2, for example:
http://www.apple.com/favicon.ico
Thanks for share custom favicon information, I have created few favicon for my websites.
Gracias buen aporte.
Thanks
Very good article, will be creating a favicon for my blog (PS4 Forums) very shortly.
Great Post... I just started blogging myself, and am amazed at how fun and helpful it really is.
Joe
MLM Training Blog
Thanks for the blog post. I love what you're doing here.
Thanks again,
Joe
Cheers for the advice. Loved the tip from Dance Singles!!
Very intresting. Thank you very much.
I always know just where to look when I need instructions and advice. Your blog is awesome and I thank you for all your help.
I just setup a favicon on my blog shop and it looks great! Thanks
I have favicon, I have favicon! Thank you soo much! I love step by step directions!
Hey I have just setup a favicon on my blog as well. Very nice post indeed, thanks!
I sure wish you would consider posting the date of yoru posts so whenI go back I know what is relevant and what is out of date. I found some instructions posted that don't work with the new template designer and if I had seen the date of the post I would have known not to bother trying it. Thanks.
@Shabby Cottage Studio, I don't date my posts because the posts are still relevant. Some posts are for 'classic' blogger and are tagged as such. Many of my readers, including myself, still use classic blogger templates.
Sorry if it is confusing for you.
thanks for the post i love this blog..... thanks again
Giddy up will give this a crack - thanks for the tips 16x16 got it - Yippee its the weekend
I was wondering how to add a custom icon to my pages. Thanks.
Floodtechs - Water Damage Restoration - Wordpress Site
Thanks for taking the time to discuss this, I feel strongly regarding it and love learning additional on this topic. If doable, as you gain expertise, would you mind updating your blog with additional info? It's very helpful for me.
It really is amazing how many web sites still do not have proper favicons... I mean, really... it's 2010! LOL.
Good post!
Great info! I made a favicon for my Lexington, KY Massage Therapy website and I love it. Thanks for all the great blog posts!
Corey
Very interesting - Have yet to try it, but when I get back into the office tomorrow im going to screw around with it a bit :)
This is very helpful. I am just getting back into blogging/websites and I have forgotten to put a favicon on my documentary site. Is there a way to set favicons for individual pages? For example, on my Jesus Camp page?
Time to make a favicon for my blog
Thank you very much! adding it!
What a good post! I love it!
So that's how people create favicon, thanks for sharing such knowledge. God bless you and keep on sharing.
I think you can also download a free plug-in for Photoshop (if you have it) that will create ICO files for you. Quite convenient.
Oh, I have read Your post and immediately started doing this written above!
Now I got 2 my sites with their original "faces"! :)
i never used favicon on my blog.. glad you shared this article :) thanks
Interesting what you've done here!You are very creative.And the steps are related so that all people can understand.It is more useful for people who have their own blog.
I will try it too!Thanks!
stupid favicon eluded me for months, one of the coders figured it out within min, I wish this post was here 5 years ago! lol
I have tried one tutorial before but it is no longer working. I will try out your tutorial and see if it works. Thanks!
I wish I had this about 5 days ago when I was trying to figure out how to make a Favicon. I ended up finding and using the plug-in which is wicked easy. I just found your blog and I really like it, gonna RSS it up. Thanks!
Thanks for the tips. I've been wondering how to do that for my own blog for sometime and couldn't figure it out.
Great tip! This is a very simple and effective way to increase the identity of your website. It's like a soft version of a logo. I like it!
I've always wanted to make a favicon but didn't know how thanks!
thanks for the info and explanation provided
Thanks for the guide! I'll be using to create a favicon myself!
Great tutorial. I'm going to implement it for my new site wordpressmembershipplugins.com!
Nice article, thanks for sharing.
I never even knew what a favicon was! Thanks
Design is important. Try to avoid the box-look for the favicon. Also, you can spice it up by animating it. You’ll need special code for your Head section. That’s because the animated favicon will be active on Netscape and Firefox, but Internet Explorer wants that static .ico file.
Thank you for your post. It really helps as it adds additional customization.
Thanks for your Post, i will use it on my blog
oh yeap, it's accuracy what i am finding. I've always wanted to make a favicon but didn't know how. Thanks thanks & thanks
Am I stupid if I didn't know what a favicon was? How does the name come about?
Found the blog in my bookmarks from ages ago. Haven't been across for a while and had forgotten what a wonder resource you have here. Going to give this a go at the weekend.
Nice. Glad to see I'm not the only one that LOVES irfanview. I use it to make all my favicons. I can't believe how many people don't take the time to make favicons for their sites. It really helps with tabbed browsing too.
Great info ! Thank you for sharing.
Thank you for this, I was able to creat a custom favicon for my hookah reviews site - www.hookahreviews.net
Worked like a charm...thanks so much!
Wow that worked like a charm! Thank you for such an easy to ready guide on adding a favicon to your site. it really helps brand your site and distinguish it from the others
I also have a different style. I just resize an image that I want then I install a Wordpress Plug-in. Then you can already install your saved icon. You can check my site. I used my own photo for this.
Great Info. I like it..
Never heard of favicon. after reading this blog i found it very interesting and very informative.
Thanks for sharing..
Thanks for the post, it was so useful for me
Super article! I've been using irfanview for a while now. Good to know it has other uses :)
Thanks, i've added it to my free iphone 4 website. I can't thank you enough cheers!
Brilliant i didn't know you can edit your own icon, I've always wondered how bigger sites have done this, thought it was through a special cPanel type thing. brill, lol.
Wow... thanks for the tip. Truly helpful
I see I lot of blog use this favicons for ads but i'dont love it
The information is really a good one. i like the way you use for the blog article to present the quality and effective thoughts.
Could you tell me how to make favicon in wordpress? Pretty good post. I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts. Any way I'll be subscribing to your feed and I hope you post again soon
A favicon is like a brand of the website. To give your blog a professional look, it is essential.
Nice info here. Though I would like to know about some tricks about blogspot.
We used irfanview for all our our favicon generation - it rocks... It would be good if you could change the favicon for individual pages (for example on our radio release keys or ISO leads page)... favicons look great - good post!
I wish all online tutorials were like this. Short, simple, concise and pictures of how things should look made it so easy to follow along.
now if i only could get a step by step on what to right lol
I've used this in several of my sites, it really helps set you apart!
Interesting info.
There are several web sites where generate favicons online such as genfavicon.com. It could be useful to generate a favicon easy and fast.
Cool, didn't realise you could do that! Great post!
THANK YOU FOR THIS POST! I've been searching for a solid favicon tutorial for the past hour and this is the first one that worked!
This looks like a cool feature for my blog. Gonna try it out. Thanks for the tutorial.
Thank you very much for this great post.
So true. Favicon makes your site look more reliable.
I remember the times when I would draw a favicon in MS Paint. Now I just import a PNG file into one of those favicon generators.
Hello Annie,
first of all a greeting to you after St.Augustine. I would like to thank you you briefly for the executions about Favicon. Thus I learn to in addition-get also again with IrfanView.
I wait already for a new Posting of you…
Best regards of Jenny W.
This looks very interesting and thanks for explaining in a simple and systematic way.
With FavIcon, website or a blog looks more professional and great. Bu I always use iconj.com for this purpose because they have a lot of great icons.
Wow, so simply. I would like to give a try.Thank you for informative information. please keep it up.
Good advice for Blogger users to get a custom favicon. I use Wordpress myself, but have used Blogger in the past - good tips like this really help bring Blogger up to speed.
wow very interesting share i was finding it for many days thanks for share about it now i add my own blog favicon icon on browser tab.
thanks.
I did not leave even a single word of you post. You have huge knowledge.
Thanks for expanding my horizon.
Very interesting share.I was searching about how to make a favicon and i have got this.Thanks
Thanks for the tips, I was just wondering how to do that for my own blog I just started.
Thanks for the tutorial, you can check out the favicon I made on my website. I love it!
I have used fevicons previously and it give quite professional look to the site with your own customized fevicon, its like having professional logo for your site.
Thanks for sharing this helpful, interesting post and providing good insight for fevicons.
Tnx, importont information for me^)
Adding a favicon to our Scentsy site was one of my favorite parts of the design process!
Thank you for this post, is very usefull.
Thank you for sharing this useful tool! I can't wait to try it out.
Thanks for your post. Added some Icons to my Site!
Thanks for sharing the information, annie. i really did not know how to make my very own favicon!
Thanks for sharing how to make custom fav icon for a website
Hi, thanks for the sharing. nice article must say. but i have some problem. So i am now sharing this with all of you....
how could i make favicon for my site?
s that essential? i didn't heard about favicon.please advice me.
dude great post.thanks a lot.i will try it on my blog.i am really happy that now i know how to create favicon for my blog.thanks again.have a nice day.
Oooohh... I was always wondering how to put those little pictures on the tabs and address bars. But after uploading it how do we put it on? Is there settings or options in the site to do this?
This is really a great post. The fact that it is a big help for all, especially those who loved and is fun of blogging. Thank you for the tips!
A lot of people or bloggers don't actually know what a favicon is and you actually did a great job in describing and teaching us how to make a favicon. Keep up the good work!
I'd like to try this favicon on my blog. Very interesting about this post.
Nice Work.
http://www.meratvforum.com
Wow! I haven't have any favicon. But after I read this article I can have one. Thanks.
hello.
good job.
i try to use this program to create my icon
I love Fav Icons. It was one of the first things I learnt to do when I started webpage design years ago. There's so cute. I like the heart one :) Nicely done. Adam
Thanks for this post. I've been thinking of using something personal for my favicon. I now know how to go about it.
Hello,
Really helpful and great information!
Thank you!
All The Best!
Does having a custom favicon have any impact on search engine rankings, or is it just to give readers a custom feel?
Really nice info, it will be really helpful to make my new favicon.
Thanks for this information,, I really don't know how to make a custom icon until I read this post..
Christian Videos Community
Sweet! Thanks for sharing! I was searching google for a way to add the favicon and glad I found you.
Thanks :)
I've never heard of this favicon before and I'm really interested about this. It seems nice that you website or blogs can have this pic on the tab or address bar cause it can also serve as their logo. Thanks for this great blog.
thank you very much for the help, as has long sought to do this,
I've also seen some favicon is an animation, it must be the same but with an animation .gif.
Thanks for this important information.
Lukas
Weight Loss
This is really a great post. The fact that it is a big help for everybody, especially those who loved and is fun of blogging. I will make sure to apply what i have learned from your post. Thank you for the tips!
Very interesting post. Now I know what a favicon is.
Thanks! I'm glad I found this post. I've wondered how to create a favicon before but now I'm actually gonna make one! ;)
Hi thanks for this. I wondered what these were as I think they help to make a site look more professional. Thanks for the info!
Very useful post indeed. I always wanted my own favicon!
Thank you a lot of interesting information
Thank you for this trick. Going to share this with others
What do we get from favivon, please explain the concept as I am new to this.
Thanks.
very nice tutorial thanks
this tutorial is really helpfu. thanks for sharing and pointing it out
very nice post, I've never seen such a good post that you make. this post is very useful for me. thanks for the information that you have created.
gr8.. thanks for the very nice tutorial :)
Thanks for your post. Added some Icons to my Site! i will try it on my blog, interesting post and providing good insight for fevicons.
A favicon makes your website more professional! Thanks!
very helpful indeed! thanks for allowing do follow! if you comment on my page i'll allow it back too ;)
cheers!
wow - never even knew what a favicon was before this. I'm going to install it on my site, now im aware of it, every site i vist seems to have one!
this is really interesting icon! many thanks for willing to share it , short & simple!
noticed you are a getty artist too, hows ur sales over there?
@yu liang, I'm not getting rich, that's for sure. It is picking up. But each month is different. I was just thrilled to be added to the Getty Images collection!!
Thats Nice . Very Good Tutorial
Keep up Nice Work.
===============================
http://smsfunbook.blogspot.com/
In my opinion favicon makes a website more professional.
I have always wanted to know how to do this. Thank you so much for sharing!