- 1. Vaizdo formatų tipai „Photoshop“
- 2. Kaip suspausti vaizdą „Photoshop“
- 3. Pakeiskite „Photoshop“ spalvų profilį
- 4. Suspauskite vaizdą neprarandant „Photoshop“ kokybės
- 5. Suspauskite PNG vaizdus „Photoshop“
- 6. Išsaugokite JPG.webp vaizdus „Photoshop“ žiniatinkliui
- 7. Išsaugokite PNG vaizdus žiniatinklio „Photoshop“
- 8. Išsaugokite „Photoshop“ žiniatinklio vaizdus
Jei svetainė nėra pagrįsta vien nekontroliuojamu turinio įkėlimu, turite pasirūpinti žiniatinklio struktūra, įskaitant kiekvieną joje talpinamą elementą. Reikia atsižvelgti į tai, kad prieiga prie jos prieinama per interneto ryšį ir kad, nors daugelyje vietų yra didelis greitis, kitose jos vis dar šiek tiek atsilieka. Visa tai neatsižvelgiant į mobiliosios temos svarbą ir megabaitų išlaidas. Štai kodėl vaizdų suspaudimas neprarandant „Photoshop“ kokybės yra labai pageidaujama kūrėjų, galvojančių apie vartotojų interesus, užduotis.
Tai, ko neturėtume daryti, yra paversti mūsų svetainę lėta erdve, į kurią žmonės nenori vėl patekti - to galime išvengti, jei atsižvelgsime į skirtingus elementus ir išmoksime suspausti vaizdus „Photoshop“. Vienas iš jų ir labai svarbus yra nuotraukų įkėlimas. Jei turite svetainę, kurioje yra daug vaizdinio turinio, turite ja pasirūpinti tiek iš vidaus, tiek iš išorės, suspausdami „Photoshop“ vaizdus ir pagreitindami puslapį.
Mūsų svetainės greitis yra labai svarbus vartotojo patirčiai, nes nėra tas pats, kas įeiti į greitą puslapį, kuris neturi įtakos mūsų ryšiui su svetaine, kurioje visi matomi objektai įkeliami labai lėtai. Be to, norėdami pamatyti vaizdus, juos reikia atsisiųsti į serverį, todėl kuo didesnis garsas, tuo ilgiau užtruks ši apkrova ir vartotojas tikriausiai nusimins ir išeis. Taigi svarbu redaguoti vaizdus „Photoshop“ ir tobulinti mūsų svetainę ar tiesiog erdvę, žinant, kaip suspausti vaizdus „Photoshop“.
Jei įkelsite labai sunkius vaizdus, jūsų puslapis bus lėtas, o vartotojai pavargs ir išeis. Jei norite neprarasti apsilankymų, pasirūpinkite viskuo, ką įkėlėte, ir sužinokite, kaip suspausti vaizdą „Photosho“, sumažinant jo dydį.
1. Vaizdo formatų tipai „Photoshop“
Kad galėtume kalbėti apie vaizdo optimizavimą, turime atskirti, kokio tipo vaizdo formatą turime ir kuris iš mūsų yra tinkamiausias.
JPEG.webp formatasBendram fotografavimui tai yra standartinis formatas, naudojamas geros kokybės rezultatams. Palaiko 24 bitų spalvas.
PNG-8 formatasTai alternatyva GIF.webp, bet be animacijos ir gali rodyti iki 256 spalvų. Jo suspaudimas tinklui yra vienas tinkamiausių, leidžiantis gerą kokybę ir mažesnius dydžius.
PNG-24 formatasTai gera galimybė eksportuoti kokybiškus vaizdus, kaip ir JPEG.webp. Šio tipo plėtiniai yra patogūs, kai turime vaizdą, kuriame yra skaidrumo. Jis taip pat rodo iki 16 milijonų spalvų, nes palaiko 24 bitų spalvas.
GIF.webp formatasTai yra animacijos par excellence formatas. Atstovauja iki 256 spalvų formų dideliais kiekiais vientisos spalvos, linijų ar teksto.
Šiai pamokai mes pasirinksime du naudingiausius ir naudojamus vaizdų įkėlimo į internetą formatus: JPEG.webp ir PNG-8.
2. Kaip suspausti vaizdą „Photoshop“
Kai dirbame „Photoshop“ darbo vietoje, tai darome pagal tam tikrus parametrus, priklausomai nuo vaizdo ar bendro pobūdžio. Vienas iš jų - įvaizdžio, su kuriuo dirbame, dydis, proporcijos. Vaizdo dydis atitinka pikselių skaičių, kurį jis turi vertikaliai ir horizontaliai, todėl gaunamas vaizdo dydis.
Tai, ką mes vadiname raiška, reiškia tam tikroje erdvėje esančių informacijos dalių skaičių, kuris vadinamas pikseliais colyje arba dpi. Tai reiškia, kad kuo didesnis pikselių skaičius colyje, tuo didesnė bus mūsų skiriamoji geba.
Atskyrus abu aspektus, reikėtų pažymėti, kad du vaizdai gali būti vienodo dydžio, tačiau skirtingos skiriamosios gebos ir proporcijų. Jei jie yra žiniatinklio vaizdai, rekomenduojama dydžius laikyti pikselių dydžiu. Norėdami jį pasiekti, eikite į Vaizdas / Vaizdo dydis arba paspauskite šį derinį.
Ctrl + Alt + I
PastabaParinktis „Iš naujo atkurti vaizdą“ leidžia keisti dydį nekeičiant skiriamosios gebos. Pasirinkite jums tinkamiausią variantą.
3. Pakeiskite „Photoshop“ spalvų profilį
Spalvų erdvė, kurioje mes dirbame, taip pat paveiks galutinį failą. Reikia paminėti skirtumą tarp sRGB ir RGB erdvės. „Adobe RGB“ sistemą bendrovė pristatė 1998 m. Ir sukuria daug platesnį spalvų spektrą nei „sRGB“ erdvė. Tai nereiškia, kad tai blogiau, bet kad jie skirti skirtingiems tikslams.
RGB sistema savo spektru yra artimesnė CMYK, orientuoto į spausdinimo pasaulį, spektrui. Nepaisant to, kad yra daugiau spalvų, standartas, platinamas skaitmeniniu būdu įrenginiuose, nesvarbu, ar tai būtų mobilieji telefonai, monitoriai ar bet koks skaitmeninis įrenginys, yra sRGB standartas. Kai vienas iš šių įrenginių susiduria su RGB, jis bando suspausti perteklines spalvas ir sukuria klaidingą sRGB, o rezultatai yra blogesni.
1 žingsnis
Todėl, norint pagerinti spalvų suderinamumą, rekomenduojama fotografuoti nuotraukas, darbo vietą „Photoshop“ arba optimizuoti jas naudojant šią sistemą. Norėdami pakeisti darbinį spalvų profilį, eikite į meniu Redaguoti ir pasirinkite Konvertuoti į profilį.
2 žingsnis
Kitame lange turėsite pasirinkti tik jums reikalingą profilį, šiuo atveju sRGB.
4. Suspauskite vaizdą neprarandant „Photoshop“ kokybės
JPG.webp formatas yra dažniausiai naudojamas standartas ir, nors ir leidžia suspausti, jis nesiūlo tiek daug redaguojamų parametrų kaip PNG. Galutinį savo vaizdo svorį galime keisti pakeisdami nuotraukos dydį arba eksportuodami.
1 žingsnis
Išsaugodami kaip JPEG.webp matome, kad turime dvi parinktis, viena vertus, sukonfigūruokite vaizdo parinktis (kokybę) ir, kita vertus, formatavimo parinktis. Norėdami tai padaryti, eikite į meniu Failas / Įrašyti kaip arba šį derinį ir pasirinkite JPEG.webp formatą.
„Shift“ + „Ctrl“ + S
2 žingsnis
Šie konfigūracijos parametrai rodomi kitame lange. Pažiūrėkime, ką kiekvienas reiškia.
Vaizdo parinktysČia mes turime pasirinkti galutinę vaizdo kokybę, akivaizdu, kad kuo aukštesnė kokybė, tuo didesnis failo dydis, matydami, ką jis pagaliau užims, jei spustelėsime Peržiūra. Perkelkite juostą, kad galėtumėte keisti šias vertes.
Jei norime, kad nuotrauka atspausdintų plakato dydį, turime pasirinkti daug aukštesnę kokybę nei jei norime vaizdo žiniatinkliui, atminkite, kad kuo didesnis vaizdo dydis, tuo daugiau išteklių reikės norint jį įkelti žiniatinklyje.
Formato parinktysViduje mes randame įvairių alternatyvų, kaip galutinai formuoti mūsų įvaizdį. Labiausiai rekomenduojama yra standartinė pradinė linija, nes ji dažniausiai yra labiausiai suderinama.
- Bazinis („Standartinis“). Jame naudojamas formatas, kurį atpažįsta didžioji dauguma interneto naršyklių ir programų. Šiuo metu naujausios programos paprastai nesuderinamos.
- Optimizuota pradinė padėtis. Naudojant šį formatą bus sukurtas vaizdo failas, kuriame bus optimizuotos spalvos, todėl bus suteiktas mažesnis dydis.
- Progresyvus. Pasirinkus šią parinktį, bus rodomos skirtingos versijos, kurios bus vis detalesnės, kai bus atsisiųsta. Vartotojas nusprendžia, kiek jų bus sukurta. Tai formatas, kuris buvo naudojamas ir naudojamas daug, kai einame į lėtus ryšius, kuriems reikia įkelti šlavimo šlavimus.
PastabaReikėtų paminėti, kad ne visos naršyklės atpažįsta ar palaiko progresyvius ar optimizuotus JPEG.webp vaizdus.
5. Suspauskite PNG vaizdus „Photoshop“
1 žingsnis
Norėdami eksportuoti kaip PNG, pirmiausia turime atlikti tą patį veiksmą, kaip ir su kitais formatais, eikite į meniu Failas / Įrašyti kaip ir šiuo atveju pasirinkite PNG.
2 žingsnis
Dabar išsaugojimo lange pamatysite įvairias parinktis.
SuspaudimasMes galime pasirinkti norimą glaudinimo tipą arba pasakyti jokio, jei nenorime, kad jis būtų taikomas. Priklausomai nuo pasirinkimo, pakrovimo greitis bus padidintas arba sumažintas.
PynimasŠi parinktis yra svarbi, ypač jei kalbame apie žiniatinklio platformas. Pažiūrėkime skirtumą:
- Nei vienas. Ši parinktis leidžia atvaizdą rodyti tik tada, kai jis yra visiškai įkeltas, tai yra, jei ryšys yra lėtas arba probleminis, vaizdas nebus rodomas, kol nebus įkeltas į interneto perdavimą.
- Susipynę. Ši parinktis labiau rekomenduojama žiniatinklio paslaugoms, nes įkeliant rodomos sumažintos vaizdo versijos. Tai padeda atsisiuntimo procesui būti mažesniam ir vartotojas žinos, kad vaizdas yra atsisiunčiamas.
6. Išsaugokite JPG.webp vaizdus „Photoshop“ žiniatinkliui
1 žingsnis
Viena iš naudingiausių „Photoshop“ parinkčių, skirtų vaizdo optimizavimui, yra „Išsaugota kaip žiniatinklis“, leidžianti rankiniu būdu koreguoti įvairius parametrus. Šis išsaugojimas yra labai naudingas vaizdams, skirtiems įkelti į internetą, leidžiantiems kokybiškus vaizdus, tačiau mažesnio dydžio. Norėdami tai padaryti, eikite į Failas / Išsaugoti žiniatinkliui arba atlikite šį derinį.
„Alt“ + „Shift“ + „Ctrl“ + S
2 žingsnis
Jei norime pasirinkti JPEG.webp, turėsime šiuos nustatymus.
Vaizdo kokybėPasirinkite pageidaujamą vaizdo kokybę nuo žemos iki maksimalios arba su reikšmėmis dešinėje. Dydžio kitimą galite pamatyti žemiau esančiame paveikslėlyje kairėje.
ProgresyvusVaizdas įkeliamas po truputį, tai yra, nuo mažos raiškos matymo pereisime prie tikrosios.
SusipynęVaizdas rodomas tik tada, kai jis visiškai įkeltas.
LabasJei vaizdas yra skaidrus, pasirinkite aureolės spalvą, atitinkančią puslapio, kuriame jis bus įterptas, foną.
Įterpti spalvų profilįPasirinkite šią parinktį, kad išsaugotumėte vaizdo ICC profilį, kai kurios interneto naršyklės jį naudoja spalvai koreguoti.
Konvertuoti į sRGBNaudokite šį profilį, kad pagerintumėte spalvų suderinamumą įrenginiuose ir monitoriuose.
Turite ir kitų parinkčių, tokių kaip peržiūros režimas, metaduomenys arba dydžio keitimas su apribojimais arba be jų.
7. Išsaugokite PNG vaizdus žiniatinklio „Photoshop“
1 žingsnis
Kaip jau žinome, kad galėtume pasiekti „Saved for Web“ PNG formatu, turime eiti į „File / Save for web“. Atminkite, kad šis formatas yra labai tinkamas vaizdams, kurių paskirtis yra žiniatinklyje, nes jo rezultatas suteikia labai gerą ryšį tarp kokybės ir failo svorio.
2 žingsnis
Jei norite eksportuoti kaip PNG, pasirinkite jį išskleidžiamajame meniu. Atminkite, kad PNG 24 siūlo daugiau spalvų, todėl dydžiai yra daug didesni nei PNG-8. Pastarąjį rekomenduojame standartiniams žiniatinklio vaizdams. Rodomas langas yra panašus į JPEG.webp langą, be ankstesniame skyriuje jau matytų parinkčių, taip pat galime pasirinkti:
SkaidrumasČia galite pasirinkti skaidrumą, kuris geriausiai tinka jūsų vaizdui, arba pašalinti jį ir pasirinkti tam tikrą spalvą naudodami „Halo“.
Pritaikyti žiniatinkliuiŠis parametras leidžia dar labiau suspausti vaizdą, kuo didesnis reguliavimo procentas, tuo didesnis suspaudimas, tuo mažesnė kokybė ir mažesnis dydis.
8. Išsaugokite „Photoshop“ žiniatinklio vaizdus
1 žingsnis
Kad galėtume atlikti automatinį PNG ir JPEG.webp glaudinimą, atidarome išsaugojimo žiniatinkliui funkciją „File / Save for Web“ arba šį klavišų derinį.
„Alt“ + „Shift“ + „Ctrl“ + S
2 žingsnis
Iš anksto nustatytų parinkčių dešinėje spustelėkite rodomą meniu skirtuką ir pasirinkite Optimizuoti pagal failo dydį.
3 žingsnis
Dabar jums tereikia pasirinkti norimo turėti vaizdo dydį ir programa automatiškai atliks jūsų suspaudimą. Galite keisti vertes, kad gautumėte skirtingus rezultatus.
4 žingsnis
Taip pat galite eiti į langą, pavadintą 4 kopijos, ir pasirinkti vieną iš jums pateiktų versijų iš ten ir išsaugoti.
5 žingsnis
Jei norite pakeisti dydį ir perdavimo greitį, spustelėkite reikšmes po paveikslėliu ir pasirinkite jas automatiškai.
Kaip matote, yra įvairių būdų, kaip sumažinti vaizdų dydį, atsižvelgiant į jų paskirtį. Yra daug parametrų, į kuriuos turite atsižvelgti, tačiau, atsižvelgiant į jums reikalingą lygį, vienas ar kitas bus naudingesnis norint sužinoti, kaip suspausti „Photoshop“ vaizdą. Šiame vaizdo įraše grafiškai parodysime, kaip iš esmės ir visiškai optimizuoti ir suspausti vaizdus. Jei norite greitai suspausti, pirmasis metodas jums bus naudingas, o jei ieškote kažko sudėtingesnio, kur galėtumėte redaguoti visus parametrus, jūsų metodas yra antrasis.