Előzetes
A HTML (HyperText Markup Language) igen kedvelt weblapkészítő szabványt, sok kritika érte.
- Oka:
- - A tartalom mellett, nagyon sok a tartalom megjelenítést meghatározó elemet tartalmaz.
- - Erősen összemosódik a tartalom és annak megjelenítésére szolgáló meghatározások tömkelege.
- - A weblap tartalmi részének elkészítésekor szinte áttekinthetetlen szövegfolyam volt jelen
- - A későbbi megjelenítést befolyásoló meghatározások módosítása nagyon időigényes
- - A HTML kódok sokszor átláthatatlanok/feldolgozhatatlanok a helytelenül strukturált elemek miatt.
A sok kritika miatt a HTML 4.0 szabványban, a korábbi verziókban használt sok elemet érvénytelenítettek.
A megjelenésre, azaz a design-célra, a CSS - fájlt, azaz a stíluslap használatát javasolták.
A HTML hátrányát ez a szabvány sem változtatta meg, továbbra is egy statikus, előre definiált elemeket és paramétereket tartalmazó jelölő nyelv maradt.
Végezetűl, a szabványkészítők megalkották az XHTML szabványt.
XHTML
Az XHTML nem más, mint a HTML tovább fejlesztett változata
XHTML a W3C kezdeményezésére készített, szabvány ajánlat
W3C : World Wide Web Consortium. ( Internet címe: WWW.W3.org )
HTML: Hypertext Markup Language.
XHTML: Extensible Hypertext Markup Language. (Bővíthető Hiperszöveges Leírónyelv)
Hypertext, azaz hiperszöveg:
- Weblap tartalmát hordozza
- Programozási informáciokat tartalmaz
- Egyszerű formázatlan szöveget jelenít meg
Markup Language, azaz leírónyelv:
- A hiperszöveget, ennek segítségével lehet formázni.
- Minden böngészőprogram, képes értelmezni.
- Meghatározza az elemek megjelenítését, címsorok és alcímek betűtípusait
Az XHTML családba tartozó dokumentumtípusok XML alapúak.
A hagyományos HTML 4.0 szabványt ismerő böngészővel is olvashatók maradnak.
A közeljövőben várhatóan az XML alapú böngészőprogramok fognak elterjedni, amelyek természetesen ezt a fajta dokumentumot gond nélkül olvasni fogják.
XHTML előnyei.
- Könnyen áttekinthető
- Egyszerűen szerkeszthető
- Könnyen érvényesíthető (validálható) standard XML eszközökkel.
Validálás jelentése:
Ellenőrizzük, hogy a dokumentum tartalma megfelel-e a nyelv szabályainak.
Ha megfelel, akkor a dokumentumra azt mondjuk, hogy valid.
Ilyen ellenőrző programot találhatunk a weben is, pl.: http://validator.w3.org/ .
Ez a HTML kiértékelő ellenőrzi a dokumentum helyességét az abban deklarált dokumentumtípusnak (DOCTYPE) megfelelően.
Az XHTML oldalak a HTML 4.0 szabványt támogató szerkesztőprogramokkal is szerkeszthetők
Az XHTML dokumentumban használhatunk olyan alkalmazásokat (appletek, szkriptek), amelyek futtatásához szükséges a HTML Document Object Model (DOM) vagy az XML DOM.
Az XHTML "család" fejlődésével az XHTML 1.0 kritériumainak megfelelő dokumentumok egyre inkább együtt tudnak működni egymással a különböző XHTML környezetekben.
Ezek alapján elmondható, hogy az XHTML család jelenti a következő lépést az internet fejlődésében.
Különbségek
Ahhoz, hogy az általunk készített XHTML állomány valid legyen, ezeket a különbségeket figyelembe kell vennünk
Az elemek egymásbaágyazásánál ügyelnünk kell a sorrendre.
XHTML-ben, az elemek megnyitásának fordított sorrendjében kell elhelyezni a záró elemeket.
Példa:
HTML-ben:
<b> <u> Ez egy vastag, aláhúzott szöveg megjelenítése </b> </u>
Monítoron így jelenik meg: Ez egy vastag, aláhúzott szöveg megjelenítése
XHTML dokumentumban a sorrend, azaz helyesen így néz ki a fenti kód:
XHTML-ben: <b> <u>Ez egy vastag, aláhúzott szöveg megjelenítése </u> </b>
Monítoron így jelenik meg: Ez egy vastag, aláhúzott szöveg megjelenítése
- XHTML-ben:
- Minden elemet a kezdő <html> címke és a záró </html> címke között kell elhelyezni.
- A dokumentum tartalmi részét, és az azt formázó elemeket, címkéket, a kezdő <body> címke és a záró </body> címke között kell elhelyezni.
- Minden elemnek lehetnek további beágyazott elemei.
- Az elemek páronként kerülnek megadásra, kezdő és záró elem mindig szerepeljen.
Az XML alapú böngészők, ha nem jól formázott dokumentummal találkoznak, nem tudják feldolgozni azt.
Ennek ellenére, kevésbé robosztus, gyorsabb böngészőprogramokkal tudunk dolgozni.
A Kezdő és záró címkéket, azonosítókat, tag neveket, kis betűkkel és ékezet nélkül kell írni.
Az XML szabvány megkülönbözteti a kis- és nagybetűket a <br> és <BR> tag két különböző dolgot jelölhet.
Minden XHTML elemet kötelező lezárni.
Például a bekezdéseknél, nem írhatjuk a következőt:
<p> Első bekezdés
<p>Második bekezdés
XHTML-ben a helyes kód: Mindig szerepelni kell a záró címkének, melybe egy per vonalat kell beírni
<p> Első bekezdés</p>
<p>Második bekezdés </p>
- Megjegyzés!
- br, img, frame,
- area, base, bgsound,
- col, hr, input,
- isindex, keygen, link,
- meta, option, param
Azon elemek végére, amelyeknek a HTML szabványban nincs záró párjuk, / karaktert kell beírni.
Dokumentumunk kompatibilis legyen a jelenlegi böngészőkkel, ne felejtsünk el egy space karaktert, azaz szóközt is kitenni a / jel elé.
Példa:
Sorlezáró utasításra:
<br> helyett, a következőt írjuk <br />,
Kép megjelenítésére:
<img src="weblapom/"kep.jpg">" helyett,
a következőt írjuk <img src="weblapom/kep.jpg" />
A meghatározásokat, azaz paramétereket, kis betűvel kell írni.
Rossz: <table WIDTH="90%">
Helyes: <table width="90%">
A meghatározások, azaz paraméterek értékeit " " jelek, közé kell zárnunk.
Rossz: <table width=750>
Helyes:<table width="750">
Az attribútumok minimalizálása, rövidítése nem megengedett
Rossz: <input checked>
Helyes: <input checked="checked" />
Az alábbi táblázatban látható, hogy a HTML-ben használt attribútumoknak mi a megfelelője az XHTML-ben.
| HTML | XHTML | HTML | XHTML | |
|---|---|---|---|---|
| compact | compact="compact" | ismap | ismap="ismap" | |
| checked | checked="checked" | nohref | nohref=" /inform/xhtml/"nohref"" | |
| declare | declare="declare" | noshade | noshade="noshade" | |
| readonly | readonly="readonly" | nowrap | nowrap="nowrap" | |
| disabled | disabled="disabled" | multiple | multiple="multiple" | |
| selected | selected="selected" | noresize | noresize="noresize" |
Azonosításra, a name attribútumok helyett id attribútumot kell használni.
Például képekhez rendelt egyedi azonosításnál:
Rossz: <img src=" /weblapom/"kep.jpg"" name="kep1" />
Helyes: <img src="weblapom/kep.jpg" id="kep1" />
Egy ideig mindkét megoldást érdemes alkalmazni ugyanazon azonosítóval, azaz értékkel, a régebbi böngészők miatt
<img src="weblapom/kep.jpg" name="kep1" id="kep1" />
Az xml:lang elem szerepeltetése
A HTML-ben a lang attribútum szolgált az adott elem nyelvének megadására.
Az XHTML dokumentumokban az xml:lang="érték" elemet is szerepeltetni kell.
Rossz: <div lang="hu" >Hajrá Magyar Internetezők</div>
Helyes: <div lang="hu" xml:lang="hu">Hajrá Magyar Internetezők</div>
Kötelező XHTML elemek
Minden HTML lap nélkülözhetetlen elemei:
- DOCTIPE meghatározás
- A head címkével jelölt fejléc
- A body címkével jelölt törzs
Minden XHTML dokumentumnak rendelkezni kell DOCTYPE deklarációval.
A következő elemeknek szerepelniük kell : html, head, body
A head elemen belül kell elhelyezkednie, a title elemnek.
Egy leegyszerűsített XHTML dokumentumsablon leírása:
<!DOCTYPE ide jön a dokumentumtípus. Lásd lejjebb a következő témakörben.>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> Oldalcím. Első gyakorló XHTML lapom </title>
</head>
<body>
Törzs. Idejön a tartalom. Az internetezők előtt, ez jelenik meg a monitoron.
</body>
</html>
A DOCTYPE
A HTML különféle változatainak szabályait úgynevezett dokumentumtípus-meghatározásokba ( Document Type Definition, DTD ) szervezték, és DOCTYPE meghatározás ( DOCTYPE declaration ) néven ismert utasításokkal adjuk meg, hogy melyiket kell ezek közül használni a weblap megjelenítéséhez.
Kiválasztunk valamilyen dokumentumtípus-meghatározást, és annak szabályai szerint írjuk meg a HTML kódot.
- A DOCTYPE definiálja a dokumentum típusát, ezért kötelező az első sorban szerepeltetni
- DOCTYPE megadása nem része az XHTML dokumentumnak, ezért nincs záró eleme.
Az XHTML-hez három lehetséges DOCTYPE-meghatározás tartozhat:
- Szigorú, Strict
- Átmeneti, Transitional
- Keretkészletes, Frameset
XHTML 1.0 Strict
Ha szigorú dokumentumtípus-meghatározást használunk, akkor csak a szerkezeti felépítésre vonatkozó elemeket és jellemzőket használhatjuk, a megjelenítésre vonatkozókat nem.
Ezt akkor ajánlatos használni, amikor tiszta kódokat és stíluslapokat használunk.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional
Az átmeneti dokumentumtípus-meghatározás használata esetén, használhatók egyes olyan megjelenítést beállító elemek és jellemzők is, amelyek már nem részei az XHTML szabványnak.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset
A keretkészletes dokumentumtípus-meghatározást a keretkészletet tartalmazó dokumentumokhoz szokás használni, amikor kereteket tartalmazó weblapot készítünk.
Akkor használjuk, ha az ablakot több keretre (frame) osztjuk fel.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">