'When referencing favicons, is MIME-type declaration (using the type attribute) obligatory?
When referencing a <link rel="icon">
in the <head>
of an HTML document, is it obligatory to declare the MIME Type of the icon image using the attribute type="[MIME TYPE HERE]"
?
Or is the type
attribute optional?
E.g.
Is it compulsory to write:
<link rel="icon" href="/path/to/my/favicon.png" sizes="57x57" type="image/png">
<link rel="icon" href="/path/to/my/favicon.svg" type="image/svg+xml">
Or is still valid to write:
<link rel="icon" href="/path/to/my/favicon.png" sizes="57x57">
<link rel="icon" href="/path/to/my/favicon.svg">
My reason for asking this question:
Today, on the subject of favicons, I read:
The main favicon can be an SVG of any size. The type
type="image/svg+xml"
is unnecessary.Source: https://medium.com/swlh/are-you-using-svg-favicons-yet-a-guide-for-modern-browsers-836a6aace3df
I don't feel entirely uncomfortable omitting the type
but if I can confirm from an official source that it's definitely not necessary then I'm willing to try getting used to not including it in future.
Solution 1:[1]
TLDR: My tentative conclusion is that the type
attribute is not obligatory in <link rel="icon" />
but it's nevertheless a good idea to include it.
Mozilla Developer Network (MDN) states:
If there are multiple
<link rel="icon">
s, the browser uses theirmedia
,type
, andsizes
attributes to select the most appropriate icon.Source: https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types
The Web Hypertext Application Technology Working Group (WHAT-WG) states:
If multiple icons are provided, the user agent must select the most appropriate icon according to the
type
,media
, andsizes
attributes [...] There is no default type for resources given by the icon keyword. However, for the purposes of determining the type of the resource, user agents must expect the resource to be an image.Source: https://html.spec.whatwg.org/multipage/links.html#rel-icon
The WHAT-WG also states:
If the
type
attribute is present, then the user agent must assume that the resource is of the given type [...] If the attribute is omitted, but the external resource link type has a default type defined, then the user agent must assume that the resource is of that type [...] If the attribute is omitted, and the external resource link type does not have a default type defined, but the user agent would fetch and process the linked resource if the type was known and supported, then the user agent should fetch and process the linked resource under the assumption that it will be supported.User agents must not consider the
type
attribute authoritative — upon fetching the resource, user agents must not use thetype
attribute to determine its actual type. Only the actual type [...] is used to determine whether to apply the resource, not the aforementioned assumed type.Source: https://html.spec.whatwg.org/multipage/semantics.html#concept-link-type-sniffing
All this suggests to me, that it's probably still a good idea to always include the type
attribute for <link rel="icon">
- even if it's not strictly required by the spec.
Solution 2:[2]
The whatwg.org site itself doesn't use the type attribute for their SVG logo, so I think it's safe to assume that it's not necessary.
https://html.spec.whatwg.org/multipage/semantics.html#attr-link-type
The type attribute gives the MIME type of the linked resource. It is purely advisory. The value must be a valid MIME type string.
For external resource links, the type attribute is used as a hint to user agents so that they can avoid fetching resources they do not support.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | |
Solution 2 |