Image Format Converter

Kibadilishaji cha Muundo wa Picha

Badilisha PNG, JPG, WebP, na AVIF — buruta, dondosha, pakua. Kila kitu hufanyika kwenye kivinjari chako; baiti za picha hazitoki kamwe kwenye kichupo chako.

Kibadilishaji cha Muundo wa Picha — TL;DR

Badilisha PNG, JPG, WebP, na AVIF — buruta, dondosha, pakua. Kila kitu hufanyika kwenye kivinjari chako; baiti za picha hazitoki kamwe kwenye kichupo chako.

Hapana. Zana nzima ni JavaScript inayoendeshwa ndani ya ukurasa huu. Picha husimbuliwa kwa createImageBitmap, huchorwa kwenye canvas, na kusimbwa upya kwa canvas.toBlob — kila hatua ni ya ndani ya kivinjari. Fungua DevTools → Network na uangalie: hakuna ombi hata moja linalotumwa wakati wa ubadilishaji. Salama kwa picha za kibinafsi, picha za skrini, faili za kubuni, na hati za siri.

PNG ni bila upotevu — huhifadhi kila pikseli kwa usahihi. JPG ina upotevu na ni bora kwa picha zenye mabadiliko laini ya rangi. Ikiwa PNG yako ni picha ya skrini, mchoro wa mistari, au ina vipande vingi vya rangi imara, JPG hukandamiza vibaya zaidi kuliko PNG na faili huwa kubwa. Kwa picha za skrini na rasilimali za UI, baki na PNG au tumia WebP. JPG huangaza kwa picha za kupiga.

Picha zina eneo, nyuso, picha za skrini zinaweza kuwa na siri, miundo ya kubuni ni vipengele vya bidhaa visivyotangazwa. Kubandika chochote cha haya kwenye seva ya mtu mwingine ni uvujaji wa data kimya. Kibadilishaji cha iKit ni JavaScript ambayo tayari imepakiwa kwenye kichupo cha kivinjari chako.

Miundo yenye upotevu pekee (JPG / WebP / AVIF). PNG huwa bila upotevu kila wakati. 75-85% ni kiwango bora kwa picha nyingi.
Dondosha picha hapa, au bofya kuchagua
PNG, JPG, WebP, AVIF, GIF, BMP — faili nyingi zinaruhusiwa. Hakuna kinachopakiwa.

Kwa nini iKit Image Format Converter

Imeundwa kwa wabunifu, wasanidi programu, na yeyote ambaye amewahi kuambiwa muundo wa faili si sahihi — badilisha kwa mibofyo miwili, bila kusubiri seva.

Miundo minne, zana moja

PNG, JPG, WebP, na AVIF — badilisha kwa upande wowote. Dondosha folda yenye miundo mchanganyiko na uipate yote ikiwa imebadilishwa kuwa muundo mmoja kwa pamoja.

Udhibiti kamili wa ubora

Rekebisha ubora kutoka 40% hadi 100% kwenye miundo yenye upotevu (JPG / WebP / AVIF) kwa kitelezi cha moja kwa moja. PNG huwa bila upotevu na sahihi pikseli kwa pikseli.

Faragha kwa muundo

Ubadilishaji hufanyika kwenye kivinjari chako kupitia canvas API. Hakuna upakiaji, hakuna kumbukumbu, hakuna mtu wa tatu. Inathibitishika katika DevTools → Network: maombi sifuri.

Miundo ya kisasa inaungwa mkono

WebP na AVIF mara nyingi huzalisha faili ndogo kwa 25-50% kuliko JPG/PNG kwa ubora sawa. AVIF inahitaji Chrome 85+ au Safari 16.4+ kusimba; tunatambua kipengele na kukuarifu.

Pakua kwa wingi

Badilisha picha kadhaa mara moja, kisha bofya "Pakua zote" kuzihifadhi. Kila faili huhifadhi jina lake la awali na kiendelezi kipya.

Inafanya kazi nje ya mtandao

Baada ya ukurasa kupakiwa, ubadilishaji wote ni wa ndani — unafanya kazi ndani ya ndege, treni, nyuma ya ngome ya kampuni, au mtandao ukiwa umeunganishwa.

Jinsi ubadilishaji wa picha kwenye kivinjari unavyofanya kazi

Hakuna seva katika mzunguko huu — kivinjari chako tayari kinakuja na kila codec tunayohitaji.

  1. 1

    Simbua chanzo

    Tunaita createImageBitmap(file), ambayo hutumia codec ya asili ya picha ya kivinjari kubadilisha baiti ghafi kuwa bitmap inayoweza kuchorwa. PNG, JPG, WebP, AVIF, GIF, BMP — chochote ambacho <img> kinaweza kuonyesha, hii inaweza kusimbua.

  2. 2

    Chora kwenye canvas

    <canvas> mpya inarekebishwa kwa upana × urefu wa asili wa picha, na bitmap huchorwa kwa azimio kamili. Hakuna upimaji upya, hakuna upangaji — pikseli kwa pikseli.

  3. 3

    Simba upya kuwa muundo lengwa

    canvas.toBlob('image/webp', 0.82) hukabidhi pikseli za canvas kwa kisimba cha kivinjari kwa muundo uliochaguliwa na kurudisha Blob. Mfuatano wa MIME ni jambo pekee tunalobadilisha kati ya miundo.

  4. 4

    Rudisha pakuaji

    Tunaita URL.createObjectURL(blob) kupata URL ya ndani, kuiunganisha kwenye nanga ya kupakua, na mtumiaji hupata faili ambayo haijawahi kugusa mtandao.

