Új magyar Photoshop oldal

Írta: | 2009. május 30. | kategóriák: Blogolok, Hírek, Photoshop | 3 megjegyzés

Nemrégiben Barát Csaba egy új blogot indított a Photoshop megismerésére vágyok számára. A SuperTutorial.hu eltér a magyar tutorialos oldalak zömétől, mivel a tanítások kiváló minőségű videó formájában kerülnek publikálásra. Természetesen, aki nem szeretné megtekinteni a videókat, a fontos lépések szöveges formában is megtalálhatók a beágyazott média alatt.

Elolvasom a teljes bejegyzést »

CSS: menü villogás kivédése

Írta: | 2008. november 23. | kategóriák: (X)HTML, CSS, Design, Web | 10 megjegyzés

A probléma

Legtöbb esetben a sitebuilderek a menügombokat úgy oldják meg, hogy a gomb minden állapota egy külön kép. A probléma az, hogy például egy a:hover vagy a:active állapotváltozásnál, ha a felhasználó a gomb fölé viszi az egeret, eltünik a háttere amíg a hover állapothoz kapcsolódó képet le nem tölti.

[A régi szép időkben, amikor az ilyen egyszerű menüket JavaScript-el csinálták, volt egy opció erre amit preload image-nek hívtak, ám a jelen megoldás egyszerűbb, és szemantikailag, illetve SEO szempontjából is helyes kódot kapunk.]

A menü különféle állapotai

Elolvasom a teljes bejegyzést »

Webdesigner csemege

Írta: | 2008. április 20. | kategóriák: Adatbázis kezelés, Photoshop, Programozás, Web | Nincs megjegyzés

Top tartalom, csillagot érdemel :)A WebPillangó eddigi bő féléves pályafutása alatt született néhágy olyan bejegyzés, ami iránt szépen gyarapodott az érdeklödők száma. A bejegyzés célja egy helyen összegezni ezeknek a bejegyzéseknek a krémét, témától függetlenül, legyen az photoshop, webdesign, web programozás vagy bármi egyéb kiegészítő, mint például a Magyar-Angol, Angol-Magyar Photoshop szótár program formájában megvalósítva.

A csemegézést a legtöbbet értékelt és a legjobb értékelést szerzett bejegyzésekkel kezdem. Az értékelést a bejegyzések alján lehet elvégezni a csillagokat használva. A legtöbb szavazatot a Retró kép készítése segédlet kapta. A legjobb értékelést pedig a WebPillangó Photoshop szótár.

A Google Analytics szerinti, a WebPillangón, a top tartalom (top content) a következőkből áll:

Felhívás, vendég bejegyzés!

Írta: | 2008. március 21. | kategóriák: Blogolok, Hírek, SEO | 5 megjegyzés

Írj vendég bejegyzést a WebPillangóra!

Egy, a tutorialblogon olvasott, bejegyzés felkeltette az érdeklődésem. Éppen ezért a WebPillangó is megpróbálkozik néhány vendég írás befogadásával. Bár akit komolyabban érdekel a téma, az eddig is megtalálhatta az impressszumban, hogy miként tudja bárki bővíteni saját backlink tárát és egyben a WebPillangó tartalmát is, most egy egyszerűbb és szembetűnöbb lehetőséget biztosítok Neked, hogy segíts magadon és segíts a WebPillangón is!

Elolvasom a teljes bejegyzést »

parseGETintoString PHP függvény

Írta: | 2008. február 27. | kategóriák: Blogolok, PHP, Web | 13 megjegyzés

Hosszabb kimaradás után ismét van egy kevés időm, amikor a WebPillangóval is tudok foglalkozni. Sajnálom, a kissebb-nagyobb szüneteket, nem szánédkosak. A bejegyzés azért született, mert ismét azon találtam magam, hogy dinamikusan ki kell cseréljek egy vagy több változót a _GET szuperglobális tömbben. A mellékelt függvény kicseréli és kiírja a kívánt eredményt. Az első paraméterben azt adjuk meg, hogy melyik változót szeretnénk cserélni a második paraméter értékére.

Elolvasom a teljes bejegyzést »

Retró kép készítése

Írta: | 2008. január 20. | kategóriák: Photoshop, Speciális effektek | 35 megjegyzés

A kiindulás pontjaRetró hatást nyújtó kép

A leírásból megtanulhatod, hogyan készíts retró hatású képeket mindössze néhány lépést használva. A leíráshoz szükséged lesz egy Photoshopra és néhány percre. Az első lépés az, hogy válaszd ki az átalakítani kívánt képet. Nyitsd meg a képet, majd duplázd a réteget. A duplázást több módon is elérheted, pl.: jobb klikk a rétegen, majd Duplicate Layer vagy jelöld ki a réteget (ha alapból nem lenne kijelölve) és Ctrl + J billentyűpáros (Command + J). Az eredeti réteget törölheted, a továbbiakban nem lesz rá szükség.

Elolvasom a teljes bejegyzést »

Fraktál készítése Photoshopban

