Jak z obrázku v PNG s transparentním pozadím udělat obrázek v JPG

Petra Procházková
Autor: Petra Procházková


Datum: 18 listopad 2016

Při práci s galerií Event Gallery jsme si všimli, že obrázky ve formátu PNG s transparentním pozadím zobrazuje s černým pozadím, což nemusí být vždy žádoucí...Proto si v tomto jednoduchém návodu ukážeme, jak takový obrázek přeuložíme v editoru Paint.net na jpg, například s bílým pozadím. 

Možná si řeknete, že tohle je takový tutoriálek pro úplné amatéry, a on taky je. Ale nikdo učený z nebe nespadl a určitě se najde spousta lidí, pro které to bude úplně nová a fantastická věc. Takže kdo už to umí, pokračuje na další a lepší, a kdo to nikdy nedělal, nechť se pohodlně usadí a sleduje.

Pro začátečníky - výhodou obrázků na transparentním /průhledném/ pozadí je, že je můžete umístit na webu téměř kamkoliv a nebude to vypadat jako pěst na oko - čili, kdybyste měli webové stránky, které mají třeba černé pozadí, a pak vám někdo dal logo na bílém pozadí, po vložení by to vypadalo nějak takto:

pozadi loga

Vedle toho vidíte, že obrázek s transparentním pozadím můžete vložit kamkoliv a zapadne (samo pokud byste toto logo konkrétně dali na černé nebo zelené pozadí, tak se ztratí kvůli nedostatku kontrastu taky - pro názornost jsem tedy zvolila pozadí šedé).

A teď už se podívejte na to, jak pomocí editoru Paint.net (ale umí to jakýkoliv editor, který pracuje s vrstvami, např. Adobe Photoshop, který je ale placený), přeuložíte obrázek na bílé pozadí.

Využijete to např. obrázků pro Event Gallery, kde se obrázky s transparentním pozadím zobrazují jakoby na černém pozadí (po rozkliknutí už je bílé):

eventgallery transparentni pozadi

Ale třeba také u loga pro faktury v eshopu Virtuemartu - nastavení eshopu to sice píše, že lze nahrát i png, ale občas to dělá neplechu, takže JPG je jistější. Více k tomuto problému zde...

Videonávod úpravy transparetního PNG na JPG

Mohlo by vás také zajímat...

Chcete se na něco zeptat?
1000 znaků zbývá
facebook StaWEBnice twitter StaWEBnice YouTube StaWEBnice Google+ StaWEBnice