One way to add a touch of spice to your blog is with a Favicon or a Favatar as we're going to call it. These are small icon's that are displayed in the browsers address bar next to the URL. In the past you only saw Favatars on larger corporate sites that paid web developers big money to create their online identities, but now a days even us lowly bloggers can add originality to our sites with a custom icon.
The first step in creating your Favatar is the graphic design, which can be challenging because the final image is displayed so small. If you try to include to much detail or use a photo for this image your going to end up with a Favablob, as that's what it will look like, a blob that no one will be able to tell what the hell it is. So, rule number one is keep it simple. Save the detail for your larger works of art.
Try to incorporate your sites color scheme into the design. You can use any graphics program you want, even MS Paint, the graphics program packaged with windows will work for this task as simplicity is the order of the day.
For Blogatech's Favatar, I started with the logo you see above and just used the letter "B" in the font style of that logo. As you can see, I kept to the color scheme of Blogatech as well.. The similarity to the Blogger logo is intentional as working with Blogger is the theme of Blogatech.
Once I had created the graphic in Corel Draw I exported the image as a jpeg file. The next step was to get the image to a workable size which I did with the help of PIXresizer. You want your final image to be as close to a square as possible and no bigger than 96x96 pixels in size. I actually reduced it to 50x50 pixels which is very easy in PIXresizer (Read more about PIXresizer).
With our newly created graphic we headed to myfavatar.com to sign-up and upload our image. You will have to give them the usual info and verify your e-mail address in order to use their service. Once I uploaded the image and gave my blog URL and description I was given the HTML code I needed to add to my template. Here is the code they provided:
<link rel="shortcut icon" href="http://favatar.myfavatar.com/blogatech.ico" type="image/x-icon" />
<link rel="icon" href="http://favatar.myfavatar.com/blogatech.png" type="image/png" />
I copied this code and went to Blogger's dashboard and opened the template tab. Then I pasted the code between the head element of the template.(between <HEAD> and </HEAD>.tags. Then all that was left was to save the changes and republish.
The new Favatar showed up instantly in FireFox which is my browser of choice, but when I checked IE, I had to drag the standard IE icon to the right a couple of times, and restart IE to see the Favicon. It is also my understanding that in order for a Favatar to show up in IE the site has to be added to "My Favorites". So as I always suggest, get Firefox with Google Toolbar and see the internet the way it should be viewed.
With the whole process being so easy I decided to personalize my poker blog with this favatar. Again I was trying to keep it simple and incorporates the site colors, Check it out: Poker Chaos BlogTechnorati Tags: favicons, favatars, blogatech, myfavatar.com, poker chaos
1 comment:
nice post .i get icons to create my favicon at http://freeicon7.net
Post a Comment