Kako zadržati GIF u Photoshopu

Anonim

Kako zadržati GIF u Photoshopu

Nakon stvaranja animacije u Photoshopu, mora se spremiti u jedan od dostupnih formata, od kojih je jedan GIF. Značajka ovog formata je da je namijenjena za prikaz (reprodukcija) u pregledniku.

Ako ste zainteresirani za druge opcije za spremanje animacije, preporučujemo čitanje ovog članka:

Lekcija: Kako spremiti video u Photoshopu

Proces stvaranja GIF animacije opisan je u jednoj od prethodnih lekcija, a danas ćemo govoriti o tome kako spremiti datoteku u GIF formatu i postavkama optimizacije.

Lekcija: Stvorite jednostavnu animaciju u Photoshopu

Spremanje gif.

Za početak, ponavljamo materijal i pročitali prozor za postavke spremanja. Otvara se klikom na stavku "Spremi za web" u izborniku Datoteka.

Točka spremite za web u izborniku Datoteka da biste spremili GIF u Photoshopu

Prozor se sastoji od dva dijela: blok pregleda

Primjenska jedinica u postavkama parametara očuvanja GIF-ova u Photoshopu

i postavke bloka.

Postavke bloka u prozoru Gifkion Settings Settings u Photoshopu

Pregled bloka

Odaberite broj opcija prikaza odabran je na vrhu bloka. Ovisno o potrebama možete odabrati željenu postavku.

Odabir opcija gledanja u prozoru Gifki konzervatorske postavke u Photoshopu

Slika u svakom prozoru, osim izvornika, konfigurira se zasebno. To je učinjeno tako da možete odabrati optimalnu opciju.

Na lijevoj strani bloka nalazi se mali skup alata. Koristit ćemo samo "ručnu" i "skalu".

Alati za ruku i mjerilo u prozoru Gifki konzervatorske postavke u Photoshopu

Korištenje "Ruke" možete premjestiti sliku unutar odabranog prozora. Izbor je također napravio ovaj alat. "Skala" obavlja istu radnju. Cca i izbrisati sliku također može biti gumbe na dnu bloka.

Skala slike u prozoru Gifki konzervatorske postavke u Photoshopu

Nisko ispod je gumb s natpisom "View". Otvara odabranu opciju u zadanom pregledniku.

Gumb Prikaz slika u pregledniku u prozoru Settings of Daifting parametara u Photoshopu

U prozoru preglednika, osim za postavljanje parametara, također možemo dobiti HTML GIF kod.

Pregled slike u zadanom pregledniku tijekom održavanja GIF-ova u Photoshopu

Postavke bloka

