Vissza az előzőleg látogatott oldalra (nem elérhető funkció)Vissza a tananyag kezdőlapjára (P)Ugrás a tananyag előző oldalára (E)Ugrás a tananyag következő oldalára (V)Fogalom megjelenítés (nem elérhető funkció)Fogalmak listája (nem elérhető funkció)Oldal nyomtatása (nem elérhető funkció)Oldaltérkép megtekintése (D)Keresés az oldalon (nem elérhető funkció)Súgó megtekintése (S)

A weblapkészítés technikája (HTML5, CSS3) és ergonómiája / Bevezető /Alapfogalmak, előkészületek

Alapfogalmak, előkészületek

Milyen szerkesztőprogramot válasszunk?

Számos olyan szerkesztőprogram létezik, amely megkönnyíti a honlapszerkesztés folyamatát. Ezek egyik része – a kódszintű vagy karakteres szerkesztőprogramok – a HTML- (és más) kódok gyors beillesztését teszik lehetővé, míg mások olyan szerkesztési módot ajánlanak fel, amelyben úgy kell dolgoznunk, mint akár egy kiadványszerkesztő programmal, vagyis a HTML-kódok ismeretére (elvileg) nincs is szükségünk. Ezeket ALAKHŰ, vagy WYSIWYG (ejtsd: vizivig) szerkesztőprogramoknak hívják, az angol What You See Is What You Get (azt látod, amit kapsz) kifejezés rövidítéseként.

A szerkesztőprogramok között természetesen találunk olyanokat is, amelyek mindkét szerkesztési módot támogatják, persze nem feltétlenül azonos mértékben.

Ha vannak ALAKHŰ szerkesztőprogramok, akkor miért kell megtanulnunk a HTML nyelvet?

Egyrészt azért, mert nincs tökéletes szerkesztőprogram, az előállított kód sokszor hibás, vagy nem elég hatékony, csak a webböngésző programok egy része tudja helyesen megjeleníteni, nem felel meg a különböző szabványoknak, és még sokáig lehetne sorolni a hátrányokat. Vagyis ha a szabványoknak megfelelő oldalakat akarunk készíteni, sokszor nem úszhatjuk meg, hogy a szerkesztőprogram által előállított kódot „kézzel” módosítsuk. Ezt viszont csak a szabvány ismeretével tudjuk megtenni.

Az, hogy milyen alkalmazást érdemes használni HTML-kód szerkesztésére, függ attól is, hogy milyen platformon végezzük a szerkesztést (pl. Linux, Windows, Apple OS X stb.), illetve hogy ingyenes, vagy fizetős megoldást keresünk.

Az internetes keresők segítségével mindenki találhat magának megfelelő alkalmazást, mi most három népszerű, ingyenes alkalmazásra hívjuk fel a figyelmet, három különböző platformon.

Hogy a tananyagunkban szereplő példákat ne kelljen mindig egy kódszerkesztőbe átmásolni, elmenteni és megtekinteni, interaktív szerkesztőmezőket alkalmazunk, amelyben mindjárt átírható a kód, és megtekinthető az eredmény.

A webböngésző programok

A világhálón található weblapokat jellemzően a különböző webböngésző programok (angolul browser) segítségével szoktuk megtekinteni. Néhány a legnépszerűbbek közül: Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari.

Ezek az alkalmazások nemcsak szolgáltatásaikban különböznek, az is előfordulhat, hogy ugyanaz a weboldal máshogy jelenik meg a különböző böngészőprogramokkal megtekintve. Ez adódhat abból, hogy az oldal készítője nem tartotta be a megfelelő szabványokat, de sajnos az is előfordulhat, hogy a webböngésző program nem követi a szabványokat. Ezért ha a weboldalak készítésével akarunk foglalkozni, nem árt, ha többfajta böngészőprogramot is telepítünk a gépünkre, hogy az elkészült oldalakat több böngészőprogrammal is ellenőrizhessük, tesztelhessük.

Mivel tananyagunkban a HTML5 és CSS3 lehetőségeit mutatjuk be, fontos, hogy a legújabb, a még specifikálás alatt álló szabványokat minél nagyobb mértékben támogató böngészőprogramokat használjunk a tanulás során!

Tanulási tipp

A html5test.com oldalon megtaláljuk azon böngészők toplistáját, amelyek a HTML5 lehetőségeiből a legtöbbet támogatnak. A táblázatban külön szerepelnek az asztali böngészők, a táblagépeken és mobil eszközökön használt böngészők, illetve a böngészésre képes játékkonzolok és TV készülékek.

Asztali böngészők között a Maxthon, illetve a Google Chrome legfrissebb változatai szerepelnek (jelentős előnnyel) a toplista élén, míg a tabletek esetén szorosabb a verseny az Opera mobile, Firefox mobile, Chrome böngésző között. Mobiltelefonon jelenleg a BlackBerry böngésző teljesít a legjobban, amelyet az Opera és Firefox, illetve Chrome követ.

Megjegyzés

A böngészőprogramok között többnek létezik hordozható (úgynevezett portable) változata, amelyet akár a pendrive-ra is telepíthetünk, így mindig kéznél lehet, amikor szükség van rá. A hordozható változatokra érdemes a http://portableapps.com/ oldalon rákeresni.

Vissza a tartalomjegyzékhez

Új Széchenyi terv
A projekt az Európai Unió támogatásával, az Európai Szociális Alap társfinanszirozásával valósul meg.

A tananyag az ELTE - PPKE informatika tananyagfejlesztési projekt (TÁMOP-4.1.2.A/1-11/1-2011-0052) keretében valósult meg.
A tananyag elkészítéséhez az ELTESCORM keretrendszert használtuk.