Tutorial: betűtípusok a weben

Alapvetően kétféle betűtípust különböztetünk meg a weben: webstandard és nem webstandard betűtípusok. Webstandard betűtípusok pl. az Arial, Verdana, Courier, amik jó eséllyel mindenféle böngésző alatt meg fognak jelenni. Kiválóan összegyűjtött lista olvasható az alábbi linkre kattintva.

Tutorial: Photoshop tippek

Az alábbi videókban két olyan problémára keressük a választ amivel a kezdők gyakran találkoznak.

1. körvonal, azaz kitöltés nélküli alakzat rajzolása

2. pontozott vonal készítése

Tutorial: lángoló dobókockák

Sajna a YouTube visszaminősítette a fiókomat, megint nem tudok 15 percnél hosszabb videót feltölteni, úgyhogy kénytelen voltam két darabra szedni, mint a régi szép időkben

Tutorial: absztrakt minta Photoshopban

Egy kis nyár eleji lazulós videó, valami ehhez hasonló eredménnyel. A megvalósításhoz szükség lesz Illustratorra is.

Tutorial: HTML + CSS + jQuery menü

Na már megint egy menü. Ez nem tiszta CSS, kell hozzá pár sor jQuery, de valamivel talán használhatóbb, mint a legutóbbi variáció.

Tutorial: függőleges középre igazítás block típusú elemeknél

Habár rengeteg anyag született már a témában, a mai napig sok helyen látom a kérdést, hogy miért nem működik a vertical-align beállítás fix méretű DIV-ek esetében. A válasz egyszerű: azért, mert a DIV block típusú elem és nem úgy viselkedik, mint a táblázat cellái, ahol ugye az őskorban a valign=”middle” beállítást használtuk erre a célra.

Tutorial: HTML + CSS űrlap

Szabványos HTML + CSS űrlap készítés FIELDSET és LABEL tag-ek használatával.

Tutorial: Photoshop kezdő 1-10

Még régebben kezdtem el ezt a sorozatot felvenni, csak aztán félbemaradt. Ha kirakom, akkor előbb-utóbb úgyis kénytelen leszek folytatni Mint a címe is mutatja kezdőknek szól, tehát lassabb a tempó.

Tutorial: HTML + CSS image sprite menü

Már megint egy menü Viszont most egy olyan módszer amiről még nem volt szó a blogon. Meg lehetne oldani úgy is, hogy egyetlen képet használunk a menühöz, pl. úgy, hogy egymás alá tesszük a menu.png és a menu_on.png-t egyetlen képbe. Ilyenkor viszont használunk kellene a függőleges pozíció eltolást is.

Tutorial: jQuery – képgaléria

Dinamikus képgaléria, mely kiírja képek számát és azt, hogy éppen hányadik képnél tartunk. A galérián belül lehet lépkedni jobbra-balra, ha elértük az utolsó elemet, utána visszaugrik az első képre.

Tutorial: HTML + CSS menü készítés almenükkel

Megpróbálkoztam egy almenüs menüt készíteni tisztán CSS-el, javascript nélkül. A videóhoz nem készültem elő, úgyhogy van benne egy nagy adag bénázás, de az eredmény működőképesnek tűnik. Ha valaki megcsinálja és teszteli Opera alatt, majd számoljon be az eredményről.

Tutorial: jQuery – toggle használata

A toggle lehetővé teszi egy elem eltüntetését illetve megjelenítését kattintástól függően. Itt is a click eseménnyel startolunk, majd első kattintásra előhozzuk a tartalmat, másodikra eltüntetjük.

Tutorial: jQuery – egyszerű képváltó

Egyszerű képváltogató megoldás jQuery-vel. Megint belefutottam a jó öreg IE last-child problémába, úgyhogy erre is mutat megoldást a videó. Felejtsétek el amit a toggle-ról mondtam, ehhez a feladathoz nem jó megoldás, ki is vettem a videóból. Majd csinálok erre is egy értelmes példát.

Tutorial: PHP – űrlapfeldolgozás

Egyszerű regisztrációs űrlap, adatellenőrzés, és az adatok adatbázisba írása. Összesen 1 óra 13 perc.

Tutorial: PHP – egyszerű oldalfelépítés

Még mindig az őszi weboldallal foglalkozunk Megnézünk egy egyszerű procedurális módszert amivel már dinamikusan tudjuk felépíteni az oldalunkat PHP használatával.

Tutorial: valentin napi képeslap készítése Photoshopban

Ahogy ígértem, itt az utolsó olyan videó, ami korábban nem volt elérhető HD minőségben. Kicsit hosszúra sikeredett, szerintem az eddigi leghosszabb anyag a maga 23 percével. Nem volt kis meló hibátlanul felvenni A végeredmény nem nagy eresztés, azonban elég sok hasznos funkciót használunk a készítés során.

Tutorial: őszi hangulatú weboldal 2.rész

Elkészült a mindenki által annyira várt videó, ahol a korábban Photoshopban elkészített weboldal mintából megírjuk a HTML és CSS kódot.

Tutorial: HTML + CSS az alapoktól 9.rész

A kilencedik és egyben utolsó részben a CSS3 újdonságaival foglalkozunk, illetve kapunk egy kis betekintést, hogy miért nem kedvelik a webdesignerek az Internet Explorert. A videóban bemutatott dolgok többsége egyébként a 9-es verzióban már működik. Megint sikerült mást gépelnem, mint amit mondok, 6:10-nél értelemszerűen border-radius-t kellene írni

Tutorial: HTML + CSS az alapoktól 8.rész

Az utolsó előtt részben átismételjük az eddig tanultakat.

Tutorial: HTML + CSS az alapoktól 7.rész

A hetedik részben a DIV-ekkel foglalkozunk. Ez az utolsó amiben új tag-et veszünk, a következőben már csak ismétlés lesz, illetve még van a fejemben egy bónusz anyag is