Url bar icons

design

#1

What do you call those icons that many web pages have that appear in your browser’s url location bar and in bookmark displays (e.g. Dreamhost’s is a crescent moon on a blue square) and how do I do them?


#2

favicon.ico


#3

sorry, here a photoshop tutorial

http://www.photoshopsupport.com/tutorials/jennifer/favicon.html


#4

I use an online service at:-

http://www.html-kit.com/favicon/

where you can use an image file like a photo to create a nice favicon easily.


[color=#6600CC]Norm[/color]

Opinions are my own views and are not the views of DreamHost.
Any advice offered by me should be acted upon only at your own risk.


#5

I don’t have photoshop, just photoshop album starter edition, so these steps aren’t working. Can’t I use Fireworks to save as an *.ico?

I was able to get animated favicons from http://www.chami.com/html-kit/services/favicon/ to work in Netscape and Firefox but they don’t seem to appear in IE


#6

Look at the file types in Fireworks, if you see ico then the answer would be yes.
Corel Draw can save to ico if you happen to have that.
Place the favicon.ico file in the root domain folder any webpages in that folder will use that ico file. If your webpages are in another folder, then you will need to either place the ico file in those folders as well, or add a link to the ico file in the head section of your web page.
If the ico file is working in another web browser, but not IE, it maybe possible that the link to that page was already added in favorites.
To get the ico file to show, place your mouse over the address bar, then drag the address down then back up to the address bar to make the web page reload. (Not sure, but clicking go should do the same thing) Next time IE starts, you should see the ico file. Note: if you clear the cache of the browser, it may remove the favicon.ico files.
Silk


#7

I just create a 16x16 picture and then upload it to a file and use this code:

Place this between the head tags

:slight_smile:


#8

I was able to convert one of my png files from Fireworks to an animated gif and ico file using http://www.html-kit.com/favicon/ (See ykfp.org)

But when I tried to use the W3C preferred method to use a png directly, with the accompanying change of code in the head section, somehow my Firefox browser picked up the previous version of favicon.ico. What’s happened? (http://ykfp.org/indexwithpng.htm)

I’m still not seeing the favicon in IE, and I’ve tried several different systems. Am I not understanding how to refresh the IE view?


#9

Did you empty the cache of your browsers?
The old favicon.ico will be cached even when it is replaced. If you have a bookmark with your favicon displayed you will find it will refresh if you delete the bookmark and then re-bookmark the page.


N[color=#6600CC]or[/color]m

Opinions are my own views and are not the views of DreamHost.
Any advice offered by me should be acted upon only at your own risk.


#10

I think so. For IE, I went Tools>Internet Options, then deleted temporary Internet files, including offline content. Still not seeing any favicon.

For Firefox, I went to Tools>Options, then Cleared the cache. Now I see no favicon at ykfp.org/indexwithpng.htm, but get stuck with the message “Transferring data from ykfp.org” after the page loads.


#11

Place your favicon.ico in the web root directory. That is the directory that bears your domain name. Initially remove any entries to locate the favicon that you have placed into your html files. Use the comment tags if needed.

Again delete your cache and go to your page. Encourage it with a forced reload if necessary.

Ideally your favicon.ico should be about 1k -2k although I have a photo one (made from a .png) at about 3k which is okay.

When it is working you can if you wish re-instate the HTML text which should be placed between the tags at the top of your html as:-


N[color=#6600CC]or[/color]m

Opinions are my own views and are not the views of DreamHost.
Any advice offered by me should be acted upon only at your own risk.


#12

I found that I had to rename the png upload to agree to the name in the link icon.png. I had misnamed the file ico.png. So now http://ykfp.org/indexwithpng.htm works, even with the bad link to the profile. So, cool, that’s how I can do it with a png or gif if I can’t make a ico.

But still I can’t see either version’s favicon with my IE. Using v 6.0.29 on XP. Thought that Tools> Delete Files (Temporary Internet files) cleared the cache.


#13

I just tried your site and I was able to see the icon. I am using ver 6.0.2900.bla bla bla of IE, man the version number is long enough, jeesh. :slight_smile:
Silk