▷ Jak Zkomprimovat OBRÁZEK ​​ve FOTOSHOPU

Vlastní webové stránky nejsou založeny pouze na nekontrolovaném nahrávání obsahu, musíte se postarat o strukturu webu včetně všech prvků, které na něm hostujeme. Je třeba vzít v úvahu, že je k němu přistupováno prostřednictvím připojení k internetu a že ačkoli na mnoha místech existují vysoké rychlosti, v jiných stále poněkud zaostávají. To vše bez zohlednění důležitosti mobilního tématu a výdajů megabajtů. Proto je komprese obrázků bez ztráty kvality Photoshopu velmi vyhledávaným úkolem tvůrců, kteří myslí v zájmu uživatelů.

Co bychom neměli dělat, je proměnit náš web v pomalý prostor, do kterého lidé nechtějí znovu vstoupit, čehož se můžeme vyvarovat, pokud vezmeme v úvahu různé prvky a naučíme se komprimovat obrázky ve Photoshopu. Jedním z nich a velmi důležitým je nahrávání obrázků. Pokud máte web se spoustou vizuálního obsahu, musíte se o něj starat zevnitř i zvenčí komprimací obrázků Photoshopu a zrychlením stránky.

Rychlost našich webových stránek je pro uživatelskou zkušenost zásadní, protože vstup na rychlou stránku, která neovlivňuje naše připojení k webu, kde se všechny objekty, které vidíme, načítá velmi pomalu, není stejný. Kromě toho, aby byly obrázky vidět, je třeba je stáhnout na server, takže čím vyšší je hlasitost, tím déle bude načítání trvat a uživatel pravděpodobně zoufá a odejde. Proto je důležité upravovat obrázky ve Photoshopu a vylepšovat náš web nebo prostě náš prostor tím, že budeme vědět, jak obrázky ve Photoshopu komprimovat.

Pokud nahrajete velmi těžké obrázky, bude vaše stránka pomalá a uživatelé se unaví a odejdou. Pokud se chcete vyhnout ztrátě návštěv, postarejte se o vše, co nahrajete, a naučte se komprimovat obrázek ve Photosho a zmenšovat jeho velikost.

1. Typy formátů obrázků ve Photoshopu

Abychom mohli mluvit o optimalizaci obrázků, musíme rozlišit, jaký typ formátu obrázku máme a který je pro nás nejlepší.

Formát JPEG.webpPro běžné fotografické použití je to standardní formát s dobrými výsledky. Podporuje 24bitové barvy.

Formát PNG-8Je to alternativa k GIF.webp, ale bez animací a může zobrazit až 256 barev. Jeho komprese pro web je jednou z nejvhodnějších a umožňuje dobrou kvalitu se zmenšenými velikostmi.

Formát PNG-24Je to dobrá volba pro export kvalitních obrázků stejně jako JPEG.webp. Tento typ rozšíření je vhodný, když máme obrázek, který obsahuje průhlednost. Zobrazuje také až 16 milionů barev, protože podporuje 24bitové barvy.

Formát GIF.webpJe to formát pro animace par excellence. Představuje až 256 barev ve tvarech velkého množství plné barvy, čar nebo textu.

Pro tento tutoriál vybereme dva nejužitečnější a nejpoužívanější formáty pro nahrávání obrázků na web: JPEG.webp a PNG-8.

2. Jak zkomprimovat obrázek ve Photoshopu

Když pracujeme v pracovním prostoru ve Photoshopu, děláme to podle určitých parametrů v závislosti na obrázku nebo obecné povahy. Jedním z nich je velikost, proporce obrazu, se kterým pracujeme. Velikost obrázku odpovídá počtu pixelů, které obsahuje svisle a vodorovně, což vede k velikosti obrázku.

To, čemu říkáme rozlišení, znamená počet kusů informací v konkrétním prostoru, který se nazývá pixely na palec nebo dpi. To znamená, že čím vyšší je počet pixelů na palec, tím vyšší bude naše rozlišení.

Jakmile jsou oba aspekty odlišeny, je třeba poznamenat, že dva obrázky mohou mít stejnou velikost, ale různé rozlišení a proporce. Pokud se jedná o obrázky pro web, doporučuje se s velikostmi zacházet ve velikosti pixelů. Chcete -li se k němu dostat, přejděte na Obrázek / Velikost obrázku nebo stiskněte následující kombinaci.

Ctrl + Alt + I

PoznámkaMožnost Převzorkovat obrázek nám umožňuje změnit velikost bez změny rozlišení. Vyberte nejvhodnější možnost pro to, co potřebujete.

