Nice Touches for Your Website – favicon May 27, 2007
There are SO many nice little items that you can add to your website, and most of them are free and easy. Over the next few days, I’ll walk you through a few of my favorites.
FAVICON
This is the little icon that appears before the http:// in the URL. It’s the icon that shows up in your Favorites list as well, hence the name favicon. It’s a subtle touch that big companies use. Now you can too! The first thing you need to do is decide on a simple graphic to represent your website. In my case, I took the lion from my logo. Pick an item with simple lines that will be an appropriate identity for your site. Using editing software, crop it into a square shape and save it as a small gif file. There are a few free favicon makers online. I use the one at Dynamic Drive. Their directions are very simple. Once you make it, simply drag it into your public http file at your host.
To ensure that it shows up with both Internet Explorer and Mozilla Firefox, it’s smart to place this:
link rel=”shortcut icon” href=”/favicon.ico”
into the html code of your website. You’ll need to place a ‘less than’ bracket before it and a ‘greater than’ bracket after it. (When I type them into this page, the blog software assumes it’s a code and everything disappears.) To insert this code into a Webstudio, website, simply double-click on the background of each page to open the ‘Object Properties’ dialog box. Go to the ‘Page HTML’ tab, and click on the ‘Inside Page Header’ option. Copy and paste the code from above (with the brackets at the beginning and end) into this section on each page and save it. Then upload it to your host.
When I first did this, the favicon did not immediately show up on my computer. It was, however, appearing on computers that hadn’t been to my site before. Over time, the problem resolved itself and it shows up on my computer now.
If you enjoyed this post, make sure you subscribe to my RSS feed!


Latest Comments