Файл форматтары
ICO деген эмне? Сүрөтчө файлдары жана фавикондор
ICO бир файлда бир нече өлчөмдү сактаган Windows сүрөтчө форматы. Анын түзүлүшүн, фавикондун тарыхын жана бүгүн кайсы өлчөмдөр керек экенин түшүндүрөбүз.
Автор: Hemen Dönüştür Editör EkibiЖарыяланды: 6 мүн окуу
ICO Windows программалардын жана папкалардын сүрөтчөлөрү үчүн, ал эми веб браузер өтмөгүндөгү кичинекей сайт сүрөтчөсү (фавикон) үчүн колдонгон формат. Аны башка сүрөт форматтарынан айырмалап турган нерсе: бир эле файл бир сүрөтчөнүн бир нече өлчөмүн камтый алат. Бул макалада ICO файлынын ички түзүлүшү, ал Windows версиялары аркылуу кантип өнүккөнү, фавикондун тарыхы, бүгүн кайсы өлчөмдөр керек экени жана ICO файлдарын кантип туура түзүү керектиги түшүндүрүлөт.
ICO деген эмне?
ICO (кеңейтүүсү .ico) Microsoft сүрөтчө ресурстары үчүн аныктаган контейнер форматы. ICO файлы файлдагы ар бир сүрөттү (мисалы, 16x16, 32x32 жана 48x48 пиксел) өзүнчө жазуу катары тизмелеген «сүрөтчө каталогу» менен башталат. Андан кийин Windows же браузер сүрөтчө көрсөтүлө турган жерге эң ылайыктуу өлчөмдү тандайт.
IANA'да катталган расмий MIME түрү image/vnd.microsoft.icon, бирок Microsoft программалары жана көптөгөн серверлер дагы эле image/x-icon колдонот. Чычкан курсорлору үчүн CUR форматы дээрлик бирдей; ал каталогдун түр талаасында 1дин ордуна 2ни колдонот жана курсордун басуу чекитин (hotspot) сактайт.
Тарыхы: Windows сүрөтчөлөрүнөн фавиконго чейин
- Windows 1.0: Сүрөтчөлөр монохромдук болгон.
- Windows 3.0: Бүгүн биз билген бир нече сүрөттү камтыган каталогго негизделген түзүлүш келген.
- 1995: Джон Хорниктин Microsoft'тогу «Icons» макаласы ICO түзүлүшүн деталдуу документтештирип, иштеп чыгуучуларга жок дегенде 16x16 (16 түс), 32x32 (16 түс) жана 48x48 (256 түс) сүрөттөрдү кошууну кеңеш берген.
- 1999-жылдын марты: Internet Explorer 5 фавикондорду колдогон биринчи браузер болгон. Сайттын тамырындагы
favicon.icoфайлы тандалмаларда жана дарек тилкесинде көрсөтүлгөн. - Windows XP: 32 биттик сүрөттөргө 8 биттик альфа канал кошулуп, жумшак, жарым тунук четтер мүмкүн болгон.
- Windows Vista: 256x256 сүрөттөр жана ICO ичинде PNG кысуу кошулган.
- 2003:
image/vnd.microsoft.iconMIME түрү IANA'га үчүнчү тарап тарабынан сунушталган.
ICO файлынын түзүлүшү
Сүрөтчө каталогу (ICONDIR)
Файл 6 байттык баш бөлүк менен башталат: резервдик талаа (0), түр (сүрөтчөлөр үчүн 1, курсорлор үчүн 2) жана сүрөттөрдүн саны. Андан кийин ар бир сүрөт үчүн 16 байттык каталог жазуусу келет.
Каталог жазуусу (ICONDIRENTRY)
| Талаа | Мааниси |
|---|---|
| bWidth, bHeight | Туурасы жана бийиктиги (ар бири 1 байт). 0 мааниси 256 пикселди билдирет. |
| bColorCount | Палитра түстөрүнүн саны (8 бит жана андан жогору үчүн 0) |
| wPlanes, wBitCount | Түс тегиздиктери жана пикселге бит саны |
| dwBytesInRes | Сүрөт маалыматынын байт менен өлчөмү |
| dwImageOffset | Сүрөт маалыматы файлдын кайсы жеринен башталары |
Өлчөм талаалары бир байт болгондуктан, ICO ичиндеги сүрөт эң көп дегенде 256x256 пиксел болушу мүмкүн.
Сүрөт маалыматы: BMP же PNG
Классикалык ICO'до ар бир сүрөт файл баш бөлүгү жок BMP (DIB). Хорниктин макаласына ылайык, ал түстүү сүрөттү (XOR маскасы) жана андан кийин 1 биттик тунуктук маскасын (AND маскасы) камтыйт, ошондуктан баш бөлүктө сакталган бийиктик эки масканын жалпы бийиктиги, башкача айтканда чыныгы бийиктиктен эки эсе көп. Windows XP'ден баштап 32 биттик сүрөттөр альфа каналды түз эле пиксел маалыматында камтыйт.
Windows Vista'дан бери жазуу BMP'нин ордуна толук PNG файлы да болушу мүмкүн. PNG'ни камтуу, айрыкча 256x256 өлчөмү үчүн, файлды кыйла кичирейтет. MDN ICO ичиндеги PNG Vista'га чейин колдоого алынбаганын жана эски программаларда көйгөй жаратышы мүмкүн экенин белгилейт, бирок учурдагы браузерлер жана Windows версиялары эки түрүн тең окуйт.
Кайсы өлчөмдөр керек?
Windows тиркемелеринин сүрөтчөлөрү
Microsoft'тун тиркеме сүрөтчөлөрү боюнча учурдагы колдонмосунда Win32 тиркемеси жок дегенде 16x16, 24x24, 32x32, 48x48 жана 256x256 өлчөмдөрүн камтышы керек деп айтылат. Windows так дал келгенди таппаса, кийинки чоңураак өлчөмдү кичирейтет; 256 пикселдик сүрөт бар болсо, сүрөтчө дайыма кичирейтилет гана, эч качан чоңойтулбайт. Мисалы, 100% масштабда аталыш тилкеси жана контексттик менюлар 16 пикселди, тапшырмалар панели 24 пикселди колдонот; 200%да алар 32 жана 48 болот.
Веб-сайттар үчүн фавикондор
Вебде башкача иштейт. HTML Standard боюнча, баракта rel="icon" шилтемеси жок болсо, браузерлер сайттын тамырынан /favicon.ico сурашы мүмкүн. Ошондуктан тамырда favicon.ico кармоо дагы эле жакшы практика, бирок өзү гана жетишсиз:
- Google Search жок дегенде 8x8 пикселдик квадрат (1:1) фавиконду талап кылат жана ар түрдүү беттерде жакшы көрүнүшү үчүн 48x48ден чоңун сунуштайт.
- iPhone жана iPad'тин башкы экрандары 180x180
apple-touch-iconколдонот. - Android жана PWA веб-тиркеме манифестинде 192 жана 512 пикселдик сүрөтчөлөрдү, ошондой эле ыңгайлашуучу сүрөтчөлөр үчүн «maskable» нускасын күтөт.
- Учурдагы браузерлер SVG фавикондорун да колдойт; бир вектордук файл бардык өлчөмдөрдү камтыйт.
Практикада favicon.ico'нун ичине 16, 32 жана 48 пикселди коюу компьютердеги браузерлерди жана эски системаларды камтыйт, ал эми чоңураак өлчөмдөр өзүнчө PNG файлдары катары берилет.
Системалардагы, браузерлердеги жана программалардагы колдоо
Windows ICO'ну түз окуп, жазат; Explorer, ярлыктар жана иш столу баары аны менен иштейт. MDN'дин маалыматы боюнча, Chrome, Edge, Firefox, Opera жана Safari ICO файлдарын көрсөтөт. macOS тиркеме сүрөтчөлөрү үчүн өзүнүн ICNS форматын колдонот, бирок Preview ICO'ну ачат. GIMP сыяктуу редакторлор ICO'ну ар бир өлчөм бир катмар болгон катмарлуу файл катары ачат. MDN жалпы веб мазмунда ICO'дон качууну кеңеш берет жана фавикондор <link> элементи менен PNG'ге өткөнүн белгилейт.
Күчтүү жана алсыз жактары
| Күчтүү жактары | Алсыз жактары |
|---|---|
| Бир файлда бир нече өлчөм жана түс тереңдиги | Эң көп 256x256 пиксел |
| Windows'то жалпы колдоо | Фавикондордон тышкары вебде колдонулбайт |
| Альфа канал жана PNG кысуу (Vista жана андан кийин) | Эски BMP негизиндеги жазуулар чоң жана ыңгайсыз |
| Браузерлер тамырдагы favicon.ico'ну автоматтык түрдө издейт | Атайын курал керек; ар бир программа аны жаза албайт |
Көп кездешкен көйгөйлөр жана аларды чечүү
PNG'нин атын .ico кылып өзгөртүү жетиштүү эмеспи?
Айрым браузерлер буга чыдайт, бирок бул чыныгы ICO эмес: сүрөтчө каталогу жок жана Windows аны сүрөтчө катары кабыл албайт. Туура жолу сүрөттү чыныгы ICO'го конвертациялоо. Биздин PNG'ден ICO'го жана JPG'ден ICO'го куралдарыбыз дайыма 16, 32 жана 48 пикселдик квадраттарды жазат жана сүрөтүңүз жетиштүү чоң болсо 64, 128 жана 256ны кошот. Ар бир өлчөм PNG катары камтылат, ошондуктан тунуктук сакталат.
Фавикон бүдөмүк же окулбайт
Ичке сызыктар жана майда текст 16 пикселде жоголот. Калың, жогорку контрасттуу, жөнөкөй белгини колдонуңуз; керек болсо логотибиңиздин символ бөлүгүн гана алыңыз. Жок дегенде 256x256, идеалында 512x512 пикселдик квадрат булак эң жакшы натыйжа берет.
Квадрат эмес сүрөт кысылган же созулган болуп көрүнөт
Сүрөтчөлөр квадрат. Биздин куралдар сүрөттү эч качан созбойт: аны пропорциясын сактап квадраттын ортосуна жайгаштырып, четтерин тунук калтырат. Мыкты квадрат үчүн адегенде сүрөттү кесүү куралы менен квадрат бөлүгүн кесип алыңыз.
Жаңы фавикон көрүнбөйт
Браузерлер фавикондорду узак убакыт кэште сакташат. Файлдын атын өзгөртүү же версия параметрин кошуу (/favicon.ico?v=2), ошондой эле сервер туура MIME түрүн кайтарарын текшерүү адатта муну оңдойт. Google Search натыйжаларындагы сүрөтчө сайт кайра сканерленгенден кийин гана жаңыланат.
Windows дагы эле эски сүрөтчөнү көрсөтөт
Windows сүрөтчөлөрдү өзүнчө кэште сактайт. Тиркемени кайра куруп, ярлыкты кайра түзүү же системадан чыгып, кайра кирүү көбүнчө жетиштүү.
Конвертациялоо боюнча кеңештер
- Веб-сайт үчүн бир ICO жетишсиз: Фавикон генератору favicon.ico (16, 32 жана 48 пиксел), favicon-48x48.png, apple-touch-icon.png (180 пиксел), icon-192.png, icon-512.png, maskable icon-512-maskable.png жана site.webmanifest файлдарын бир жолу түзөт, ал эми булак SVG болсо, icon.svg'ни да кошот. Ал ошондой эле барагыңыздын
<head>бөлүгүнө кыстаруу үчүн кодду берет. - Apple сүрөтчөсүнө тунук эмес фон керек: iOS тунук аймактарды кара көрсөтүп, бурчтарды өзү тегеректейт, ошондуктан фавикон генератору apple-touch-icon'ду сиз тандаган фон түсү менен толтурат.
- Логотибиңиз SVG болсо: SVG'ден PNG'ге куралы менен чоң PNG түзүп, аны ICO'го конвертациялаңыз, же SVG'ни түз эле фавикон генераторуна бериңиз.
Биздин ICO жана фавикон куралдарыбыз браузериңизде иштейт; сүрөтүңүз жүктөлбөйт жана түзмөгүңүздөн чыкпайт.
Көп берилүүчү суроолор
ICO сүрөтүнүн эң чоң өлчөмү канча?
Каталог жазуусундагы туурасы жана бийиктиги талаалары бирден байт, жана 0 256 дегенди билдирет. Ошондуктан ICO ичиндеги бир сүрөт эң көп дегенде 256x256 пиксел.
Фавикон үчүн ICO колдонуу керекпи же PNG?
Экөөнү тең. 16, 32 жана 48 пикселдүү тамырдагы favicon.ico эски браузерлерге жана автоматтык суроо-талаптарга кызмат кылат; учурдагы браузерлер жана мобилдик түзмөктөр үчүн PNG (жана кааласаңыз SVG) сүрөтчөлөрүн <link> тегдери менен жарыялаңыз.
ICO тунуктукту колдойбу?
Ооба. Эски ICO'лор 1 биттик масканы колдонот, 32 биттик сүрөттөрдө Windows XP'ден бери толук альфа канал бар, ал эми камтылган PNG Vista'дан бери тунуктукту сактайт.
ICO файлын PNG'ге кантип конвертациялайм?
ICO файлыңызды сүрөт конвертерине кошуп, максат катары PNG'ни тандаңыз. Файл бир нече өлчөмдү камтыса, эң чоңу колдонулат.
Mac'те ICO файлдары колдонулабы?
macOS тиркеме сүрөтчөлөрү үчүн ICNS форматын колдонот. Веб-сайттар үчүн favicon.ico жана PNG сүрөтчөлөрү бардык операциялык системалардагы браузерлерде иштейт.