3. Změňte barevný profil Photoshopu

Barevný prostor, kde pracujeme, také ovlivní konečný soubor. Je třeba zmínit rozdíl mezi prostorem sRGB a RGB. Systém Adobe RGB představila společnost v roce 1998 a skládá mnohem širší spektrum barev než prostor sRGB. To neznamená, že je to horší, ale že se věnují různým cílům.

Systém RGB je svým spektrem bližší spektru CMYK, který je orientován na svět tisku. Navzdory více barvám je standardem digitálně distribuovaným v zařízeních, ať už jde o mobilní telefony, monitory nebo jakékoli digitální zařízení, standard sRGB. Když jedno z těchto zařízení narazí na RGB, pokusí se komprimovat přebytečné barvy a vytvoří falešný sRGB s horšími výsledky.

Krok 1
Proto se doporučuje pořizovat fotografie, pracovní prostor ve Photoshopu nebo je optimalizovat pomocí tohoto systému, aby se zlepšila kompatibilita barev. Chcete -li změnit profil pracovní barvy, přejděte do nabídky Upravit a vyberte možnost Převést na profil.

Krok 2
V dalším okně budete muset vybrat pouze požadovaný profil, v tomto případě sRGB.

4. Komprimujte obrázek bez ztráty kvality Photoshopu

Formát JPG.webp je nejpoužívanějším standardem a přestože umožňuje kompresi, nenabízí tolik upravitelných parametrů jako PNG. Konečnou hmotnost našeho obrázku můžeme změnit změnou velikosti fotografie nebo při exportu.

Krok 1
Při ukládání do formátu JPEG.webp vidíme, že máme dvě možnosti, na jedné straně konfigurovat možnosti obrázku (kvalitu) a na druhé straně možnosti formátu. Chcete -li to provést, přejděte do nabídky Soubor / Uložit jako nebo do následující kombinace a vyberte formát JPEG.webp.

Shift + Ctrl + S

Krok 2
Tyto konfigurační parametry se zobrazí v dalším okně. Podívejme se, co každý z nich znamená.

Možnosti obrázkuZde musíme zvolit konečnou kvalitu obrázku, je evidentní, že čím vyšší kvalita, tím větší velikost souboru, abychom mohli vidět, co nakonec obsadí, když klikneme na Náhled. Chcete -li tyto hodnoty upravit, přesuňte lištu.

Pokud chceme, aby fotografie tiskla velikost plakátu, musíme vybrat mnohem vyšší kvalitu, než když chceme obrázek pro web. Pamatujte, že čím větší je velikost obrázku, tím více zdrojů bude potřeba k jeho načtení přes web.

Možnosti formátováníUvnitř zde najdeme různé alternativy, které poskytnou konečný formát našeho obrázku. Nejvíce doporučovaná je standardní základní linie, protože je obvykle nejvíce kompatibilní.

• Výchozí („standardní“). Využívá použití formátu, který je rozpoznatelný drtivou většinou webových prohlížečů a programů. V současné době nejnovější programy obvykle neposkytují nekompatibility.

• Optimalizovaná základní linie. Tento formát vytvoří obrazový soubor, který obsahuje optimalizované barvy, takže získáte menší velikost.

• Progresivní. Díky této možnosti se zobrazí různé verze, které budou při stahování stále podrobnější. O tom, kolik jich bude vytvořeno, rozhoduje uživatel. Je to formát, který byl používán a hodně se používá, když přejdeme na pomalá připojení, která vyžadují načtení rozmítání.

PoznámkaJe třeba zmínit, že ne všechny prohlížeče rozpoznávají nebo podporují obrázky JPEG.webp, které jsou progresivní nebo optimalizované.

5. Komprimujte obrázky PNG ve Photoshopu

Krok 1
Chcete -li exportovat jako PNG, musíme udělat stejný první krok jako u ostatních formátů, přejděte do nabídky Soubor / Uložit jako a v tomto případě vyberte PNG.

Krok 2
Nyní v okně pro uložení uvidíte, že se objevují různé možnosti.

KompreseMůžeme vybrat požadovaný typ komprese nebo žádný, pokud nechceme, aby byl použit. V závislosti na volbě se rychlost načítání zvýší nebo sníží.

VazbaTato možnost je důležitá, zvláště pokud mluvíme o webových platformách. Podívejme se na rozdíl:

• Ani. Tato možnost umožňuje zobrazení obrázku pouze tehdy, když byl plně načten, to znamená, že pokud máme pomalé nebo problémové připojení, obrázek se nezobrazí, dokud nebude načten v internetovém přenosu.

