Badilisha PNG kuwa ICO (favicon)

Favicon ni aikoni ndogo ambayo vivinjari huonyesha kwenye kichupo, upau wa alamisho na historia. Zana hii inageuza PNG kuwa faili sahihi ya .ico yenye ukubwa mbalimbali, ikiwa na matoleo ya pikseli 16, 32, 48 na 64, yote yakitengenezwa kwenye kifaa chako bila kupakia chochote.

Jinsi ya kubadilisha PNG kuwa ICO

Dondosha picha yako ya PNG kwenye zana hapa chini. Picha ya mraba inafanya kazi vizuri zaidi.
Muundo wa matokeo tayari umewekwa kuwa ICO (favicon).
Bofya Anza ili kutengeneza .ico yenye ukubwa mbalimbali.
Pakua favicon.ico yako na uiweke kwenye folda kuu ya tovuti yako.

Favicon inapaswa kufanya nini

Favicon inaonyeshwa kwa ukubwa mdogo sana, mara nyingi pikseli 16 za mraba. Kwa ukubwa huo, undani mdogo unatoweka na mistari myembamba inapotea kabisa. Favicon nzuri ni umbo zito, rahisi lenye utofautishaji mkubwa: herufi moja, toleo lililorahisishwa la alama ya nembo, au umbo imara kwa rangi ya chapa. Kama nembo yako kamili ina maandishi, tumia alama tu, au herufi ya kwanza tu.

Sababu faili za .ico zina ukubwa kadhaa ni kwamba kupanua au kupunguza picha moja wakati wa kuonyesha kunaonekana na ukungu. Kwa kutoa matoleo ya pikseli 16, 32, 48 na 64, mfumo wa uendeshaji au kivinjari kinaweza kuonyesha picha kamili ya pikseli katika kila mazingira: px 16 kwenye kichupo, px 32 kwenye orodha ya alamisho kwenye skrini ya DPI ya juu, px 48 kwenye njia ya mkato ya upau wa kazi wa Windows, na kuendelea.

Kuandaa PNG ya asili

Ifanye iwe mraba. Kama nembo yako ni pana, iweke juu ya turubai ya mraba yenye uwazi kwanza, au kata hadi alama kwa zana ya kukata.
Anza kwa pikseli 256 au zaidi. Kupunguza kutoka asili kubwa na safi kunatoa matokeo laini zaidi kuliko kupanua ndogo.
Baki na mandharinyuma yenye uwazi kama umbo ni imara, ili likae vizuri kwenye mandhari ya kivinjari yenye mwanga na giza. Kama umbo ni jembamba au la rangi hafifu, liweke juu ya mraba wa rangi moja badala yake.
Epuka maandishi marefu kuliko herufi moja au mbili; hayatasomeka kwa pikseli 16.

Kusakinisha favicon

Hifadhi faili iliyopakuliwa kama favicon.ico na uiweke kwenye folda kuu ya tovuti yako. Kisha ongeza hii ndani ya <head> ya kila ukurasa:

<link rel="icon" href="/favicon.ico" sizes="any">

Majukwaa mengi yana mpangilio maalum badala yake: WordPress inauita Site Icon chini ya Appearance, Shopify na Squarespace zina sehemu ya Favicon kwenye mipangilio ya mandhari, na Webflow ina moja kwenye Project Settings. Pakia .ico hapo. Kwa mwongozo kamili, soma jinsi ya kutengeneza favicon.

Kwenda mbele zaidi

Kwa seti kamili ya aikoni ambazo vifaa vya kisasa vinaomba, pia utahitaji PNG ya pikseli 180 kwa njia za mkato za skrini ya mwanzo ya iOS (apple-touch-icon) na PNG za pikseli 192 na 512 kwa Android na manifest ya programu ya wavuti. Hizo ni faili za kawaida za PNG, kwa hiyo tumia zana ya kubadilisha ukubwa kuzitengeneza kutoka nakala kuu ile ile. .ico kutoka ukurasa huu inashughulikia vichupo vya kivinjari, alamisho na Windows, ambapo watu wengi hugundua favicon inayokosekana.

Maswali yanayoulizwa mara kwa mara

PNG yangu ya asili inapaswa kuwa na ukubwa gani?

Mraba, na angalau pikseli 64 kwa 64. PNG ya mraba ya pikseli 256 inatoa matokeo safi zaidi baada ya kupunguzwa. Picha zisizo mraba zinawekwa katikati na kuongezewa nafasi yenye uwazi.

Ndani ya faili ya .ico kuna nini?

Picha nne zilizosimbwa kama PNG kwa pikseli 16, 32, 48 na 64. Vivinjari na Windows huchagua ukubwa unaofaa zaidi kwa mazingira, kwa hiyo aikoni inaonekana kali kwenye kichupo, alamisho na njia ya mkato ya kompyuta.

Ninaongezaje favicon kwenye tovuti yangu?

Pakia favicon.ico kwenye folda kuu ya tovuti yako (ili ipatikane kwenye tovutiyako.com/favicon.ico) na uongeze <link rel="icon" href="/favicon.ico"> ndani ya <head> ya kurasa zako. Vivinjari huhifadhi favicon kwa nguvu, kwa hiyo huenda ukahitaji kuonyesha upya kwa nguvu ili kuona badiliko.

Je, bado ninahitaji faili ya .ico mwaka 2026?

Vivinjari vya kisasa vinakubali favicon za PNG na SVG, lakini .ico ndio muundo mmoja unaofanya kazi kila mahali, ikiwemo vivinjari vya zamani, njia za mkato za Windows na baadhi ya visoma habari. Tovuti nyingi hutoa vyote viwili.

Faili zako kamwe haziondoki kwenye kifaa chako

Kila zana ya Squishly Tools ni bure kabisa na inafanya kazi ndani ya kivinjari chako. Picha na nyaraka zako zinashughulikiwa kwenye kompyuta yako mwenyewe na hazipakiwi kamwe kwenye seva. Hakuna akaunti, hakuna alama maji na hakuna mtego.