ugrás a tartalomhoz
Dobd fel honlapodat átlátszó PNG-k trükkös használatával!

Mindig jól jön a honlapunknak még egy kis javítás, tuningolás, törődés. Honlapépítőnk, bár meghatározott kereteken belül képes csak mozogni, így is van jó néhány kiskapu, melyet kihasználva, exkluzívabb külsőt kölcsönözhetünk weboldalunknak. Az egyik ilyen módszer az átlátszó képek (átlátszó .png) használata.

Hogyan használjunk egy átlátszó png-t?

A szép logó átlátszó hátterű

Logó a fejlécben: Ha van egy logónk, melynek fehér a háttere, akkor az úgy mutat igazán jól, ha átlátszóvá tesszük a hátterét.
Logó elhelyezése a főoldal tetején a banner sávban: A banner sávhoz a szövegen túl plusz képet is hozzáadhatunk. Ilyen esetben szinte alapfeltétel az átlátszó kép használata, viszont azzal nagyon elegáns összhatást érhetünk el. Néhány példa ennek szemléltetésére:(https://toolmaster.domdom.eu/, https://tatra.hu/, https://financialconsultancy.domdom.eu/, https://pizzapost.domdom.eu/, https://hu-bakery.domdom.eu/)

Egy átlátszó kép csodákra képes

Termékképek elhelyezése semleges háttér előtt: Nem csak logót képeket is elhelyezhetünk a bannersávban egy semleges háttér előtt. Ez kiváló módja például termékek megjelenítésének: (https://shoes.domdom.eu/webshop, https://tiles.domdom.eu/webshop)
Képek elhelyezése színes háttér előtt: Honlapszerkesztőnk bizonyos sávjainak háttérszíne változtatható. Ha egy sávot fekete háttérrel szeretnénk használni, kiválóan mutathat rajta egy átlátszó png-ként elkészített termék kép. Gondoljunk például egy szerszámkészletre, vagy egy pék termékre mennyivel elegánsabb, ha nem egy fehér téglalapban helyezzük el a fekete háttéren, hanem maga a fekete szín képezi a háttéret.

Ha designerek vagyunk...

Ikonok használata: Egyedi ikonokat is készíthetünk, például szolgáltatásaink bemutatására: (https://green-energy.domdom.eu/)
Grafikai elemek: Ez már kicsit haladóbb kategória, de mindenképpen érdemes megemlíteni, mert az igazán professzionális összhatáshoz nélkülözhetetlen. Bármilyen grafikai elemet létrehozhatunk, amelyet aztán átlátszó png-ként felhasználva szuper látványos hatást érhetünk el. Erre kiváló példa a https://tatra.hu/ oldal tetjén a banner sáv. A sáv alján látható hegyvonulat sziluett a kis piros figurákkal, nem más mint egy szimpla átlátszó png, ráhelyezve a bannersáv hátterére.

Hogyan készítsünk átlátszó png-t?

Ha már eldöntöttük, hogy feltuningoljuk az oldalunkat pár látványos png-vel, már csak el kell készíteni azokat.

A Photoshop a csúcs

Amennyiben van kéznél photoshop és még értünk is hozzá, akkor mindenképpen javasoljuk annak használatát. Szép, kontúr mentes átlátszó képeket eleve csak ezzel lehet létrehozni, de a bonyolultabb hátterek eltávolítása nem is lehetséges nélküle.

Egyéb lehetőségek

No de mit tehetünk, ha a Photoshop-nál egyszerűbb, kézenfekvőbb megoldást szeretnénk? Ez esetben is vannak lehetőségeink. Ügyes használattal az online háttéreltávolítók is egészen szép eredményeket adhatnak. Az egyik legjobb online png szerkesztő a https://onlinepngtools.com/ Itt rengeteg opciónk van bűvészkedni a képünkkel és köztük megtaláljuk a háttér eltávolítót is: https://onlinepngtools.com/create-transparent-png. Itt egy feltöltött kép kiválasztott színét tudjuk eltávolítani és a kép alatti paraméterekkel elég jól tudjuk finomítani a törlés mértékét. Ha több színt szeretnénk eltávolítani, mentsük le a végeredményt és töltsük fel újra a képet, egy újabb szín eltávolításához.Ha bonyolultabb háttereket szeretnénk eltávolítani, akkor is van néhány javaslatunk. Ezen eszközöknél csupán fel kell töltenünk a választott képet és a rendszer automatikus elvégez mindent. Amiatt főként személyek, jól elkülöníthető tárgyak kivágására használhatjuk az alábbi oldalakat:
https://www.pixmiller.com/en/
https://www.cutout.pro/
https://www.remove.bg/