ArtsAutosBooksBusinessEducationEntertainmentFamilyFashionFoodGamesGenderHealthHolidaysHomeHubPagesPersonal FinancePetsPoliticsReligionSportsTechnologyTravel

DIY Favicons from Clipart | How To Add It To Your Website | Tutorial

Updated on April 12, 2016
Make Favicons from Clipart
Make Favicons from Clipart | Source

How To Make Favicons from Clipart. How To Add It To Your Website.

Everyone needs to have a special icon for their website. Favicon ( favorite icon) is an image which shows up next to your website address. We all know the Google favicon we see it all the time. I wish we could use our own on HubPages, but we can't. HubPages favicon is their big black H you see in their web address. A web address is called a URL.

If you have your own website you should have a favicon. A favicon shows up better in favorites and you’re more likely to get people coming back to your website. If someone has saved your site in their favorites, once they go into their favorites they will see your favicon right away and more likely to go back to your site. They’re easy to create. Just upload your gif image to the website listed below and turn them into favicons. Your gif needs to be small I use an 81 width by 70 height. If you have an image you want to use make it smaller by using a program like Paint Shop Pro or Photoshop.


<link rel="shortcuticon"href="http://hubpages.com/favicon.ico"mce_href="http://hubpages.com/redress.ico"/></link>

How to put the Favicon on your website.

The first thing you have to do is upload the favicon to your web server like you would do with any image.

On the right is how you put the favicon on your website once you have made it. We're just pretending you’re placing one on HubPages. Place it between the <head> and </head> on your site.

Let's say you’re using red dress (redress) it would be written as shown to the right in the blue box.

Favicons will often disappear, more so in Internet Explorer than in Chrome or Safari. Clear browser's cache and make sure a check is in browsing history and refresh website.

Here are some images you can use to make favicons

Click thumbnail to view full-size

How to save an image.

To save an image:

Right click on each image and click save pictures as. Once you do that save to a folder you have created for images or clipart.

You can make a favicon by using one of the images I have on this hub.

If you go to clipart sites you can find many free images you can use as a favicon. Just remember they have to be resized and saved as a gif, jpg, png, and bmp before being turned into a favicon. Once they are a favicon save them into a folder called favicon.

I hope I have explained this so that it can be understood.

Samples

This is a sample of what a favicon would look like if used on your website.

The pie is from an old recipe site of mine. You can really use just about anything you want to make a favicon. Some will show up just great and others won't look as good. Play around with it until you get what you want.

Make Favicons from Clipart
Make Favicons from Clipart | Source
Source

Check out more of my hubs with information on some things you can do with Paint Shop Pro.

If you can make tubes you can make clipart from them to use as a favicon.

There are many different places to go to make a favicon. I happen to like Dynamic Drive. Another site for making a favicon is listed below. Hope this hub helps you with making your favicon.

http://www.favicongenerator.com/

Source

Copyright © 2015 moonlakehubpage.com

How To Make Favicons from Clipart

