Favicon

De Wiki expérimental
File Format
Name Favicon
Ontology
Extension(s) .ico
MIME Type(s) image/x-icon
Released 1999

A favicon (or "shortcut icon") is an icon used to identify a website in browser bookmarks or title bars. It was introduced as a proprietary Microsoftism in 1999 but later made part of the web standards, and most browsers support it now. Internet Explorer only supports the ICO format, and requires use of a nonstandard MIME type image/x-icon (instead of the properly-registered type image/vnd.microsoft.icon), while other browsers are in general more open to other options such as the use of different graphic formats.

The traditional location for a favicon is the file favicon.ico in the root directory of a website, and many browsers will look for this file when loading or bookmarking a site even if the file does not exist, causing a lot of attempted accesses of it to be logged in web access logs. However, a webmaster can specify a different filename or location using a meta tag in HTML:

<link rel="shortcut icon" type="image/x-icon" href="/otherdir/othername.ico">

This is, by strict reading of the standards, using a dual type of "shortcut" and "icon" for the icon link, but Microsoft treats it like a single name in violation of the standards and won't work with either "shortcut" or "icon" alone. The standards have made "icon" the official link attribute name, so most other browsers will work without the "shortcut" keyword in the above line.

Apple Touch Icon

Another web icon, this one Apple-specific, is the Apple Touch Icon, used in iOS devices when sites are added as an app to home screens. This is traditionally found in the site root in PNG format as apple-touch-icon.png, or apple-touch-icon-precomposed.png if you don't wish iOS to add rounded corners, shadows, and shine. These are filenames that may also show up in web access logs even when they don't exist, as Apple devices attempt to find them. The webmaster can specify alternate locations as with the favicon:

<link rel="apple-touch-icon" href="/otherdir/othername.png">
<link rel="apple-touch-icon-precomposed" href="/otherdir/othername.png">

References