Írta: | 2008. január 16. | kategóriák: Photoshop, Speciális effektek | 1 megjegyzés

A kész fraktálA következő leírás segítséget biztosít fraktálok és véletlenszerű formák készítéséhez Photoshopban. Készíts egy új dokumentumot 300 x 300 képpont mérettel, fekete háttérrel. Ezt követően készít egy új réteget aminek a közepén hozzál létre egy közepes kijelölést. Ezt a kijelölést töltsd ki fehérrel. A Ctrl (Command) gombot letarva üss D billentyüt, így megszünik a kijelölés. Majd üss még egy D billentyüt, ezúttal a Ctrl lenyomása nélkül, hogy visszaálljanak az alap színek (fekete-fehér).

Elolvasom a teljes bejegyzést »

WordPress menu span hack

Írta: | 2008. január 15. | kategóriák: Blogolok, CMS, CSS, Design, PHP | 2 megjegyzés

A minap felkerült egy írás, ahol dinamikusan lehet gombot készíteni CSS segítségével. DeX hozzászólása kapcsán:

Ha a gombon nyomvatartod az egeret, majd lehúzod róla, és ott engeded el, akkor beragad a lenyomott állás?

arra gondoltam, ha már az active-ot hover-re cserélem, használhatom menünek is az egész CSS kódot, a minimális modosításokkal. A CSSben mindössze annyi a tennivaló, hogy az active modosítókat kicseréljük hoverre. Így a link fölé görgetéskor aktíválodik az új kinézet és nem a link lenyomásakor. Miután készen vagyunk a CSS résszel, nyugodtan használhatjuk weboldalainkban.

Mi van akkor, ha a kódot nem mi írjuk? Én arra az esetre gondoltam, amikor a WordPress által kilistázott oldalakat/kategóriákat formázom menüként. A megoldás egy kis ügyesség, okosság. A probléma orvoslását keresve az alábbi megoldást találtam a legmegfelelőbbnek.

Elolvasom a teljes bejegyzést »

Dinamikus gomb készítése CSSt használva

Írta: | 2008. január 13. | kategóriák: (X)HTML, CSS, Design | 16 megjegyzés

Nem számít egy nagyon új dolognak a CSS segítségével megvalósított gomb, viszont a dinamikus szélességgel bíró gomb igenis új távlatokat nyit a weblapkészítésben. A következő leírásban egy ilyen szerű gomb elkészítéséről lesz szó. Először elmondanám, hogyan is működik a gomb, milyen elmélet alapján, majd a szükséges kódot is közzéteszem.
Az ötlet az, hogy ne legyen egy statikus háttér, amiről lefuthat a szöveg, ha éppen hosszabb, mint a kép maga. Persze ezt elméletben ne lehet tökéletesen kiküszöbölni, még szerencse, hogy a gyakorlati világban élünk. A háttér dinamikus szélességét annak köszönhetjük, hogy a linkekbe nem a szöveget helyezzük, ahnem egy span elemet, ami tartalmazza a szöveget, így valójában két hátterünk van: egy nyitó, ami nyulni is fog, ahogy a szöveg egyre hosszabb (persze csak egy pontig, de mivel mi határozzuk meg, nem okoz gondot) és egy záró háttér, amely lezárja az első háttér végét, így egységes megjelenést biztosít.

Elolvasom a teljes bejegyzést »

Behavazás Photoshoppal

Írta: | 2007. december 01. | kategóriák: Blogolok, Design, Speciális effektek | 2 megjegyzés

Ahogyan azt a fórumban beígértem, téli témába vágó leírások következnek. Kezdésnek egy behavazott effektet mutatok be, amit sokfelé újrahasznosíthatsz: weboldalad téli designra váltásánál, behavazott fejlécnek, képeslapnak, stb. Szükséged lesz néhány grunge stílusú ecsetre is, rengeteg van az interneten. Ha nem találsz, az sem gond, alap ecsetekkel is el lehet készíteni. Jó szórakozást!
Fehérre színezett felső részAz első lépés, mint máskor is, az új dokumentum létrehozása, bár ez esteben nem számít a háttérszín. Válassz két világoskék színt előtér és háttérszínnek (foreground, background), majd egy vertikális színátmenettel töltsd ki az alap réteget. Ha készen vagy, válaszd a fehért, mint előtérszín és keress egy puha ecsetet. Hozz létre egy új réteget és színezd ki a képed felső részét. Ezt követően válassz egy szétzúzott ecsetet és egy új rétegen próbáld felrojtozni a havat.

Ezt követően hasonló, tört, ecsetekkel próbáld neked megfelelőre formázni a hó lelógó részeit. Ha befejezted a fehérítést, akkor egy új rétegen, készíts egy szétszórt fekete mintát, ugyancsak egy karcos ecsettel. A fekete réteg áttetszőségét állítsd egy alacsony értékre, hogy csak egy kevés árnyékot/piszkosságot adjon a hónak.

Elolvasom a teljes bejegyzést »