Favicon'lar için ICO ile PNG karşılaştırması

ICO evrenseldir ancak eskidir; PNG moderndir ancak açık bağlantıya ihtiyaç duyar. Her ikisini de birlikte nasıl kullanacağınız aşağıda açıklanmıştır.

4 dk okuma

Check favicons on any website

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

Install Chrome Extension

ICO: evrensel geri dönüş

Her masaüstü tarayıcısı, siz hiçbir şey yapmadan /favicon.ico dosyasını getirir. Birden fazla çözünürlüğü tutabilen bir kaptır.

Windows kısayolları ve Dosya Gezgini .ico'yu kullanır, bu nedenle web site simgelerini önemsemeseniz bile işletim sistemi için bir tane kullanın.

PNG: her yoğunlukta piksel açısından mükemmel

PNG, <link rel="icon"sizes="..."> ile bağladığınızda yüksek DPI'lı ekranlarda net bir şekilde oluşturulur.

Web bildirimi için 192×192 ve 512×512 PNG'leri ve apple-touch-icon için 180×180'yi kullanın.

Karar: ikisini de kullanın

Evrensel destek için çok boyutlu bir .ico'nun yanı sıra HD ekranlar ve PWA kurulum istemleri için PNG çeşitleri kullanın. En net ölçeklenebilir simge için üstüne SVG ekleyin.

SSS

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.

İlgili kılavuzlar

Araçları deneyin

Okumaya devam et