U ovom bloku, parametri slike su konfigurirani, smatrajte ga više.

  1. Shema boja. Ova postavka određuje koja se tablica indeksiranih boja primjenjuje na sliku prilikom optimizacije.

    Izbor sheme indeksiranja boja tijekom održavanja GIF-ova u Photoshopu

    • Perceptivno i jednostavno "shema percepcije". Kada se koristi, Photoshop stvara tablicu boja, vođena trenutnim nijansama slike. Prema programerima, ova tablica je što bliže kako ljudsko oko vidi boju. Plus - slika je najviše blizu originala, boje su maksimalno spremljene.
    • Selektivna shema je slična prethodnom, ali boje koje se odnose na web sigurni za web se uglavnom koriste u njemu. Također se usredotočila na prikaz nijansi približnim početnim.
    • Prilagodljivo. U tom slučaju tablica je stvorena iz boja koje su češće na slici.
    • Ograničen. Sastoji se od 77 boja, od kojih su neki od uzoraka zamijenjeni bijelim u obliku točke (žita).
    • Prilagođen. Prilikom odabira ove sheme moguće je stvoriti vlastitu paletu.
    • Crno i bijelo. Ova tablica koristi samo dvije boje (crno-bijele), također koristeći žitarica.
    • U razredima sive. Postoje razne 84 razine nijansi sive.
    • Macos i Windows. Tablica se prikupljaju na temelju značajki slika mapiranja u preglednicima koji rade ove operativne sustave.

    Evo nekoliko primjera primjene shema.

    Uzorci slika koriste različite tablice za indeksiranje boja tijekom održavanja GIF-a u Photoshopu

    Kao što možete vidjeti, prva tri uzorka imaju prihvatljivu kvalitetu. Unatoč činjenici da se vizualno gotovo ne razlikuju međusobno, na različitim slikama ove sheme će raditi drugačije.

  2. Maksimalni broj boja u tablici u boji.

    Postavljanje maksimalnog broja boja u tablici indeksiranja uz održavanje GIF-ova u Photoshopu

    Broj nijansi na slici izravno utječe na njegovu težinu, a prema tome, na brzinu preuzimanja u pregledniku. Vrijednost od 128 se najčešće koristi, jer ova postavka gotovo ne utječe na kvalitetu, dok smanjuje težinu GIF-a.

    Primjeri postavki za maksimalni broj boja u tablici indeksiranja uz održavanje GIF-a u Photoshopu

  3. Web boje. Ova postavka uspostavlja toleranciju s kojom se nijanse pretvaraju u ekvivalentne od sigurne web palete. Područje datoteke određuje se vrijednost koju postavlja klizač: vrijednost je veća - datoteka je manja. Kada postavljanje web-boja ne bi trebali zaboraviti i kvalitetu.

    Postavljanje tolerancije pretvorbe slike na web-boje tijekom održavanja GIF-ova u Photoshopu

    Primjer:

    Primjeri postavljanja pretvorbe boja u WEEB dok održavaju GIF u Photoshopu

  4. Didyring vam omogućuje da izgladite prijelaze između boja miješanjem nijansi koje se nalaze u odabranoj tablici indeksiranja.

    Dystering postavka tijekom održavanja GIF-a u Photoshopu

    Također, postavka će pomoći kako očuvati gradijente i integritet monokromatskih mjesta. Kada koristite točenje povećava težinu datoteke.

    Primjer:

    Primjeri primjene postavki dystering tijekom održavanja GIF-a u Photoshopu

  5. Transparentnost. GIF format podržava samo apsolutno transparentne ili apsolutno neprozirne piksele.

    Postavljanje transparentnosti pozadine tijekom održavanja GIF-a u Photoshopu

    Ovaj parametar, bez dodatnog podešavanja, slabo prikazuje krivulje linija, ostavljajući dame piksela.

    Primjeri uporabe podešavanja mat uz održavanje GIF-a u Photoshopu

    Podešavanje se naziva "mat" (u nekim urednicima "Kaima"). Uz to, ona je konfigurirana za miješanje piksela slika s pozadinom stranice na kojoj će se nalaziti. Za najbolji prikaz odaberite boju koja odgovara boji pozadine stranice.

    Podešavanje miješanja slika piksela s pozadinom press stranica Resolte u Photoshopu

  6. Isprepleten. Jedan od najkorisnijih za web postavke. U slučaju da datoteka ima znatnu težinu, omogućuje vam odmah prikazivanje slike na stranici, jer učitava poboljšanje kvalitete.

    Postavljanje isprepletenih tijekom održavanja GIF-a u Photoshopu

  7. SRGB konverzija pomaže uštedjeti maksimalne originalne boje slike tijekom spremanja.

    Postavljanje konverzije boja u SRGB dok održava GIF-ove u Photoshopu

Postavljanje "disrying Transparency" značajno pogoršava kvalitetu slike, a mi ćemo govoriti o parametru "gubitka" u praktičnom dijelu lekcije.

Disrijivanje postavki za transparentnost i gubitak podataka uz održavanje GIF-ova u Photoshopu

