最近,šimeVidas強調了一個討論Favicon HTML的Twitter線程。我最初的Favicon代碼包含一個錯字:
<link href="/favicon.ico" rel="icon" size="any"><link href="/favicon.svg" rel="icon" type="image/svg xml">
正確的代碼使用sizes
而不是size
:
<link href="/favicon.ico" rel="icon" sizes="any"><link href="/favicon.svg" rel="icon" type="image/svg xml">
這種校正可防止Chrome同時下載ICO和SVG Favicons,從而確保僅使用SVG(首選格式)。我的ICO文件是5.8kb,代表每個頁面加載不可忽略的保存。
šime在Web Platform News#42中提到了這一點,並指出雖然SVG Favicons得到了除Safari以外的所有現代瀏覽器的支持,但宣布ICO和SVG都需要ICO上的sizes="any"
屬性<link>
標記以防止鉻鉻優先考慮ICO。 (有關詳細信息,請參見Chrome Bug 1162276)。他以CSS-Tricks為例,是最佳標記的一個例子,儘管僅在確定錯誤之後才是正確的。最初的錯別字可能源於上一篇文章(現已糾正),但安德烈(Andrey)的文章仍然是實踐實施的寶貴資源。
以上是Favicons:如何確保瀏覽器僅下載SVG版本的詳細內容。更多資訊請關注PHP中文網其他相關文章!