可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

So as to waste some more time today, I converted a .jpg file to .ico and put it in favicon.ico. The .jpg is less than 1KB big; the .ico file is ** 60KB ** !!, bigger than the html page I'm putting it on.

I used the online converter at

http://www.coolutils.com/online/image-converter/

60KB cannot be a reasonable size for an icon. Can it?

Thanks!

-- pete

回答1:

.ico files are unique because they can contain multiple resolution images and the most appropriate one is used. The site probably created many resolutions and included them in a single file. Windows 7 supports icons up to 512x512 I think. You may have seen this in windows when a different icon is used for thumbnail vs. listview. If you want an icon for a website then just make a png. All the modern browsers support it and the size will be a lot smaller. Hope that helps!

<link rel="icon" type="image/png" href="http://example.com/myicon.png">

回答2:

I think that the .ico format it proposes is for Windows icons, for example, not specifically geared towards favicos.

回答3:

By default ICO file format store data as BMP file format, that is why the favicon.ico file is so big.

You can either save the data as PNG by exporting using GIMP, or send it compressed by gzip. Beware that not all browser support PNG format favicon.ico, and those very old browsers (IE < 6) neither support gzip compression.

Nowadays, most modern browsers support <link> method into the HTML source code to specific favicon of different size and format. You can add something like this into your source code to use PNG and SVG file format favicons.

<head>
    <link rel="icon" href="/favicon-32x32.png" type="image/png" sizes="32x32">
    <link rel="icon" href="/favicon-16x16.png" type="image/png" sizes="16x16">
    <link rel="icon" href="/favicon.svg" type="image/svg+xml" sizes="any">
</head>

You can check more tips to optimize your favicon in this guide.