Comments

    0 of 8192 characters used
    Post Comment

    • moonlake profile image
      Author

      moonlake 3 years ago from America

      CraftytotheCore, Thank you and thanks for stopping by.

    • CraftytotheCore profile image

      CraftytotheCore 3 years ago

      Very nice tutorial. This is very helpful.

    • moonlake profile image
      Author

      moonlake 3 years ago from America

      toptendeals, Good to know. Now I just have to get photoshop. I have PSP and ico format is not there. Of course, my PSP is very old. Thanks for stopping by.

    • toptendeals profile image

      Jason Benedict 3 years ago from Boca Raton, Florida

      You can also get a free plugin for photoshop and save your favicon in the .ico format.

    • moonlake profile image
      Author

      moonlake 3 years ago from America

      Joy, Thanks for stopping by. I appreciate it.

    • profile image

      Joy 3 years ago

      I have wonder how to do this. Thanks for information.

    • moonlake profile image
      Author

      moonlake 3 years ago from America

      Indian Chef, I know on blogspot they are very hard to get them to show up. I have no idea why. Thanks for the vote and tweet.

    • Indian Chef profile image

      Indian Chef 3 years ago from New Delhi India

      Moonlake, it is very nice hub. I have been trying to get one for my blogspot but it never accepted the picture I wanted to put there. Now I hope I can put one on my blogspot. voting it up and tweeting it.

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      Au fait, There is a difference between a favicon and an avatar icon. Our profile picture is an avatar to indentify us on Hubpages, but if you save this hub in your favorites you will see the big large H (Hubpages) that is a favicon.

      I'm not seeing what your talking about by googling myself. If you mean the farm picture I have as my profile picture I have never seen it show in front of my url. Maybe I'm not understanding what you are saying.

      Thanks for stopping by and for vote and share.

    • Au fait profile image

      C E Clark 4 years ago from North Texas

      In fact your 'favicon' does show on your profile page on hubpages. If you Google yourself (moonlake.hubpages.com) your favicon will show in front of your URL.

      Useful and helpful information here. Voted up and useful. Will share!

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      rajan jolly, This is a good idea for your website it will help it show up when people put it in favorites. Thanks so much for stopping by and thanks for sharing.

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      Marcy Goodfleisch, Your right can't use it for that. It's just for your website url. Thanks so much for stopping by.

    • Marcy Goodfleisch profile image

      Marcy Goodfleisch 4 years ago from Planet Earth

      Wait - maybe it can't be used for that? Hmmmm . . .

    • Marcy Goodfleisch profile image

      Marcy Goodfleisch 4 years ago from Planet Earth

      I need to learn how to do this! I am ready to fly under the radar with an avatar, rather than a photo. Time to go incognito!!!

    • rajan jolly profile image

      Rajan Singh Jolly 4 years ago from From Mumbai, presently in Jalandhar,INDIA.

      moonlake this is certainly interesting and useful. I'm toying with the idea of having a website so this is just the thing I needed. I think a favicon lends a personal stamp to the site.

      I'm bookmarking to try it out later. Voted up, useful and interesting. And sharing it for benefit of others.

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      Peggy W, I used them on my website they sure make websites stick out in favorites. Thanks so much for stopping by and for the vote.

    • Peggy W profile image

      Peggy Woods 4 years ago from Houston, Texas

      Like others have already said, I had no idea what a favicon was nor how to use it. If I ever develop a website, this will come in handy. Thanks! Voted up and useful.

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      petertebin, Thank you so glad you stopped by and left a comment.

    • petertebin profile image

      petertebin 4 years ago from Maryland

      Great Hub! Voted UP! Keep up the good work!

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      mary615, I think it can. If you have Windows Live Photo Gallery that will also do it.

    • mary615 profile image

      Mary Hyatt 4 years ago from Florida

      Thanks. I'll check to see if Picassa can do that.

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      mary615, No you don't have to have Paint Shop Pro you just need a program that can resize the image. Anything that will make image 81 width by 70 height. Thanks so much for stopping by.

    • mary615 profile image

      Mary Hyatt 4 years ago from Florida

      Hi, moonlake. Do you have to have Paint Shop program to do this? I love the idea and I like the way you have done these flavicon. I started writing on Blogger and they use the word flavicon a lot. I never knew what they meant! Now I know.

    • moonlake profile image
      Author

      moonlake 4 years ago from America

      Peg, I'm surprised you found this old hub. I'm glad you did there were a few things I needed to fix on it. I'm trying to go through all my hubs and checking them over. Glad you enjoyed and thanks for stopping by.

    • PegCole17 profile image

      Peg Cole 4 years ago from Dallas, Texas

      Interesting and informative. I never heard the name favicon so I learned something today!

    • moonlake profile image
      Author

      moonlake 8 years ago from America

      Your welcome..thanks for stopping by my hub.

    • BkCreative profile image

      BkCreative 8 years ago from Brooklyn, New York City

      Thanks Moonlake!

      I need something like this. I like the red dress and will try it. I didn't know it was called flavicon.

      BKCreative

    Click to Rate This Article