favicon.png vs favicon.ico - why should I use PNG instead of ICO?
All modern browsers (tested with Chrome 4, Firefox 3.5, IE8, Opera 10 and Safari 4) will always request a favicon.ico
unless you've specified a shortcut icon via <link>
. So if you don't explicitly specify one, it's best to always have a favicon.ico
file, to avoid a 404. Yahoo! suggests you make it small and cacheable.
And you don't have to go for a PNG just for the alpha transparency either. ICO files support alpha transparency just fine (i.e. 32-bit color), though hardly any tools allow you to create them. I regularly use Dynamic Drive's FavIcon Generator to create favicon.ico
files with alpha transparency. It's the only online tool I know of that can do it.
There's also a free Photoshop plug-in that can create them.
Answer replaced (and turned Community Wiki) due to numerous updates and notes from various others in this thread:
- ICOs and PNGs both allow full alpha channel based transparency
- ICO allows for backwards compatibility to older browsers (e.g. IE6)
- PNG probably has broader tooling support for transparency, but you can find tools to create alpha-channel ICOs as well, such as the Dynamic Drive tool and Photoshop plugin mentioned by @mercator.
Feel free to consult the other answers here for more details.