I go for a belt and braces approach here.
I create a 32x32 icon in both the .ico
and .png
formats called favicon.ico
and favicon.png
. The icon name doesn't really matter unless you are dealing with older browsers.
- Place
favicon.ico
at your site root to support the older browsers (optional and only relevant for older browsers.
- Place favicon.png in my images sub-directory (just to keep things tidy).
- Add the following HTML inside the
<head>
element.
<link rel="icon" href="/images/favicon.png" type="image/png" />
<link rel="shortcut icon" href="/favicon.ico" />
Please note that:
- The MIME type for
.ico
files was registered as image/vnd.microsoft.icon by the IANA.
- Internet Explorer will ignore the
type
attribute for the shortcut icon relationship and this is the only browser to support this relationship, it doesn't need to be supplied.
Reference
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…