Rugalmas webtervezés mobil eszközökre
Tisztelt érdeklődők!
Tanfolyamainkat a jelenléti képzések mellett Élő virtuális tantermi rendszerben is szervezzük. A képzések élőben zajlanak, ugyanúgy, mintha a tanteremben ülne. Önnek csak a Webinar szoftvert kell telepíteni.
Részleteket tájékoztató oldalunkon olvashat.Napjainkban egyre nagyobb az igény, hogy egy weboldal ne csak a hagyományos számítógépek kijelzőjén jelenjen meg esztétikusan, hanem a mobileszközök (mobiltelefonok, táblagépek) kijelzőjén is. Az okostelefonok és a táblagépek ugyan elvileg gond nélkül megjelenítik a hagyományos felépítésű oldalakat, de ezeken a készülékeken igazi felhasználói élményt mégiscsak a mobilra optimalizált megjelenítés biztosít.
Amikor a webfejlesztő azzal szembesül, hogy az általa fejlesztett weboldalból mobil megjelenést is csinálnia kell, több lehetőség közül választhat. Egyik lehetőség, hogy elkészíti ugyanannak a weboldalnak egy teljesen önálló, kifejezetten mobilra optimalizált mutánsát. A másik lehetőség, hogy az eredeti weboldal megjelenését úgy alakítja ki, hogy az rugalmasan alkalmazkodjon a kijelzők eltérő méretéhez.
Tanfolyamunk középpontjában ez utóbbi technika, az úgynevezett Responsive Web Design (RWD) áll. Bár viták folynak arról, hogy a fent említett két lehetőség közül melyiknek mi az előnye és a hátránya, abban egyetértés van, hogy a Responsive Web Design alkalmazása kis és közepes honlapok esetén gyorsabb, egyszerűbb és költséghatékonyabb lehet.
A Responsive Web Design alkalmazásához alapvetően azt kell jól elsajátítani, hogy a weboldal vázszerkezete, a rajta megjelenő elemek (betűk, képek, stb.) méretezése hogyan lehet teljesen rugalmas. Ehhez egy szemléletváltásra is szükség van, hiszen a fejlesztők többsége hagyományosan mindent méretet pixelben definiál.
A tanfolyamon a nélkülözhetetlen elméleti alapok lefektetésével párhuzamosan közösen átalakítunk egy hagyományos, pixel alapú méretezéssel készült weboldalt, rugalmas, mobileszközökön is optimális megjelenéssel rendelkező weboldallá.
A tanfolyam elvégzésével a hallgatók képesek lesznek már méglévő weboldalakat, CMS sablonokat rugalmas megjelenésűvé átalakítani, illetve új weboldalakat már eleve ezen elv mentén elkészíteni.
Tandíj: 48.000 Ft /fő + ÁFA
Kedvezmény: 1.600 Ft + ÁFA (részletek)
Részletfizetés: nincs, a tandíjat egy összegben kell befizetni
Célközönség:
Tanfolyamunkat olyan webtervezőknek, webfejlesztőknek ajánljuk, akik a mobileszközök felé is nyitni szeretnének.
Stabil HTML és CSS alapismeretek
- Az aktuális kiírás szerint, lásd a fenti táblázatot
- Vállalunk egyéni tanácsadást is
- Céges csoportoknak egyedi beosztással és tematikával is tartunk képzést
Bevezető | - Fix és rugalmas tényezők a webtervezésben - Mitől lesz egy weboldal rugalmas? - Mobileszközök jellegzetességei a webtervezés szempontjából - Létezik-e külön mobilweb, vagy a web eszközfüggetlen? - Responsive Web Design fogalma és összetevői |
Pixel fogalma | - Tényleg abszolút mértékegység-e a pixel? - Három típusú pixel a retina kijelzős mobileszközök világában |
Viewport fogalma | - Mit nevezünk viewport-nak? - A viewport-ok típusai - Viewport meta elem |
Rugalmas betűméretezés | - Igazodás a böngészőprogramok alapértelmezett betűméretéhez - Az "em" és "rem" mértékegység - Betűméretek és távolságok beállítása "em" mértékegységben |
Rugalmas dobozméretezés | - Áttérés fix (pixel alapú) layout-ról rugalmas (százalék alapú) méretezésre - Rugalmas webtervezés képlete - Hasábméretezés "em" mértékegységben |
Rugalmas képméretezés | - img elemek rugalmas méretezése - Rugalmas háttérképek CSS-ben - Egyéb multimédiás elemek (pl. videók) rugalmas méretezése |
Eszköz- és médiaspecifikus CSS | - CSS médiatípusok - CSS médiatípus deklarációk - CSS által definiált média karakterisztikák (szín, méret, képarány, orientáció) - CSS3 media queries (média lekérdezések) fogalma és szintaktikája - Ideális töréspontok az eszközök felbontása alapján - CSS feldarabolása eszközspecifikus módon |
"Első a mobil" (mobil first) és az "Első a tartalom" (content first) elve | - A media queries korlátai - A tartalom, a megjelenés és a viselkedés tudatos szétválasztása - Progressive enhancement elve a kijelzők mérete és az eszközök képességei alapján - Media queries és az Internet Explorer |
Tesztelés | Rugalmas tervek tesztelési lehetőségei |