|
How To Create a Favicon For
Your Web Site
By Kalena Jordan
Ever see those little custom icons next to a web site listing in
your favorites folder or on your browser address bar? Have you ever
wondered how to create one for your own site? Well I'm going to
teach you in this article.
The icons are called "favicons", a contraction of the phrase
"favorite icons". To see an example, go to
www.searchenginecollege.com and bookmark the site (or add to your
"favorites" list). Now close your browser window and open a new one.
Click on your bookmarked sites or favorites list and find the site
you just bookmarked. See the tiny mortarboard graphic next to the
listing? That's a favicon. It makes the
site stand out from all the others in your favorites list. If you
click on that site, the favicon will even load next to the URL in
your browser address bar from now on.
Cool huh? Like to create a favicon for your own site? It's easier
than you think. Here's what you do:
1) Choose an image or symbol that you would like to use to represent
your web site. This could be a tiny version of your logo, a graphic
or perhaps a stylized version of your company initials. A famous
example of this is the "Y!" favicon used by Yahoo! A favicon is
meant to reflect the look and feel of a web site or a company logo.
Remember it needs to be simple and clear enough to have visual
impact when converted to 16
x
16 pixels.
2) Take a high quality version of your chosen image in .JPG or .GIF
format and if it isn't already, convert your image to the 256 color
Web
Safe Palette or the Windows 16 color format (the fewer colors the
better).
3) Using your favorite graphics package or image manipulation
software,
reduce the image down to 16 pixels wide by 16 pixels high, being
careful to preserve the image resolution. This is the tricky bit,
because you might find your chosen image looks fantastic at the
original size and downright silly at 16 x 16 pixels! Keep
experimenting
until you are happy with the finished icon. If you can't seem to
make
it work or you're short on time, you can use a free icon converter
like
Image Icon Converter
http://www.popularshareware.com/Image-Icon-Converter-download-11313.html
to convert your graphic to an icon or use an icon editor such as
ImageAuthor (http://imageauthor.com/)to build your icon from scratch.
4) You're nearly done! Now, take your completed icon and save it as
"favicon.ico". This is the default icon name that web browsers like
Internet Explorer and Netscape look for. If you want to be really
clever, you can even create a customized icon for each page on your
site - instructions for this can be found at www.favicon.com.
5) Take your .ico file and copy it into the the root directory of
your
web site (the main directory that contains all your HTML pages). Now
every time a visitor bookmarks your site, your icon is copied into
their
cache file and displays whenever that visitor returns.
6) To test your finished favicon, get a friend or colleague to
bookmark
your site and then open a new browser window. You can bookmark your
own
site but you generally only get one attempt at this so it's best to
save
it for when you are sure you're happy with your finished favicon.
Alternatively, dump your cache and open a new browser window between
tries. If you did it correctly, you should see your shiny new
favicon
appear in your favorites list next to your site listing and also
next
to
your URL in the address field of your browser.
That's it, you're done! You now have an eye-catching icon
representing
your web site in the favorites list of all your visitors. A
professional impact for very little effort.
---------------------------------------------------------------------------------
The above article may be re-published as long as the content remains
unchanged and the following paragraph is included at the end of the
article, including the URL links:
About the Author:
Article by Kalena Jordan, one of the first search engine
optimization
experts in Australia, who is well known and respected in the
industry,
particularly in the U.S. As well as running her own SEO business Web
Rank ( www.webrank.biz), Kalena manages Search Engine College
( www.searchenginecollege.com), an online training institution
offering
instructor-led short courses and downloadable self-study courses in
Search Engine Optimization and Search Engine Marketing subjects.
Sign up for our Newsletter to get
more great articles, tips and advice!
|