Za najbolje razumijevanje procesa postavljanja očuvanja GIF-ova u Photoshopu, morate vježbati.

Praksa

Cilj optimizacije slika za internet je maksimalno smanjenje težine datoteke uz zadržavanje kvalitete.

  1. Nakon obrade slike, idite na "datoteku - spremite za web".
  2. Pokažite način prikaza "4 opcije".

    Odabir broja opcija za pregled rezultata tijekom održavanja GIF-a u Photoshopu

  3. Zatim vam je potrebna jedna od opcija kako biste najviše slični izvorniku. Neka bude slika desno od izvora. To se radi kako bi se procijenila veličina datoteke s maksimalnom kvalitetom.

    Postavke postavki su sljedeće:

    • Shema boja "selektivna".
    • "Boje" - 265.
    • "Diazering" je "slučajno", 100%.
    • Uklonite poklone nasuprot "isprepleteni" parametar, jer će konačna slika slike biti vrlo mala.
    • "Web boje" i "gubici" - nula.

      Postavljanje parametara referentne slike uz održavanje GIF-ova u Photoshopu

    Usporedite rezultat s izvornim. Na dnu prozora uzorka možemo vidjeti trenutnu GIF veličinu i brzinu učitavanja na specificiranoj brzini Interneta.

    Usporedba rezultata optimizacije slike s izvornom, uz održavanje GIF-ova u Photoshopu

  4. Idite na sliku ispod samo konfigurirana. Pokušajmo ga optimizirati.
    • Ostavite shemu nepromijenjenom.
    • Broj boja smanjuje do 128.
    • Dyslaring vrijednost smanjena na 90%.
    • Web-boje ne dodiruju, jer u ovom slučaju neće nam pomoći zadržati kvalitetu.

      Postavljanje parametara ciljnih slika pri održavanju GIF-ova u Photoshopu

    GIF veličina smanjila se s 36,59 kb do 26,85 kb.

    Smanjena veličina slike nakon optimizacije tijekom održavanja GIF-a u Photoshopu

  5. Budući da su neki zrnatost i mali nedostaci već prisutni na slici, pokušajmo povećati "gubitke". Ovaj parametar definira dopuštenu razinu gubitka podataka pri komprimiranju gif. Promijenite vrijednost na 8.

    Postavljanje razine dopuštenog gubitka podataka prilikom komprimiranja GIF-a za spremanje GIF-ova u Photoshopu

    Još uvijek smo uspjeli smanjiti veličinu datoteke, dok gubite malo kvalitete. GIFS sada teži 25,9 kilobajta.

    Veličina slike nakon postavljanja gubitka tijekom održavanja GIF-a u Photoshopu

    Ukupno, uspjeli smo smanjiti veličinu slike oko 10 kb, što je više od 30%. Vrlo dobar rezultat.

  6. Daljnje akcije su vrlo jednostavne. Kliknite na gumb Spremi.

    Spremanje gumba u prozoru Gifki konzervatorske postavke u Photoshopu

    Odabrali smo mjesto za spremanje, dajte ime GIF-a i ponovno pritisnite "Spremi".

    Odabir mjesta i naziva očuvanja GIF-ova u Photoshopu

    Imajte na umu da postoji mogućnost zajedno s GIF za stvaranje HTML dokumenta na koji će biti izgrađena naša slika. Da biste to učinili, bolje je odabrati praznu mapu.

    Spremanje GIF-a zajedno s HTML dokumentom u Photoshopu

    Kao rezultat toga, dobivamo stranicu i mapu slikom.

    Mapu sa spremljenim gif u Photoshopu

Savjet: Prilikom dodjeljivanja naziva datoteke, pokušajte ne koristiti ćirilične znakove, jer ih ne mogu svi preglednici mogu čitati.

Ova lekcija za spremanje slike u GIF formatu je dovršena. Na njemu smo saznali kako možete optimizirati datoteku za plasman na internet.

Čitaj više