Pag-optimize at pag-save ng mga imahe ng GIF

Pin
Send
Share
Send


Matapos lumikha ng isang animation sa Photoshop, kailangan mong i-save ito sa isa sa mga magagamit na format, kung alin ito GIF. Ang isang tampok ng format na ito ay inilaan para sa pagpapakita (pag-playback) sa isang browser.

Kung interesado ka sa iba pang mga pagpipilian para sa pag-save ng animation, inirerekumenda namin na basahin ang artikulong ito:

Aralin: Paano makatipid ng isang video sa Photoshop

Proseso ng paglikha GIF Inilarawan ang animation sa isa sa mga nakaraang aralin, at ngayon ay pag-uusapan natin kung paano i-save ang file sa format GIF at tungkol sa mga setting ng pag-optimize.

Aralin: Lumikha ng isang simpleng animation sa Photoshop

Pag-save ng GIF

Una, ulitin natin ang materyal at pamilyar sa window ng pag-save ng mga setting. Binubuksan nito sa pamamagitan ng pag-click sa item. I-save para sa Web sa menu File.

Ang window ay binubuo ng dalawang bahagi: isang preview block

at mga bloke ng setting.

I-block ang preview

Ang pagpili ng bilang ng mga pagpipilian sa pagtingin ay napili sa tuktok ng bloke. Depende sa iyong mga pangangailangan, maaari mong piliin ang nais na setting.

Ang imahe sa bawat window, maliban sa orihinal, ay na-configure nang hiwalay. Ginagawa ito upang maaari mong piliin ang pinakamahusay na pagpipilian.

Sa itaas na kaliwang bahagi ng bloke ay isang maliit na hanay ng mga tool. Gagamitin lamang namin "Kamay" at "Scale".

Sa Mga Kamay Maaari mong ilipat ang imahe sa loob ng napiling window. Ang pagpili ay ginawa din ng tool na ito. "Scale" gumaganap ng parehong pagkilos. Maaari kang mag-zoom in at lumabas kasama ang mga pindutan sa ilalim ng block.

Sa ibaba ay isang pindutan na may inskripsyon Tingnan. Binubuksan nito ang napiling pagpipilian sa default browser.

Sa window ng browser, bilang karagdagan sa isang hanay ng mga parameter, maaari rin kaming makakuha HTML code Mga GIF

Mga bloke ng setting

Sa block na ito, ang mga parameter ng imahe ay nababagay, isasaalang-alang namin ito nang mas detalyado.

  1. Scheme ng kulay. Tinutukoy ng setting na ito kung aling mga naka-index na talahanayan ng kulay ang ilalapat sa imahe sa panahon ng pag-optimize.

    • Perceptual, ngunit simpleng "isang pamamaraan ng pang-unawa." Kapag inilapat, ang Photoshop ay lumilikha ng isang talahanayan ng kulay, ginagabayan ng kasalukuyang mga kulay ng imahe. Ayon sa mga nag-develop, ang talahanayan na ito ay malapit hangga't maaari kung paano nakikita ng mga kulay ng mata ang tao. Dagdag pa - ang imahe na pinakamalapit sa orihinal, ang mga kulay ay pinangangalagaan ng maximally.
    • Pinili Ang scheme ay katulad ng nauna, ngunit pangunahing ginagamit nito ang mga kulay na ligtas para sa web. Mayroon ding diin sa pagpapakita ng mga shade na malapit sa orihinal.
    • Umaangkop. Sa kasong ito, ang talahanayan ay nilikha mula sa mga kulay na mas karaniwan sa imahe.
    • Limitado. Binubuo ito ng 77 na kulay, ang ilan sa mga ito ay pinalitan ng puti sa anyo ng isang tuldok (butil).
    • Pasadyang. Kapag pumipili ng pamamaraan na ito, posible na lumikha ng iyong sariling palette.
    • Itim at puti. Dalawang kulay lamang ang ginagamit sa talahanayan na ito (itim at puti), na gumagamit din ng laki ng butil.
    • Sa grayscale. Ang iba't ibang 84 na antas ng mga kakulay ng kulay-abo ay ginagamit dito.
    • MacOS at Windows. Ang mga talahanayan na ito ay pinagsama batay sa mga tampok ng pagpapakita ng mga imahe sa mga browser na tumatakbo sa mga operating system na ito.

    Narito ang ilang mga halimbawa ng paggamit ng circuit.

    Tulad ng nakikita mo, ang unang tatlong mga halimbawa ay medyo katanggap-tanggap na kalidad. Sa kabila ng katotohanan na biswal na halos hindi sila naiiba sa bawat isa, ang mga pamamaraan na ito ay gagana nang iba sa iba't ibang mga imahe.

  2. Ang maximum na bilang ng mga kulay sa isang talahanayan ng kulay.

    Ang bilang ng mga lilim sa imahe ay direktang nakakaapekto sa timbang nito, at nang naaayon, ang bilis ng pag-download sa browser. Karaniwang ginagamit na halaga 128, dahil ang gayong setting ay halos walang epekto sa kalidad, habang binabawasan ang bigat ng gif.

  3. Mga kulay ng web. Itinatakda ng setting na ito ang pagpapaubaya kung saan ang mga shade ay na-convert sa mga katumbas mula sa isang ligtas na paleta sa Web. Ang bigat ng file ay natutukoy ng halaga na itinakda ng slider: mas mataas ang halaga - mas maliit ang file. Kapag nagse-set up ng mga kulay ng Web, huwag kalimutan din ang tungkol sa kalidad.

    Isang halimbawa:

  4. Pinapayagan ka ng Dithering na makinis ang mga paglipat sa pagitan ng mga kulay sa pamamagitan ng paghahalo ng mga shade na nilalaman sa napiling talahanayan ng pag-index.

    Gayundin, makakatulong ang pagsasaayos, hangga't maaari, upang mapanatili ang mga gradients at integridad ng mga seksyon ng monophonic. Kapag inilalapat ang dithering, tumataas ang timbang ng file.

    Isang halimbawa:

  5. Transparency Format GIF sinusuportahan lamang ang ganap na transparent o walang pasubali na mga pixel.

    Ang parameter na ito, nang walang karagdagang pagsasaayos, hindi maganda ang nagpapakita ng mga hubog na linya, na iniiwan ang mga hagdan ng pixel.

    Ang pinong pag-tune ay tinatawag "Matt" (sa ilang mga edisyon "Hangganan") Sa tulong nito, ang paghahalo ng mga pixel ng larawan sa background ng pahina kung saan matatagpuan ito ay na-configure. Para sa pinakamahusay na pagpapakita, pumili ng isang kulay na tumutugma sa kulay ng background ng site.

  6. Nakipag-ugnay. Isa sa mga pinaka-kapaki-pakinabang para sa mga setting ng Web. Sa kasong iyon, kung ang file ay may makabuluhang timbang, pinapayagan ka nitong agad na ipakita ang larawan sa pahina, pagpapabuti ng kalidad nito habang naglo-load ito.

  7. Ang pagbabagong sRGB ay tumutulong upang mapanatili ang maximum ng mga orihinal na kulay ng imahe habang nagse-save.

