FavIcons. You see them all the time in a browser URL address window … there on the left of the Web site address … a tiny icon that brands the site. A stylized “g” for Google.com, a graphic “T” at The New York Times.com.  Well, they are incredibly easy to make for your own blog or Web site.  Here’s how -

All you need is a graphics program, like Photoshop or Photoshop Elements, and some imagination.  Here’s an example … for BoomerCafé, my online magazine for baby boomers, I began with the site’s logo file. Using Photoshop Elements, I reduced the physical size of the high resolution master logo file to about 300 pixels square and converted it to a GIF file of no more than 150k.

Next step was to upload the GIF file of the logo Into DynamicDrive’s free online FavIcon Generator.  Click the “Create Icon” button and FavIcon Generator shrinks the BoomerCafé logo to a tiny 16 pixel square size, just right for the browser address line, and downloads the file to the desktop of your computer.

Then, use an FTP program to upload the tiny FavIcon from your desktop to the main online directory of your site - i.e. http://www.mysite.com/.

Final step is to include this simple html line - <link rel=”shortcut icon” href=”/favicon.ico”> - into the head section of your site’s main index page.  If using Wordpress, it’s very easy - from the site’s Dashboard, click Design –> Theme Editor and look for the Main Index Template file on the right.  It’s the index.php file. Simply cut and paste the line of code below the first line and click Update.

Then, refresh your browser and enjoy your new, custom FavIcon.  Cool.

{ 0 comments }