Előadást letölteni
Az előadás letöltése folymat van. Kérjük, várjon
1
HTML (HyperText) Markup Language – Hiperszöveges jelölőnyelv
Az SGML (Standard Generalized Markup Language – Szabványos kiterjesztett Jelölőnyelv) egy specifikusan a Web számára átalakított módozata. A nyelv lehetőséget nyújt a normál információs szövegben bizonyos jelölő blokkok, ún. tag – ek elhelyezésére, melyek információkat és utasításokat tartalmaznak a böngészők számára a dokumentumok tartalmával, megjelenítésével és viselkedésével kapcsolatban.
2
A HTML története A HTML –t 1990-óta használják a weben a honlapok megjelenítéséhez. Azóta 5 fő állomása volt a HTML történetében (most tartunk a 6.-on) Nulladik – HTML 1.0 Itt alakult ki az alapvető szerkezet, a nyitó és záró cimkék <html> és </html>, a fejléc, <head> és </head> éa a törzs, azaz a <body> és </body>. Ezeknek a az elemeknek a zárócímkéje nem volt elhanyagolható már akkor sem. Már itt lehetőség volt dokumentum típus deklarációra. (DTD)
3
Első szint – HTML 2 Ez nem hozott túl sok változást, de innentől különül el a böngésző által szabályozott és a dokumentum szerkezetében létrehozott formázás. Új formázási lehetőség volt pl.: <code> ami forráskód jelölésére szolgált, az <em> ami a kiemelésre szolgált. A karakterformázási lehetőség is kibővült: a <b> a félkövér karaktert, az <i> a dőlt karaktert és a <tt> az azonos betűszélességet jelenti.
4
Második szint Ez a HTML 2 kiegészítése. Bevezetésre kerültek az űrlapok, az ezen belüli többsoros szövegbevitel, és a kiválasztható opciók. Ez a verzió szabvány lett, és a későbbi fejlesztések alapjául szolgált. Harmadik szint – HTML 3.2 Ezt a verziót 1996-ban fogadta el a W+C, ami jelentős változásokat hozott. Innentől van lehetőségünk Java appletek, és scriptek beágyazására. Megjelent a style elem is, csekély haszonnal és ígéretszinten. Lehetőségünk van táblázat készítésére, a betűtípus beállítására.
5
Negyedik szint – HTML 4. 1997 nyarán tette hivatalos ajánlássá a W3C. Ez már igazából egy SGML alkalmazás. Fejlesztéskor szem elött tartották a csökkent képességűek érdekeit, és a nemzetközi karakter készletet. Tovább fejlesztették az űrlapok és a táblázatok használhatóságát, a keretek (frame-ek) használata hivatalossá vált. Gyarapodtak a formázóelemek, és elvetettek pá korábbi elemet.
6
Ötödik szint – XHTML 1.0 Hatodik szint – HTML 5
Az XHTML a jelenlegi és a jövőbeli dokumentum típusok, és modulok családjába tartozik, amik kiegészítik, kiterjesztik a HTML 4-et. Lényegében ez annyit tesz, hogy megfogták a HTML 4-et, és az XML-t és összegyúrták. Hatodik szint – HTML 5 A HTML 5 a 2010-es év új szabványa. Rengeteg új lehetőséggel bővült ki a HTML nyelv, azonban napjainkban még elég sok körülötte a zürzavar, és kevés böngésző támogatja, de a jövő mindenképp e HTML 5-é lesz.
7
SGML (Standard Generalized Markup Language – Szabványos Általános jelölőnyelv) Egy ISO szabványos jelölőnyelv dokumentum formátumok leírására. XHTML (Extensible HyperText Markup Language – Kiterjeszthető Hyperszöveges jelölőnyelv) A HTML megfogalmazása XML-ben. Gyakorlatilag nincs jelentős eltérés a két nyelv között, csak a formai követelmények lettek szigorúbbak.
8
XML (Extensible Markup Language – Kiterjeszthető Leíró nyelv) Szabályok gyűjteménye, melyek segítségével olyan szöveges formátumokat állíthatunk elő, amelyek alkalmasak adatok strukturált leírására. A HTML állomány Egy olyan szöveges állomány, amely különböző jelző blokkokat (tag-eket) és a megjelenítendő, letöltendő, stb. objektumokra mutató hivatkozásokat tartalmaz. Manapság a különböző formázási lehetőségeket nem HTML, hanem CSS (Cascading STYle Sheets – Kaszkádolt Stíluslapok) segítségével oldják meg.
9
HTTP protokoll (HyperText Transfer Protocol – Hiperszöveg Átviteli protokoll) A Web kliens-szerver architektúrát alkalmaz az információk megosztására és terjesztésére. A rendszer működése során a felhasználó gépén futtatott kliens program (böngésző) kérést intéz az Internetre rákapcsolt web-szerverhez, ami az üzenetet értelmezi és a kért dokumentumot, ill. kiegészítő információkat küld vissza a kliens felé. A megkapott fájlt aztán értelmezi a browser és annak tartalmától függően megjeleníti, lemezre menti vagy éppenséggel elkezdi futtatni azt a felhasználó gépén. A két gép között az információ csere a HTTP protokoll segítségével zajlik. A HTTP protokoll a 80-as portot használja
10
A kliens-szerver architektúra
11
Protokoll Az informatikában a protokoll egy egyezmény, vagy szabvány, amely leírja, hogy a hálózat résztvevői miképp tudnak egymással kommunikálni. Ez többnyire a kapcsolat felvételét, kommunikációt, adat továbbítást jelent. Port A hálózati port a programozásban egy olyan logikai pont, amely meghatározza azt a módot, ahogyan egy kliens program kiválaszt egy kapcsolódási pontot egy szerverprogramhoz, amely a hálózat egyik gépén fut.
12
HTTPS protokoll HyperText Transfer Protokol Secure – Biztonságos Hiperszöveg Átviteli Protokoll A HTTP protokollnak titkosított, biztonságos hitelesítést lehetővé tévő változata. Ezzel a protokollal gyakran találkozunk web áruházak, banki megoldások, illetve internetes levelezőszerverek esetén, vagyis mindenhol, ahol fontos, hogy az adatforgalomból illetéktelenek ne csapolhassanak le bizalmas információkat. A HTTPS protokoll a 443-as portot használja.
13
FTP protokoll FILE Transfer Protokol Secure – Fájl Átviteli Protokoll Az egyik legrégebbi Internet protokoll egyike. Legelső változatát még 1971-ben dolgozták ki. A protokoll feladata a számítógépek közötti fájl-csere biztosítása: a különböző platformok fájl-rendszereinek eltéréseit elrejtve, az állományok ellenőrzött és biztos átvitele az Internetre kaocsolt bármely két egység között. A 21-es portot használja.
14
URL protokoll Uniform Resource Locator – Egységes erőforrás helymeghatározó Másnéven webcím. Az interneten található különböző erőforrásokra (weboldalakra, címekre, letölthető fájlokra, stb.) az URL-ek segítségével hivatkozhatunk. Az URL tartalmazza az erőforrás eléréséhez szükséges kommunikációs protokoll nevét (pl. HTTP, HTTPS, FTP, MAILTO, NEWS, TENET) a számítógép, vagy tartomány nevét (vagy IP címét), egy hálózati port számot, amelyen az adott szolgáltatás elérhető, és azt az elérési utat, amelyen az erőforrás megtalálható.
15
ftp://ftp.freebsd.org/pub/FreeBSD/doc/
URL felépítése: protokoll://tartománynév:portszam/elérési_utvonal Példák: ftp://ftp.freebsd.org/pub/FreeBSD/doc/
16
Browser (Böngésző) (5 legnépszerűbb?) Az a program ami a HTML kódot értelmezi, és megjeleníti. Nem mindegyik támogatja ugyanolyan mértékben a szabványokat, és maguk sem felelnek meg a szabványoknak. Ha elkészítünk egy honlapot, előfordul, hogy mást látunk a különböző böngészőkben. Ez fokozottan igaz, ha CSS-t, JavaScript-et is használunk. Érdemes mindegyik böngészőt feltelepíteni és tesztelni a honlapunkat. Itt érdemes megjegyezni, hogy a böngésző verziója is sokaz számít.
17
Szerkesztőprogramok A HTML szerkesztőknek két fő típusát különböztetjük meg. A grafikus, avagy WYSIWYG (What You See Is What You Get – Azt kapod amit látsz) szerkesztők, és a kód szerkesztők Grafikus szerkesztővel szinte rajzolva szerkeszthetjük meg a honlapot, és legenerálják nekünk a forráskódot. Hátrányuk, hogy a kód katasztrofálisan pocsék, és nem tanulunk semmit a HTML szerkesztésről. Kódszerkesztők a HTML kódot mi magunk írjuk. Tanulás során mindenképpen szöveges kódszerkesztőt használjunk.
18
XHTML oldal szerkezete
Minden oldalt egy alkalmazandó dokumentum típus (DOCTYPE, vagy DTD) megadásával kezdünk. Ez a böngészőnek nyújt információt, hogy milyen szabvány szerint készítettük el a weboldalunkat. Walidátorral ellenőrizhető (on-line W3C validator) a szabványnak való megfelelés, ezt a folyamatot pedig validálásnak nevezzük. Firefox alá letölthetjük a HTML Validator nevü plug-in-t.
19
3 fajta dokumentumtípus közül választhatunk. XHTML 1.0 Strict
XHTML 1.0 esetében 3 fajta dokumentumtípus közül választhatunk. XHTML 1.0 Strict Akkor alkalmazzuk, ha az XHTML prezentációs lehetőségeit nem akarjuk használni, és a különféle formázásokat Stíluslapok (CSS) segítségével oldjuk meg. A szükséges kód: <!DOCTYPE html PUBLIC”-//W3C//DTD XHTML 1.0 Strict//EN” ” > XHTML 1.0 Transitional Akkor alkalmazzuk, ha ki akarjuk használni az XHTML prezentációs lehetőségeit vagy olyan böngészőre fejlesztünk, amely nem ismeri a stíluslapokat. (Ez utóbbi már elég ritka.) A szükséges kód: <!DOCTYPE html PUBLIC”-//W3C//DTD XHTML 1.0 Transitional//EN” ” >
20
XHTML 1.0 Frameset Akkor alkalmazzuk, ha az oldalt több keretre (frame) akarjuk felosztani. A szükséges kód: <!DOCTYPE html PUBLIC”-//W3C//DTD XHTML 1.0 Frameset//EN” ” > A DTD megadása után kezdhetjük el írni a XHTML kódot. A kód a <html> tag-gel kezdődik, a zárópárja pedig a </html> tag. E között a két tag között kell megírnunk a honlapunk kódját. XHTML esetében a <html> tag-en belül meg kell adnunk egy úgynevezett xmlns-t, (Extensible Markup language Name Space) azaz a XML névteret: Xmlns= xml:lang=„hu” (Az XML nyelvezet beállítása) Lang=”hu” (Az oldal nyelvezeténak beállítása)
21
Egy alap XHTML dokumentum felépítése
<!DOCTYPE html PUBLIC ”-//W3C//DTD XHTML 1.0 Transitional//EN>” ” > <html xmlns= xml:lang=”hu” lang=”hu> <head> <title></title> </head> <body> </body> </html> Hasznos oldalak (angol) (angol) (Webfejlesztéssel kapcsolatos, magyar) (Keresőoptimalizálás, magyar) (Keresőoptimalizálás, magyar) (Ingyenes, magyar) (Hasznos, magyar)
Hasonló előadás
