Looks like:

(in case you don't have a viewer that can view .ico files properly)

download favicon.ico

Perhaps the background colour should be transparent, not white - but I don't know how to do this in .ico files.

Regards, fileman.

Whats a favicon?

At a guess, the kind of image that shows up in the favorites folder of your web browser.

Nice Idea, I like favicons

Favicons are those small icons showing up in your URL bar and in your favourites of your browser...

Look here:


It would look better if hydrogenaudio had a favicon, too

Favicon??
Is that the "icon" which shows on the address bar? (at the left of the url)?
HA doesnt have one yet...I think is a nice touch, some sites use it...
Is it hard to implement?

Not hard at all. Just add this to the page headers:
<LINK REL="SHORTCUT ICON" HREF="/favicon.ico">
-=Gonzotek=-

Yes, HA definitely needs a favicon. I like the idea and I like the icon you've suggested.

~ Florian

I think that you need only to copy an icon with name "favicon.ico" in the root of the site and all page of the site automatically load that icon...

damjang

Correct, nice and easy to implement.

PS. icon looks great!

That's true, but it seems to be more reliable with the link tag.

Yep. I've got apache running on NT4, and only IE5+ would show the favicon without the link tag(which is admittedly 99% of my traffic, but if I couldn't see it... ). Mozilla didn't work unless the link tag was present on a page at the time, but that may have changed in the 1.5 years since I set it up, I haven't checked on that.

Here's a nice reference page for favicons:
http://www.thesitewizard.com/archive/favicon.shtml

<LINK REL="SHORTCUT ICON" HREF="/favicon.ico">

Can you clarify for me what goes in the place of "SHORTCUT ICON" and "/favicon.ico"? I presume that if I upload an icon to my server, I can put the URL of the icon in place of "SHORTCUT ICON" for my own message board?

Hope you can help, this would be useful for my own site.

Don't replace SHORTCUT ICON with anything. Just change /favicon.ico to the path of the icon.

doesn't have to be an .ico file. one can use a gif or png as well:

I too think that Hydrogenaudio needs a so called "favicon"... I was just about to suggest one when I saw this thread...

I think the server is better.

take a look at this site: http://susning.nu/

The "A" icon is on the root, the "S" is the html link.

Mozilla Firebird shows "S" in the tab and "A" in the urlbar. If it didn't have the html link it would show an "S" in both places. (I don't know on other browsers)

Why not use the same icon for both? Both seem to work, so double up on security and do that.

As a side note, the admins don't seem too crazy about this, so you all may be outta luck. Sad, really, as I've wanted HA to have a favicon for a while, but oh well.

Yeah we'll look into it..

Mildly off topic, but does anyone know how to get IE to cont to display the favicons?
When I first add a favorite with an icon, the icon is there. But after I restart my computer the icon is gone forever.

You might have it set so it deletes the contents of the folder "Temporary Internet Files" on exit. The favicons are also saved there.

What happened with the favicon? The hydrogenaudio link looks so empty and colorless in my bookmarks...

Hey, the link works again... i'll look into it. The day i first wanted to add it, i couldn't download it.

Okay, the favicon is uploaded, no change to the headers yet. Works in IE and Firefox here, but others seem to have problems... clearing the browser cache might work sometimes. Reply here if there are consistent problems.

Also, can the size be reduced any more? 3 KB seem a little much for an icon.

Works flawless here as well with Opera 7.50

Great to see a favicon for HA

You may want to add a transparent background (use IconForge for example). And 3KB sounds like overkill (duh ) for a favicon... The pixel size needs to be a multiple of 16, if I recall correctly, but apart from that, 16x16 is the preferred size anyway...

Great initiative!

If you want to be on the save side put the favicon.ico in the root dir and add these lines in the head area:



IE stores the favicons in the "temporary internet files" (maybe Content.IE6) folder. Mozilla based browsers, Safari and Konqueror uses special folders.

BadHorsie

Edit: The icon must be 32x32 or 16x16 pixels.

