Razmery favicon v 2026 godu: kakie fayly brendu deystvitelno nuzhny

Опубликовано 7 августа 2026 г. · Обновлено 7 августа 2026 г. · 5 мин чтения

Bolshinstvu brendov nuzhno bolshe, chem odin fayl favicon. Prakticheskiy nabor v 2026 godu - eto favicon.ico s neskolkimi malymi fallback-razmerami, PNG 32x32, Apple touch icon 180x180 i ikony manifest 192x192 i 512x512, esli sayt mozhno ustanovit. Tak odin i tot zhe logotip luchshe rabotaet vo vkladkakh, Google Search, na domashnem ekrane i v app-podobnykh scenariyakh.

Posle proverki kitnex.ai i tekuschego bloga Kitnex 6 iyulya 2026 goda stalo ponyatno, chto prompty, mockup, cvet, formaty faylov, commercial use i launch-checklist uzhe pokryty dovolno horosho. Не хватало sloya deployment: kak prevratit utverzhdennoe logo v nabor malenkikh ikonok, kotorye polzovateli realno vidyat vo vkladkakh, poiske, yarlykakh i na home screen.

Главные выводы

• Google Search ispolzuet odin kvadratnyy favicon na sayt, minimum 8x8 pikseley, i rekomenduet razmer bolshe 48x48.
• Sohranenie na domashniy ekran iOS opiraetsya na apple-touch-icon, a ne tolko na rel=icon.
• Ustanavlivaemym saytampolezny ikony manifest i pri neobkhodimosti maskable-versiya.
• Glavnaya zadacha ne v tom, chtoby sozdat bolshe faylov, a v tom, chtoby simvol ostavalsya chitabelnym v ochen malom razmere.

Kakogo razmera dolzhen byt favicon

Google ukazyvaet, chto favicon dolzhen byt kvadratnym i minimum 8x8 pikseley, a dlya luchshey vidimosti na raznykh poverkhnostyakh rekomenduet fayl krupnee 48x48. Pri etom Google Search podderzhivaet tolko odin favicon na sayt ili hostname. Poetomu dlya bolshinstva komand bezopasnee derzhat odin stabilnyy simvol i eksportirovat browser-fallback, Apple touch icon i ikony manifest otdelno.

• Minimum Google: kvadrat i ne menee 8x8.
• Prakticheskaya tsel: bolshe 48x48.
• Bazovyy nabor: favicon.ico, Apple touch, manifest.
• Vizualnyy znak dolzhen ostavatsya odinakovym.

Pochemu odnogo fayla nedostatochno

HTML pozvolyaet ob'yavit neskolko faylov rel=icon, i browser vyberet podkhodyaschiy variant po type i sizes. V to zhe vremya iOS ne ispolzuet rel=icon dlya Web Clip, a ischet apple-touch-icon. Dokumentaciya Apple takzhe privodit razmery 152x152, 167x167 i 180x180. Odin i tot zhe simvol nuzhno raskladyvat po neskolkim faylam pod raznye scenarii.

• Vkladki i zakladki: rel=icon.
• Google Search: favicon urovnya sayta s home page.
• Domashniy ekran iOS: apple-touch-icon.
• Ustanavlivaemyy sayt: ikony manifest i maskable.

Kakoy nabor faylov nuzhen bolshinstvu brendov

Nachnite s favicon.ico, v kotorom est malye fallback-razmery 16x16, 32x32 i 48x48. Dobavte PNG 32x32 dlya sovremennykh browserov, apple-touch-icon 180x180 dlya iPhone home screen i ikony manifest 192x192 i 512x512 dlya ustanovki i splash. Smysl ne v beskonechnom eksportе, a v tom, chtoby podgotovit tolko te fayly, kotorye deystvitelno ispolzuet sistema.

• favicon.ico: fallback dlya browsera i starykh kontekstov.
• favicon-32x32.png: yasnyy raster dlya sovremennykh vkladok.
• apple-touch-icon.png 180x180: sohranenie na iPhone home screen.
• icon-192x192.png: rasprostranennyy ustanovochnyy razmer.
• icon-512x512.png: bolee krupnyy sistemnyy asset.
• maskable-icon-512x512.png: opciya dlya bolee bezopasnogo crop.

Kogda nuzhna maskable-ikonka

MDN obyasnyaet, chto u ikon manifest mogut byt purpose any, maskable ili monochrome. web.dev dobavlyaet, chto vazhnaya grafika dolzhna ostavatsya v centralnoy safe-zone s radiusom okolo 40 protsentov shiriny ikony, a vneshnie 10 protsentov mogut byt obrezany. Poetomu ne stoit prosto silno umenshat polnyy logotip; luchshe podgotovit bolee prostoy simvol dlya malykh razmerov.

• Maskable vazhen, esli est ekran ustanovki ili pinning.
• Klyuchevoy simvol - v centralnoy safe-zone.
• Izbegayte dlinnogo teksta, tonkikh linii i slabogo kontrasta.
• Proveryayte na svetlom i temnom fone.

Kak testirovat favicon pered zapuskom

Google trebuet, chtoby Googlebot-Image mog chitat fayl favicon, a Googlebot - domashnyuyu stranicu; pri etom recrawl mozhet zanyat ot neskolkikh dney do neskolkikh nedel. Poetomu luchshe derzhat stabilnye URL, ssylatsya na fayly iz head glavnoj stranicy i ne pereimenovyvat ikh posle zapuska. Zatem stoit proverit ikonku v realnoy vkladke browsera, na iPhone home screen, v potoke ustanovki Chrome ili Android i pri umenshenii do 16-32 pikseley.

• Proveryayte head tags i manifest vmeste.
• Sohranite sayt na iPhone home screen i posmotrite rezultat.
• Esli sayt ustanavlivaemyy, proverte ekran ustanovki.
• Smotrite simvol pri 16-32 pikselakh na svetlom i temnom UI.
• Zakreplyayte imena produkcionnykh faylov posle vyhoda v live.

Частые вопросы

Источники и ссылки

• Define a favicon to show in search resultsGoogle Search Central
• Links - HTML StandardWHATWG
• icons - Web app manifestMDN Web Docs
• HTML attribute: relMDN Web Docs
• Configuring Web ApplicationsApple Developer
• Adaptive icon support in PWAs with maskable iconsweb.dev

Продолжить изучение