Skip to main content

Používanie transparentných obrázkov na webe a v tlači

Anonim

Takže ste práve opatrne odstránili pozadie z obrázka a teraz chcete použiť čiastočne priehľadný obrázok niekde inde. Čo robíš? Odpoveď závisí od toho, kam idete.

Z Photoshopu (verzie pred CS4)

Ak pracujete vo Photoshope a budete tlačiť alebo na webe, pozrite si Sprievodcu exportovaním priehľadných obrázkov umiestneným v ponuke Pomocník. Bude vás opýtať sériu otázok a exportovať obrázok v príslušnom formáte. Táto možnosť bola odstránená v aplikácii Photoshop CS4.

Existujú skutočne len dva spôsoby zobrazovania digitálneho obrazu. Obraz sa bude buď zobrazovať na obrazovke, ako je displej smartphone, tabletu alebo pracovnej plochy (alebo väčšej), alebo v tlači. Takže rozhodnutie sa znižuje na formát súboru.

Obraz ide na obrazovku.

Máte tri možnosti: GIF, PNG alebo "predstieranie s JPEG".

  • GIF: GIF je pôvodný formát s podporou transparentnosti pre web. Problém s GIF je, že znižuje paletu farieb na maximálne 256 farieb, čo spôsobuje posun farieb, posterizáciu alebo páskovanie farieb a skreslenie vo vysoko farebných obrázkoch, ako sú fotografie. Ak sú fyzické rozmery obrázka malé alebo budete odosielať obrázok na sociálne médium, ako je napríklad Twitter, používanie obrázka vo formáte GIF je dôležité. Ďalšou nevýhodou systému GIF je, že podporuje iba 1-bitovú transparentnosť. Čo to znamená, že každý pixel vo vašom obraze je buď úplne transparentný alebo nie je priehľadný.
  • PNG: PNG je formát vyvinutý na prekonanie mnohých obmedzení GIF a výhodnejšou voľbou pre priehľadné obrázky. Formát súboru podporuje vysokú farebnosť a čiastočnú priehľadnosť pomocou alfa kanálov. Transparentné súbory PNG boli podporované už od IE7 a dnes sú podporované vo všetkých populárnych webových prehliadačoch, takže v týchto dňoch je bezpečné používať PNG, pokiaľ nepoznáte, že veľká časť vášho publika používa veľmi starý hardvér a softvér. Obrazy PNG sú tiež bežne viditeľné na mobilných zariadeniach.
    • Poznámka: ak si chcete zachovať úplnú transparentnosť bez toho, aby ste použili anti-aliasing halo, musíte uložiť súbor PNG ako PNG-24 a nie PNG-8. PNG-8 je užitočný pre zmenšenie veľkosti súborov PNG, keď nepotrebujete priehľadnosť, ale má rovnaké obmedzenia palety farieb ako súbory GIF.
    • Ďalším bežným formátom PNG je PNG-32. Nie je to však 32-bitový obrázok s miliardami farieb. Ide o štandardný 24-bitový obraz s extra 8-bitovým kanálom v odtieňoch šedi použitom pre priehľadnosť. Keď ste v dialógovom okne Exportovať ako v programe Photoshop, ak kliknete na začiarkavacie políčko Priehľadnosť, vytvárate obrázok PNG-32.
  • Fake Transparency s JPEG: Ide o prácu, v ktorej sú oblasti obrázka, ktoré chcete transparentne, naplnené rovnakou farbou alebo štruktúrou pozadia ako webová stránka, na ktorú budú umiestnené. Toto funguje najlepšie pri umiestnení obrázka na plné farebné pozadie alebo na malom, jemne texturovanom pozadí, kde zarovnanie nebude problémom. To je jeden spôsob, ako to spraviť. Ďalšou možnosťou je použiť nástroj na výber buď na maskovanie oblasti s plnou farbou alebo na použitie vyplniť príkaz na vyplnenie výberu s plnou farbou.

Obraz sa nasmeruje na aplikáciu na rozloženie stránky, ako je InDesign, QuarkXpress alebo PageMaker.

Máte tu tri možnosti: natívny formát PSD Adobe, vložené cesty alebo alfa kanály.

  • Adobe natívny PSD formát: PSD si zachováva transparentnosť medzi aplikáciami Adobe, takže ak pracujete úplne v aplikáciách Adobe, použite prirodzený PSD formát Photoshop s priehľadnosťou.
  • Vložené cesty (EPS): Obrázky EPS podporujú používanie vložených orezových ciest a väčšina aplikácií pre publikovanie na pracovnej ploche bude akceptovať formát EPS. Keď sa priehľadné priečinky používajú ako vložené cesty, izolovaný objekt môže mať len tvrdé okraje. Neexistuje žiadna čiastočná transparentnosť.

Alfa kanály (TIFF): Alfa kanály sú bitmapové masky, ktoré definujú priehľadnosť v odtieňoch šedej. Pri použití v aplikáciách rozloženia stránok je preferovaný formát TIFF pre obrázky s priehľadnosťou kanálov alfa.