ICO kontra PNG dla Favicons

ICO jest uniwersalny, ale stary; PNG jest nowoczesny, ale wymaga wyraźnego powiązania. Oto jak używać obu razem.

4 min czytania

Check favicons on any website

Install the FetchFavicon Chrome Extension to extract, preview, and validate favicons instantly.

Install Chrome Extension

ICO: uniwersalne rozwiązanie awaryjne

Każda przeglądarka komputerowa pobiera /favicon.ico bez robienia czegokolwiek. Jest to kontener, który może pomieścić wiele rozdzielczości.

Skróty Windows i Eksplorator plików opierają się na .ico, więc nawet jeśli nie interesują Cię ikony ulubionych stron internetowych, wyślij je dla systemu operacyjnego.

PNG: doskonała jakość pikseli przy dowolnej gęstości

PNG renderuje się wyraźnie na wyświetlaczach o wysokiej rozdzielczości, jeśli połączysz go za pomocą <link rel="icon" size="...">.

Użyj rozmiarów 192×192 i 512×512 PNG dla manifestu internetowego oraz 180×180 dla apple-touch-icon.

Werdykt: użyj obu

Wyślij plik .ico o wielu rozmiarach, aby uzyskać uniwersalną obsługę, a także warianty PNG dla wyświetlaczy HD i monity instalacyjne PWA. Dodaj SVG na górze, aby uzyskać najostrzejszą skalowalną ikonę.

FAQ

Should I use ICO or PNG for a favicon?

Use both: ICO for universal /favicon.ico fallback and PNG for high-DPI tabs and PWA manifest icons.

Does every browser support PNG favicons?

Modern browsers do when you link them with <link rel="icon" type="image/png">. ICO remains the safest default.

Is ICO outdated?

ICO is older but still required for Windows shortcuts and automatic /favicon.ico discovery by browsers.

Powiązane przewodniki

Wypróbuj narzędzia

Czytaj dalej