Pagpapasadya "Dithering of transparency" makabuluhang nagpapabagal sa kalidad ng imahe, at tungkol sa parameter "Pagkawala" pag-uusapan natin ang praktikal na bahagi ng aralin.

Para sa isang mas mahusay na pag-unawa sa proseso ng pag-set up ng pag-save ng GIF sa Photoshop, kailangan mong magsanay.

Pagsasanay

Ang layunin ng pag-optimize ng mga imahe para sa Internet ay upang mabawasan ang bigat ng file habang pinapanatili ang kalidad.

  1. Matapos maproseso ang larawan, pumunta sa menu File - I-save para sa Web.
  2. Itinakda namin ang mode ng view "4 na pagpipilian".

  3. Susunod, kailangan mong gumawa ng isa sa mga pagpipilian na katulad sa orihinal hangga't maaari. Hayaan itong maging larawan sa kanan ng mapagkukunan. Ginagawa ito upang matantya ang laki ng file sa maximum na kalidad.

    Ang mga setting ng parameter ay ang mga sumusunod:

    • Scheme ng kulay "Pinipili".
    • "Mga Kulay" - 265.
    • Dithering - "Random", 100 %.
    • Inaalis namin ang daw sa harap ng parameter Nakipag-ugnay, dahil ang pangwakas na dami ng imahe ay magiging maliit.
    • Mga Kulay sa Web at "Pagkawala" - zero.

    Ihambing ang resulta sa orihinal. Sa ibabang bahagi ng window na may halimbawang sample, makikita natin ang kasalukuyang sukat ng GIF at ang bilis ng pag-download nito sa ipinahiwatig na bilis ng Internet.

  4. Pumunta sa larawan sa ibaba na-configure lamang. Subukan nating i-optimize ito.
    • Iniiwan namin ang pamamaraan na hindi nagbabago.
    • Ang bilang ng mga kulay ay nabawasan sa 128.
    • Halaga Dithering bawasan sa 90%.
    • Mga kulay ng web hindi kami hinawakan, dahil sa kasong ito hindi ito makakatulong sa amin upang mapanatili ang kalidad.

    Nabawasan ang laki ng GIF mula sa 36.59 KB sa 26.85 KB.

  5. Dahil ang larawan ay mayroon nang ilang mga butil at maliit na mga depekto, susubukan nating dagdagan "Pagkawala". Tinukoy ng parameter na ito ang katanggap-tanggap na antas ng pagkawala ng data sa panahon ng compression. GIF. Baguhin ang halaga sa 8.

    Pinamamahalaang namin upang mas mabawasan ang laki ng file, habang natalo ng kaunti sa kalidad. Ang mga GIF ngayon ay may timbang na 25.9 kilobyte.

    Kabuuan, nabawasan namin ang laki ng imahe ng halos 10 KB, na higit sa 30%. Isang napakagandang resulta.

  6. Ang mga karagdagang pagkilos ay napaka-simple. Mag-click sa pindutan I-save.

    Pumili ng isang lugar upang i-save, bigyan ang pangalan ng gif, at muling i-click ang "I-save ".

    Mangyaring tandaan na may posibilidad na may GIF lumikha at HTML dokumento na kung saan ang aming larawan ay mai-embed. Upang gawin ito, mas mahusay na pumili ng isang walang laman na folder.

    Bilang isang resulta, nakakakuha kami ng isang pahina at isang folder na may isang imahe.

Tip: kapag pinangalanan ang isang file, subukang huwag gumamit ng mga character na Cyrillic, dahil hindi lahat ng mga browser ay maaaring basahin ang mga ito.

Ito ang aralin para sa pag-save ng imahe sa format GIF nakumpleto Dito namin nalaman kung paano i-optimize ang isang file para sa pag-post sa Internet.

Pin
Send
Share
Send