PNG ki WEBP

1. Kupu Whakataki

Kaitahuri PNG ki WebP he taputapu tere e whakahaerehia ana i roto i te pūtirotiro, e huri ana i ngā whakaahua PNG ki te hōputu WebP hou, ā, ka āhei koe ki te whakahaere i te kounga o te whakaahua me te taumata kōpeketanga. Mēnā e hiahia ana koe ki ngā kōnae iti ake me te kore e tino whakaiti i te kounga ā-kanohi, ka tukuna e tēnei taputapu he otinga māmā, whaihua hoki.

He whānui te whakamahinga o ngā kōnae PNG mō ngā whakairoiro kounga teitei me ngā whakaahua whai pūataata, engari he nui tonu te rahi o aua kōnae. Ko WebP, i tētahi atu taha, i hangaia kia pai ake ai te kōpeketanga me te mahinga, nā reira he tino pai mō ngā paetukutuku, ngā taupānga, me ngā hua matihiko. Mā te huri i te PNG ki te WebP, ka taea e koe te whakaiti i te whakamahinga hōkaiipurangi, te whakapai ake i te tere uta whārangi, me te whakapiki i te wheako kaiwhakamahi.

Ka mahi katoa tēnei taputapu i roto i tō pūtirotiro, arā, ka tukatukahia ā-rohe ō whakaahua, kāore e tukuna ki tētahi tūmau. He tino pai mō ngā kaiwhakawhanake paetukutuku, ngā kaihoahoa, ngā kaituhi rangitaki, ngā kaihokohoko, me te hunga e hiahia ana ki te arotau i ngā whakaahua kia tere ake ai te uta me te pai ake o te SEO.

2. Me Pēhea te Mahi

Ka huri tēnei taputapu i tētahi whakaahua PNG ki te hōputu WebP mā te tukatuka whakaahua i roto i te pūtirotiro. Ka whakamahi i ngā API hou o te pūtirotiro pērā i te FileReader me te HTML5 Canvas kia haumaru ai, kia whaihua ai te huringa whakaahua.

Ngā Tawhā Tāuru

• Whakaahua (E Hiahiatia Ana) – Me tuku ake e koe tētahi kōnae whai toronga .png. Kāore e whakaaetia ētahi atu momo kōnae.
• Kounga (E Hiahiatia Ana) – He uara tau kei waenga i te 1 me te 100 hei whakahaere i te taumata kōpeketanga o te whakaahua WebP ka puta.
  • 1 = Kōpeketanga mōrahi (kōnae iti ake, kounga iti ake)
  • 100 = Kōpeketanga iti rawa (kōnae nui ake, kounga teitei ake)

Tukanga Hurihanga

Ina kōwhiria e koe tētahi whakaahua PNG, ka pānuihia e te taputapu te kōnae mā te whakamahi i te FileReader, ā, ka huri hei Base64 data URL. Ka utaina te whakaahua ki tētahi ahanoa whakaahua HTML kia whiwhi ai i tōna whānui me tōna teitei taketake. Ka waihangatia tētahi huānga canvas he ōrite ngā āhuatanga kia tiakina ai te taumira taketake.

Ka tāia te whakaahua ki runga i te canvas, kātahi ka kaweakehia e te canvas he whakaahua hou ki te hōputu image/webp mā te whakamahi i te tautuhinga kounga kua tohua. Ka whakaaturia tonutia te whakaahua WebP kua puta hei arokite, ā, ka wātea hoki mō te tikiake.

Ngā Ture Whakamana

• Ko ngā kōnae .png anake ka whakaaetia.
• Me noho te kounga hei tau kei waenga i te 1 me te 100.
• Me kōwhiri tētahi kōnae whakaahua i mua i te hurihanga.

Hōputu Putanga

• Hōputu: WebP (.webp)
• Taumira: He ōrite ki te PNG taketake
• Kōpeketanga: E hāngai ana ki te uara kounga kua kōwhiria
• Arokite: Ka whakaaturia tonu i roto i te pūtirotiro

Ngā Herenga

• Ko ngā kōnae PNG anake ka taea te huri.
• Ka nui pea te whakamahinga mahara o te pūtirotiro mō ngā whakaahua tino rahi.
• Ka tautokohia te pūataata, engari ka pā pea te kōpeketanga ki te mārama ā-kanohi i ngā taumata kounga iti.

3. Me Pēhea te Whakamahi i Tēnei Taputapu

