All geek questions in one place

Favicon.ico filesize == 60KB?

To lose some more time today, I converted the .jpg file to .ico and put it in favicon.ico. The .jpg size is less than 1 KB; the .ico ** 60KB ** !! file is larger than the html page I overlay it on.

I used the online converter on

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

60K may not be a reasonable size for an icon. Could it be?

Thanks!

- pete

+4
source share
4 answers
Files

.ico are unique because they can contain multiple images with resolution and the most suitable. Perhaps the site has created many permissions and included them in a single file. I think Windows 7 supports icons up to 512x512. You may have seen this in windows when another icon is used for thumbnails and lists. If you need an icon for a website, just create a png. All modern browsers support it, and the size will be much smaller. Hope this helps!

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

I think the .ico format it offers for Windows icons, for example, is not specifically designed for favicos.

+2
source

By default, the ICO file format stores data in the BMP file format, so favicon.ico is so large.

You can save the data in PNG format by exporting them using GIMP or sending compressed gzip. Remember that not all browsers support PNG favicon.ico format, and those older browsers (IE <6) do not support gzip compression.

Currently, most modern browsers support the <link> method in the HTML source code for a specific icon of different sizes and formats. You can add something similar to your source code to use PNG and SVG format icons.

 <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 out more tips for optimizing your icon in this guide .

+1
source

Just use paint if you are on Windows. Click the "resize" button and paste what percentage or pixel should be the new image, and it was done!

-2
source

Source: https://habr.com/ru/post/1343372/

More articles:


All Articles