• Propletené. Tato možnost je více doporučována pro webové služby, protože při načítání zobrazuje zmenšené verze obrázku. To pomáhá procesu stahování být menší a také uživatel bude vědět, že se obrázek stahuje.

6. Ukládejte obrázky JPG.webp pro web Photoshop

Krok 1
Jednou z nejvýhodnějších možností, které ve Photoshopu pro optimalizaci obrázků máme, je Uloženo jako web, který nám umožňuje ručně upravit různé parametry. Toto uložení je velmi užitečné pro obrázky určené k nahrávání na web, které umožňují kvalitní obrázky, ale se zmenšenou velikostí. K tomu jdeme Soubor / Uložit na web nebo provedeme následující kombinaci.

Alt + Shift + Ctrl + S.

Krok 2
Pokud chceme vybrat JPEG.webp, budeme mít tato nastavení.

Kvalita obrazuVyberte požadovanou kvalitu obrazu od Nízké po Maximum nebo s hodnotami vpravo. Změnu velikosti můžete vidět pod obrázkem vlevo.

ProgresivníObraz se bude načítat kousek po kousku, to znamená, že přejdeme od vidění v nízkém rozlišení ke skutečnému.

ProkládanéZobrazí obrázek, pouze pokud je plně načten.

SvatozářPokud je obrázek průhledný, vyberte halo barvu odpovídající pozadí stránky, kam bude vložen.

Vložit barevný profilTuto možnost vyberte, chcete -li zachovat profil ICC obrázku, některé webové prohlížeče jej používají k opravě barvy.

Převést na sRGBTento profil použijte ke zlepšení kompatibility barev na zařízeních a monitorech.

Máte další možnosti, jako je režim náhledu, metadata nebo změna velikosti s omezením nebo bez omezení.

7. Ukládejte obrázky PNG pro web Photoshop

Krok 1
Jak již víme, abychom mohli přistupovat k Uloženo pro web v PNG, musíme přejít na Soubor / Uložit pro web. Pamatujte, že tento formát je velmi vhodný pro obrázky s webovým cílem, protože jeho výsledek poskytuje velmi dobrý vztah mezi kvalitou a hmotností souboru.

Krok 2
Chcete-li exportovat jako PNG, vyberte jej z rozevírací nabídky. Pamatujte, že PNG 24 nabízí větší množství barev, takže velikosti jsou mnohem vyšší než velikosti PNG-8. Ten druhý doporučujeme pro standardní webové obrázky. Okno, které se zobrazí, je podobné oknu JPEG.webp a kromě možností již viděných v předchozí části můžeme také vybrat:

PrůhlednostZde můžete vybrat typ průhlednosti, který nejlépe odpovídá vašemu obrázku, nebo jej odstranit a pomocí Halo vybrat konkrétní barvu.

Přizpůsobit na webTento parametr umožňuje další kompresi obrazu, čím vyšší je procento úprav, tím vyšší je komprese, tím nižší je kvalita a menší velikost.

8. Ukládejte obrázky pro web Photoshop

Krok 1
Aby bylo možné provádět automatickou kompresi pro PNG i JPEG.webp, otevřeme uložení pro web v nabídce Soubor / Uložit pro web nebo následující kombinaci kláves.

Alt + Shift + Ctrl + S.

Krok 2
Vpravo od možnosti Předvolby klikněte na zobrazenou záložku nabídky a vyberte Optimalizovat na velikost souboru.

Krok 3
Nyní stačí vybrat velikost obrázku, který byste chtěli mít, a program automaticky provede kompresi za vás. Hodnoty můžete měnit, abyste získali různé výsledky.

Krok 4
Můžete také přejít do okna s názvem 4 kopie a vybrat jednu z verzí, které jsou vám poskytnuty, a uložit ji.

Krok 5
Pokud chcete upravit velikost a přenosovou rychlost, klikněte na hodnoty pod obrázkem a vyberte je automaticky.

Jak vidíte, existují různé způsoby, jak zmenšit velikost obrázků v závislosti na jejich účelu. Existuje mnoho parametrů, které musíte vzít v úvahu, ale v závislosti na požadované úrovni bude pro komprimaci obrázku Photoshopu užitečnější jeden nebo druhý. V následujícím videu vám graficky ukážeme, jak optimalizovat a komprimovat obrázky základním a úplným způsobem. Pokud chcete rychlou kompresi, bude pro vás první metoda dobrá a pokud hledáte něco složitějšího, kde můžete upravit všechny parametry, je vaše metoda druhá.