CSS változók
CSS változók használatával átláthatóbbá tehetjük a forráskódot. A megvalósításhoz a var() függvényt használjuk.
Tovább olvasomWebdesign blog
Ezt az oldalt 2010. január 10-én indítottam azzal a céllal, hogy a webdesign szakmát népszerűsítsem. Azóta rengeteg anyagot osztottam meg a blogon és a YouTube csatornámon. Ezeket a tartalmakat rendszeresen frissítem, az elavult videókat törölni szoktam.
2020-tól az itt található anyagokkal kapcsolatban nem végzek support tevékenységet, az ezekkel kapcsolatos megkeresésekre idő hiányában sajnos nem tudok válaszolni. A kommentelési lehetőséget is meg kellett szüntetnem, mert annyira sok hozzászólás érkezett, hogy már egyszerűen nem tudtam mindenkinek válaszolni.
Köszönöm a rengeteg hozzászólást, bíztatást, a jövőben is igyekszem tartani a színvonalat.
Webdesign blog kategóriák
After Effects (1)
Bevezetés a videókészítés alapjaiba.
Hobby (5)
Dokumentált szabadidős tevékenységeim. Fúrás-faragás, lakásfelújítás, főzés...
HTML, CSS (24)
Minden ami kódolással kapcsolatos, HTML, CSS, Bootstrap, parallax scrolling, animációk.
Illustrator (3)
Vektoros rajzolás
InDesign (3)
Kerülj képbe a kiadványszerkesztés alapjaival!
Photoshop (6)
Tanuld meg a világelső képfeldolgozó program használatát alapoktól a felső szintig!
Webdesign (12)
Minden ami webdesign, prototyping, WordPress, akadálymentesség, hírlevél készítés...
Összes bejegyzés (54)
CSS scroll snap
A CSS scroll snap segítségével snap point-okat hozhatunk létre, és a görgetés során ezeknél a pontoknál fog megállni a scrollbar.
Tovább olvasom
Konyhai munkalap és mosogató csere
A tönkrement mosogatógép kiváló alkalmat biztosított egy kis konyhai felújításra.
Tovább olvasom
CSS grid layout
A videóban megnézzük, hogyan tudunk natív CSS-sel egyszerű 12 oszlopos grid-et létrehozni.
Tovább olvasom
A Bootstrap használata
Az alábbi videó bemutatja a Bootstrap általános használatát. Bootstrap verzió: v5.1.3
Tovább olvasom
InDesign: egyedi felsorolás készítése
Ezzel a módszerrel bármilyen vektoros ikont használhatunk felsorolásjelnek.
Tovább olvasom
Reszponzív tipográfia
Az alábbi módszerrel a viewport-hoz igazíthatjuk a betűméretet, sorközöket, vagy akár margókat is.
Tovább olvasom
Reszponzív slider / fader JavaScript nélkül
Képrotáló carousel készítéséhez nem feltétlenül van szükség JavaScript-re. Néhány sor CSS-sel is látványos eredményt érhetünk el.
Tovább olvasom
Reszponzív táblázatok
A táblázatok megjelenítésére mobil eszközön több lehetőség létezik, ezek közül mutatok most kettőt a videóban.
Tovább olvasom
Photoshop tanfolyam
Ebből a 22 részből álló 5 és fél órás videóból megtanulhatod a Photoshop használatát az alapoktól.
Tovább olvasom
Ytong válaszfal készítése panellakásban
Amióta megvettem ezt a lakást, azóta gondolkodom, hogy ki kellene dobni ezt a ronda kétszárnyú ajtót a két szoba közül.
Tovább olvasom
Image processor a Photoshop-ban
Tömeges képfeldolgozás, átméretezés, vízjelezés az image processor használatával.
Tovább olvasom
Bőr retusálás Photoshop-ban
Hogyan lesz a ragyás bőrből babapopsi, avagy a bőr retusálása Photoshop-ban a Spot Healing Brush és Clone Stamp eszközök használatával.
Tovább olvasom
Webdesign tanfolyam: HTML + CSS alapoktól a felső szintig
Ebből a 13 leckéből álló 7 órás videóból megtanulhatod a webdesigner szakma alapját, a HTML + CSS kódolást. Az anyagok ugyanúgy egymásra épülnek, mint a webdesign tanfolyamoknál.
Tovább olvasom
InDesign kezdőknek
Ha még sosem használtál InDesign-t, de szeretnéd megtanulni, ez a videó a segítségedre lehet.
Tovább olvasom
A shape-outside CSS property
A shape-outside CSS property használatával egyszerűen körbe tudunk folyatni szöveggel bármilyen alakzatot vagy képet.
Tovább olvasom
FOIT, FOUT és a font-display property
Webfontok használata esetén gyakori jelenség a FOUT és FOIT. Nem komoly problémáról van szó, de, ha valaki azonban abszolút 100%-os performance-ra törekszik, érdemes egy kicsit elmerülni a témában.
Tovább olvasom
Adobe XD VS. Lunacy
Az Adobe XD egyre több hasznos funkcióval rendelkezik amivel működést lehet szimulálni. A Lunacy pedig a Mac only Sketch-ben létrehozott fájlok Windows-os környezetben való szerkesztését hivatott megoldani. Mindkét program ingyenes. Lássuk a hasonlóságokat és a különbségeket!
Tovább olvasom
SVG animáció GSAP használatával
Vektorgrafikus képeket akár elemenként is animálhatunk.
Tovább olvasom
Pico CMS
Adatbázist nem igénylő weboldalakhoz használható egyszerű és gyors flat file CMS.
Tovább olvasom
Ingyenes grafikai programok
A videókban két ingyenes grafikai program kerül bemutatásra, a Gravit Designer és a Vectr.
Tovább olvasom
WordPress sablonkészítés
Az oldalak tartalmát kétféle módon tölthetjük fel WordPress-ben: használhatjuk az admin szerkesztőjét, vagy létrehozhatunk külön fájlokat minden oldalhoz.
Tovább olvasom
CSS box-sizing
A box-sizing CSS3 tulajdonsággal tudjuk megadni, hogy az adott elem szélessége hogyan kerüljön kiszámításra.
Tovább olvasom
CSS mértékegységek
Rengeteg mértékegység létezik a betű- és egyéb méretek megadására. Az abszolút egységek mérete nem függ a szülő elemtől, míg relatív megadás esetén a betű mérete valamelyik felette található elem betűméretétől függ.
Tovább olvasom
InDesign data merge: változó adatok kezelése
Tisztára mint WORD-ben a körlevél készítés. Csak ez működik is.
Tovább olvasom
HTML5 banner készítés
HTML5 banner, CSS3, transition, animáció, keyframes, meg minden, amit akartok.
Tovább olvasom
Photoshop: banner mutációk készítése
A slice tool és a smart object-ek használatával egyszerűen és gyorsan készíthetünk különböző méretű bannereket egy adott kampányhoz.
Tovább olvasom
Hírlevél készítési tanácsok
A hírlevél küldést, mint online marketing eszközt, ma már minden e-kereskedelemmel foglalkozó cég rendszeresen használja. Elenyésző viszont azok száma akik komolyabb időt fordítanak erre a témára. A legtöbb hírlevél rosszul szerkesztett, csúnya és mobileszközökön nehezen olvasható.
Tovább olvasom
WordPress bővítmények
Gyakran felmerülő téma, hogy a WordPress tartalomkezelővel készített weboldalak nem jók. Akik ezt hangoztatják, a nem túl szakszerűen, bővítményekből összelegózott oldalakra céloznak ami abszolút jogos felvetés és maximálisan egyetértek vele.
Tovább olvasom
Egyedi kinézetű checkbox és radio button készítése
A custom select után, itt a custom radio és custom checkbox is.
Tovább olvasom
Egyedi kinézetű SELECT készítése
A legkisebb mértékben sem támogatom a videóban ismertetett megoldások használatát, de sajnos néha rá vagyok kényszerülve.
Tovább olvasom
Responsive progress bar
Ezt a kódrészt mostanában készítettem és gondoltam megosztom veletek, hátha valakinek hasznára lesz egyszer.
Tovább olvasom
Illustrator: Google Drive logó
A méltatlanul elhanyagolt Illustrator kategória két év után újabb anyaggal bővült.
Tovább olvasom
Responsive menü
Felbontásfüggetlen menü, mely mobil eszközön összeugrik és hamburger ikonnal nyitható.
Tovább olvasom
CSS háromszög
Tudtátok, hogy CSS-el bármilyen méretű és formájú háromszög megrajzolható? Alig néhány sornyi kód, ráadásul cross browser megoldás.
Tovább olvasom
CSS pozicionálás
Ez a rész valamiért teljesen kimaradt a korábbi HTML+CSS videókból, úgyhogy most megnézzük mi a különbség a static, absolute, relative és fixed pozicionálás között.
Tovább olvasom
Dia szkennelés házilag
Az analóg korszakban készült családi fotó és videógyűjtemény nagy részét sikerült digitalizálnom az elmúlt években. Már csak a diák maradtak hátra, ami viszont okozott némi fejtörést.
Tovább olvasom
Vezetékcsere panelben
A probléma gondolom sokak számára ismerős: panellakás, régi alumínium vezetékek, megégett kötések, földelés csak a fürdőben, esetleg a konyhában.
Tovább olvasom
Photoshop: régi képek retusálása
Nincs is jobb, mint hideg őszi estéken szkennelgetni az ezer éves családi fotókat. Ha azonban igazán jó eredményt szeretnék elérni, akkor sajnos elkerülhetetlen a képek utólagos feldolgozása.
Tovább olvasom
Illustrator: névjegykártya tervezés
A videóban megnézünk néhány hasznos funkciót, mely megkönnyíti a tervezést, illetve külön kitérek arra, hogy milyen formátumban célszerű küldeni a nyomdának az anyagot.
Tovább olvasom
Hogyan kell önéletrajzot készíteni?
Milyen egy jól szerkesztett önéletrajz? Sajnos egyáltalán nem olyan amilyet az emberek többsége el szokott küldeni amikor egy állásra jelentkezik.
Tovább olvasom
CSS transition
Bevezetés a CSS3 animáció világába. Micsoda megváltás lesz, ha mindenki HTML5 + CSS3 támogató böngészőt fog végre használni.
Tovább olvasom
A grafikai tervezés 4 alapelve
Először egy OpenOffice dokumentumot készítünk, majd megnézzük Photoshop-ban hogyan érvényesíthetőek az angolul ironikusan CRAP rövidítést viselő szabályok.
Tovább olvasom
Elektromos rizsfőző
Régi vágyamat sikerült beteljesítenem a hétvégén: vettem egy rizsfőzőt. Rengeteget olvastam róla korábban. Ezzel állítólag nem lehet rossz rizst csinálni, a használata pedig megalázóan egyszerű.
Tovább olvasom
Tömeges képátméretezés IrfanView-ban
A tömeges képátméretezés elég gyakran megoldandó feladat, amihez az IrfanView igen jól működő megoldást kínál, ráadásul ingyenesen.
Tovább olvasom