Apple touch icon a favicon spolu souvisí, ale nejsou stejný soubor se stejným účelem. Favicon se obvykle pojí s kartami prohlížeče, záložkami a známým prohlížečovým chrome. Apple touch icon je určená pro zkratkové plochy Apple zařízení, kde se web může zobrazit spíš jako ikona aplikace.
Zmatek je pochopitelný, protože v mnoha projektech oba soubory vycházejí ze stejné značky. Zdrojová grafika může být jeden čtvercový obrázek, ale balíček musí obsloužit různé plochy. Proto by moderní favicon workflow neměl skončit u jediného souboru favicon.ico.
Co dělá favicon
Favicon je malý vizuální marker, který uživatelé vidí v kartách prohlížeče, záložkách, historii a příbuzných prohlížečových rozhraních. Pomáhá web rychle rozpoznat, když je otevřených několik karet.
Klasickým souborem je favicon.ico, i když mnoho moderních setupů přidává také PNG ikony. Pro rutinní spuštění webu je stále praktické držet favicon.ico v balíčku, protože pokrývá známá očekávání a kompatibilní cesty.
Co dělá Apple touch icon
Apple touch icon se používá, když je web uložen na plochy Apple zařízení, například jako zkratka na domovské obrazovce. Není to jen drobný marker v kartě. Musí fungovat jako ikona v app-like kontextu.
To mění tlak na design. Ikona v kartě prohlížeče může být extrémně malá. Touch ikona se může zobrazit větší, ale zároveň musí působit čistě, centrovaně a rozpoznatelně jako samostatná značka. Stejná zdrojová grafika může fungovat pro oboje, pokud je jednoduchá a čtvercová, ale outputy je stále potřeba správně zabalit.
Proč moderní weby často potřebují oboje
Pokud má web jen favicon, desktopový prohlížeč může vypadat dobře, zatímco mobilní zkratky působí nedokončeně nebo nekonzistentně. Pokud se balíček soustředí jen na touch ikony, může stále chybět tradiční cesta pro ikonu v kartě prohlížeče.
Pro SaaS launch, dokumentační web, produktový microsite nebo malou webovou aplikaci je praktická odpověď obvykle oboje. Chcete balíček, který pokryje karty prohlížeče i app-like zkratky, aniž by někdo musel ručně exportovat každou variantu ikony.
Tady zapadá Generátor favicon / ikon aplikace. Z jednoho čtvercového zdrojového obrázku vygeneruje favicon.ico, PNG ikony, Apple touch ikony, Android-ready ikony a startovací site.webmanifest.
Sdíleným omezením je zdrojová grafika
Největší faktor kvality je zdrojový obrázek. Stejná značka musí přežít několik ploch a velikostí. Detailní ilustrace, drobný text a grafika až k okraji obvykle fungují špatně. Jednoduchý tvar s dostatečným odsazením spíš zůstane rozpoznatelný.
Converty obsahuje kruhovou volbu pro prohlížečové a Android outputy, zatímco Apple touch ikony zůstávají čtvercové. To je důležité, když vaše značka funguje lépe v kruhovém rámu, ale zároveň chcete, aby Apple plochy zachovaly očekávané čtvercové zpracování.
Praktické rozhodnutí
Favicon použijte, když potřebujete rozpoznatelnost v prohlížeči. Apple touch icon použijte, když vám záleží na zkratkových plochách Apple zařízení. Kompletní balíček použijte, když chcete, aby web působil dokončeně napříč oběma světy.
Pro hlubší checklist souborů si přečtěte Jaké soubory potřebujete ve favicon balíčku?. Až budete připraveni assety exportovat, otevřete Generátor favicon / ikon aplikace, nahrajte jeden čtvercový zdrojový obrázek, zkontrolujte balíček a stáhněte ZIP.