I've made a new version of the icon, with transparency and a cleaner 16x16 image. I also removed the 48x48 image.

ha.ico

Thanks danbee, much better than mine (which was meant as a first experimental version ).

I think it would be better to have it on a white background. The icon looks ugly when the background is dark.

This looks nicer, but it's even bigger. Ah well..



Huh? Which browser do you use?

I tried to make it smaller, but the only way I could see of doing that would be to make it 16 colours, and then that just looks fugly.

3.5k isn't much, and for most it'll be a one time download anyway.

Edit: I've made a version that just has the 16x16 image in, as that is probably the only one that is needed anyway.

ha16.ico (1406 bytes)

I like the idea of a favicon. I use Firefox with links for HA and foobar2000 forums on my bookmarks toolbar. Both of them tends to steal other favicons from time to time. That might be a way of saying that they want their own

Here is the danbee icon saved with IrfanView with transparent and white background:
ha16trasparent.ico (894bytes)
ha16nontrasparent.ico (894bytes)

damjang

Er, are we sticking with the transparent background? I don't care much for that decision. There are so many background colours on which it could theoretically be placed. In my situation, it's on a 50% gray background, and looks like ass. I much preferred the solid white background. Plus, that way there are no anti-aliasing problems.

I think a white background would look even more...err...rectal. Using the default windows color scheme, I can imagine a white 16x16 box on my browser tabs against the grey...lovely .

Two (and a half?) words: anti-aliasing problems.

It appears to be back to the white background now, which is just thuper.

Hey, I just noticed a favicon A cool favicon for sure.

I don't know why but (also if the file favicon.ico is present in the root - because I can download it) the favicon is not show in my browser tab title etc (mozilla firefox). Other sites work ok!!! Someone with firefox can confirm this or it is only my fault?

Here is another icon with reduced colors (from 46 to 16 - no visual difference) and 318 bytes ...

damjang

I'm using Firefox and can see the favicon. Have you tried Ctrl+F5 to force a refresh?

PNG is much smaller than ico. Attached is an optimized PNG you can use.
Don't know if it will work in IE though.

ico was 894 byte
PNG is 335 byte

Not that it will matter in RL anyway...

Yes I have refreshed the page but nothing... (I read in the firefox forum that there is some favicon related bugs in firefox!)

damjang

Jumping in the boat, I tried adding a favicon to my personal webpage located on my ISP server - and it doesn't display.
I can get it when I host the same page on my personal server but not when it is on their servers.
It appears that some servers don't support favicons

For HA's - I like the design but I think the background should be a bit different or the design a little darker.

Today the icon "magically" appear in my firefox browser...
I don't know what happen...

damjang

i've wanted a favicon for a long time, and i made one a while back that was very similar to the current icon. i was very disappointed in it because the headphone icon doesn't translate well to small size, especially if you want to avoid ugly white backgrounds.

well, i just had an idea, and it turned out pretty well. the "ha" from the hydrogenaudio logo scales down nicely, and looks good with a small white outline to avoid background colour issues. i saved it as a png, which allows for alpha transparency, thus avoiding aliasing issues.

see here for my favicon.

Unfortunately it only avoids antialiasing issues in browsers that properly support PNG alpha transparency.

Mozilla (and variants) all support alpha properly as does Opera AFAIK. Internet Explorer does not (despite promising full support around version 4).

Another favicon, but this time semi-trasparent: HERE 318 bytes

that look like this (with different bg) :

damjang

I appreciate the work, but I don't care for the design. I could see rounded edges on a square, but a circle looks a little odd, IMO.

Looks a bit duff at the mo, with a big white block as a background...

For anybody who has problems with the favorites icons in IE disappearing, here's a program to fix that.

http://www.pctip.ch/downloads/dl/18699.asp

The problem is that favicons in IE get stored in the Temp Files folder like everything else. When those go away, they don't often get pulled again. This program will go through your favorites, fix the icons to display correctly, and set them in a location where IE won't eventually delete them. Works pretty well.