1. Pāwhiritia te āpure Whakaahua, ā, kōwhiria tētahi kōnae PNG mai i tō pūrere.
2. Tāuruhia he uara kounga kei waenga i te 1 me te 100.
3. Pāwhiritia te pātene tukatuka (rānei, whakatikahia te kounga kia tīmata aunoa te hurihanga).
4. Tirohia tonutia te arokite o te whakaahua WebP kua hurihia.
5. Pāwhiritia te pātene Tikiake hei tiaki i te kōnae WebP ki tō pūrere.

4. Ngā Tauira Whaihua

Tauira 1: Arotau Whakaahua mō te Paetukutuku

Tāuru:

• Kōnae: banner.png (1920×1080)
• Kounga: 80

Putanga:

• Kōnae: result.webp
• Taumira: 1920×1080
• He iti ake te rahi o te kōnae me te iti noa o te rerekētanga ā-kanohi

He tino pai tēnei mō te whakaiti i te wā uta o te whārangi kāinga me te pupuri tonu i te koi o te kounga whakaahua.

Tauira 2: Kōpeketanga Mōrahi mō ngā Karakōnui

Tāuru:

• Kōnae: product.png (800×800)
• Kounga: 40

Putanga:

• Kōnae: result.webp
• Taumira: 800×800
• Kua tino whakaitihia te rahi o te kōnae

He tino pai mō ngā rārangi hua, mō ngā karakōnui taiwhanga hoki, i ngā wā e nui ake ai te hiranga o te rahi iti i te tino taipitopito o ia pika.

5. Ngā Take Whakamahi mā ngā Kaiwhakawhanake

- Arotau Whakaahua ki te Taha Kiritaki

Whakauruhia tēnei arorau ki ngā taupānga tukutuku hei huri i ngā whakaahua PNG ka tukuna ake e ngā kaiwhakamahi ki te WebP i mua i te tuku ki tō tūmau, kia whakaitihia ai ngā utu rokiroki me te hōkaiipurangi.

- Kōpeketanga Whakaahua CMS

Hurihia aunoa ngā whakaahua rangitaki ki te WebP i roto i tētahi pūnaha whakahaere ihirangi hei whakapai ake i ngā Core Web Vitals me te mahinga SEO.

- Tauira Whakaurunga JavaScript

const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
ctx.drawImage(image, 0, 0);
const webpData = canvas.toDataURL('image/webp', 0.85);

- Whakamana PHP I Mua i te Tukuake

if($_FILES['image']['type'] !== 'image/png') {
    die('Ko ngā kōnae PNG anake e whakaaetia ana.');
}

Ngā Whakaaro Haumarutanga me te Whakamana

• Whakamana tonu ngā momo MIME i te tūmau.
• Whakaritea he rohe mō te rahi o te kōnae hei aukati i te pau o te mahara.
• Whakapaihia ngā ingoa kōnae i mua i te tiaki.
• Whakamahia te whakamarutanga CSRF mō ngā tukunga puka haumaru.

6. Pātai Auau

He aha te mahi a tēnei kaitahuri PNG ki WebP?

Ka huri i tētahi whakaahua PNG ki te hōputu WebP i roto tonu i tō pūtirotiro, ā, ka āhei koe ki te whakahaere i te kounga kōpeketanga.

Ka tukuna ake rānei e tēnei taputapu aku whakaahua ki tētahi tūmau?

Kāo. Ka mahia katoatia te hurihanga i roto i tō pūtirotiro mā te whakamahi i te HTML5 Canvas, nō reira ka noho tonu tō whakaahua ki tō pūrere.

He aha te uara kounga me whakamahi e au?

Mō te nuinga o ngā whakamahinga tukutuku, ko te uara kei waenga i te 75 me te 85 ka whakarato i tētahi taurite pai i waenga i te mārama o te whakaahua me te rahi o te kōnae.

Ka rerekē rānei te taumira o te whakaahua?

Kāo. Ka pupuri te whakaahua WebP putanga i te whānui me te teitei ōrite ki te kōnae PNG taketake.

Ka taea e au te huri i ētahi atu hōputu kōnae?

Kāo. Ko ngā kōnae PNG anake ka whakaaetia e tēnei taputapu mō te hurihanga ki te WebP.

Ka tautoko rānei a WebP i te pūataata?

Āe. Ka tautoko a WebP i te pūataata pēnei i te PNG, nā reira he pai mō ngā moko me ngā whakairoiro atanga kaiwhakamahi.

He pai ake rānei a WebP mō te SEO?

Ka taea e ngā rahi kōnae whakaahua iti ake te whakapai ake i te tere uta whārangi, ā, ka whai pānga pai pea ki te mahinga SEO me te wheako kaiwhakamahi.