Kazi za kawaida za ubadilishaji wa picha

Hali halisi ambapo utahitaji kibadilishaji cha picha.

Kupunguza picha kabla ya kuchapisha

Simu huhifadhi picha kama JPG au HEIC za 4-8 MB. Kusimba upya kama WebP kwa ubora wa 75% hupunguza hizo hadi takriban 1 MB bila upotevu wa kuonekana — inafaa kwa machapisho ya blogu, upakiaji wa mabaraza, na barua pepe.

Kuondoa uwazi kwa CMS

CMS zingine (na programu nyingi za Office) hukataa PNG zenye alpha au huzionyesha kwa kutoka kwa usuli wa ajabu. Badilisha kuwa JPG na usuli tambarare, bandika, basi.

Kufanya rasilimali za tovuti kuwa za kisasa

Badilisha logo.png na hero.jpg yako na matoleo ya WebP / AVIF na uyatoe kupitia <picture>. Alama za Lighthouse huruka, LCP hushuka, hakuna upotevu wa ubora unaoonekana kwa jicho.

Kupokea PNG ya mbunifu na kusafirisha JPG

Umepata PNG ya muundo wa 24 MB? Mtandao hauhitaji hiyo. Badilisha kuwa JPG kwa 88% — kwa kawaida 1-2 MB na inaonekana sawa kabisa, na bajeti ya ukubwa imerudi.

Kwa nini ubadilishaji wa ndani ni muhimu

Picha zina eneo, nyuso, picha za skrini zinaweza kuwa na siri, miundo ya kubuni ni vipengele vya bidhaa visivyotangazwa. Kubandika chochote cha haya kwenye seva ya mtu mwingine ni uvujaji wa data kimya. Kibadilishaji cha iKit ni JavaScript ambayo tayari imepakiwa kwenye kichupo cha kivinjari chako.

  • Maombi sifuri ya mtandao wakati wa ubadilishaji — yanathibitishika katika DevTools → Network.
  • Metadata ya EXIF (eneo la kamera, kifaa) hutupwa wakati wa kusimba upya — bonasi ya faragha kwa bahati.
  • Salama kwa picha za kibinafsi, picha za skrini, miundo ya ndani ya kubuni, na hati za siri.

Miongozo inayohusiana

Mafunzo ya kina na ulinganishaji wa zana kutoka blogu ya iKit.

Maswali Yanayoulizwa Mara kwa Mara

Je, ni salama? Je, picha zangu zinapakiwa?

Hapana. Zana nzima ni JavaScript inayoendeshwa ndani ya ukurasa huu. Picha husimbuliwa kwa createImageBitmap, huchorwa kwenye canvas, na kusimbwa upya kwa canvas.toBlob — kila hatua ni ya ndani ya kivinjari. Fungua DevTools → Network na uangalie: hakuna ombi hata moja linalotumwa wakati wa ubadilishaji. Salama kwa picha za kibinafsi, picha za skrini, faili za kubuni, na hati za siri.

Kwa nini JPG yangu iliyobadilishwa ni kubwa kuliko PNG ya awali?

PNG ni bila upotevu — huhifadhi kila pikseli kwa usahihi. JPG ina upotevu na ni bora kwa picha zenye mabadiliko laini ya rangi. Ikiwa PNG yako ni picha ya skrini, mchoro wa mistari, au ina vipande vingi vya rangi imara, JPG hukandamiza vibaya zaidi kuliko PNG na faili huwa kubwa. Kwa picha za skrini na rasilimali za UI, baki na PNG au tumia WebP. JPG huangaza kwa picha za kupiga.

Lini nitumie WebP dhidi ya AVIF dhidi ya JPG?

JPG: utangamano wa ulimwenguni (kila kifaa, kila CMS), nzuri kwa picha. WebP: takriban 25% ndogo kuliko JPG kwa ubora sawa, inaungwa mkono katika kila kivinjari cha kisasa, ndio chaguo salama zaidi cha "bora kuliko JPG". AVIF: 20-30% ndogo zaidi kuliko WebP, lakini usimbaji ni wa polepole na ni Chrome/Safari/Firefox tu zinaisimbua (Safari ilihitaji 16.4+). Tumia AVIF mtandaoni ikiwa unatoa `` na chelezo ya JPG; tumia WebP ikiwa unataka muundo mmoja wa kuingiza; tumia JPG ikiwa utangamano ni muhimu kuliko kila kitu kingine.

Kwa nini AVIF inaonyesha "haitumiki" kwenye kivinjari changu?

Usimbaji wa AVIF kupitia canvas.toBlob unahitaji Chrome 85+, Safari 16.4+, au Firefox ya hivi karibuni (na image.avif.compliance_strictness ikiwa imegeuzwa). Usimbuaji (uonyeshaji) unaungwa mkono zaidi, lakini kuandika AVIF kunahitaji kisimba kuwa kimejengwa ndani. iKit hutambua kipengele na kuzima chaguo ikiwa kivinjari chako hakiwezi kuisimba. Suluhisho mbadala: badilisha kwenda WebP, au tumia kivinjari chenye msingi wa Chromium.

Je, picha yangu itahifadhi uwazi wake?

PNG, WebP, na AVIF zote huhifadhi uwazi wa chaneli ya alpha. JPG HAIHIFADHI — kubadilisha PNG yenye uwazi kuwa JPG hujaza usuli kwa rangi nyeupe (au chochote canvas inaweka kama chaguomsingi). Ukihitaji uwazi, badilisha kwenda WebP au PNG, kamwe sio JPG.