Példa HTML kódra szintaxis kiemelésekkel és sorszámokkal
A HTML (angolul: HyperText Markup Language, „hiperszöveges jelölőnyelv”) egy leíró nyelv, melyet weboldalak készítéséhez fejlesztettek ki, és mára már internetes szabvánnyá vált a W3C (World Wide Web Consortium) támogatásával. Az aktuális változata az 5, mely az SGML általános jelölőnyelv egy konkrét alkalmazása (azaz minden 5-ös HTML dokumentum egyben az SGML dokumentumszabványnak is meg kell hogy feleljen). Ezt tervek szerint lassan kiszorította volna az XHTML, amely a szintén SGML alapú XML leíró nyelven alapul, de még csak kevés weboldal használja.
Használata
HTML általában szöveges állományokban található meg olyan számítógépeken, melyek az internethez kapcsolódnak. Ezek az állományok tartalmazzák azokat a szimbólumokat, amelyek a megjelenítő programnak leírják, hogyan is kell megjeleníteni illetve feldolgozni az adott állomány tartalmát. Megjelenítő program lehet egy webböngésző (angolul: web browser), aural böngésző (olyan, amelyik a felhasználónak felolvassa a megjelenítendő szöveget), braille olvasó, amely konvertálja a szöveget braille „formátumba”, levelező program (mint például: Mozilla Thunderbird, Microsoft Outlook, Eudora, Claws Mail stb.), valamint egyéb eszközök, például mobiltelefon.
Szimbólumok, tartalom
Négyfajta szimbólum (leíró elem) található meg a HTML-ben:
strukturális elemek, amelyek leírják az adott szöveg "célját" például <h1>A legnagyobb szöveg</h1> mint első szintű címsor (alcím).
prezentációs szimbólumok, amelyek leírják, hogy az adott szöveg hogyan nézzen ki: például <b>Vastag szöveg</b> vastag kinézetet eredményez. (Ez a forma azonban ma már elavultnak számít, helyette a CSS használata javasolt, ugyanis a legújabb irányelv szerint szét kell választani a tartalmat (amit a HTML kódol) és a formát (amit CSS-ben szokás kódolni), és ezáltal mindenki számára elérhetővé tehetőek a weblapok: felolvasó gépeknek, amit a gyengén látók használnak, szöveges böngészőknek, és nyomtatóbarát verziót is könnyebb készíteni.)
hiperszöveg (hypertext) elemek, amelyek segítségével kapcsolat létesíthető a dokumentum egyes elemei és más dokumentumok között (például a <a href="https://hu.wikipedia.org/">Wikipedia</a> a Wikipedia szót mint egy kapcsolatot (angol szóval: link) a megadott URL-hez jeleníti meg
eszköz elemek, amelyek segítségével gombok, listák, beviteli mezők hozhatók létre.
a HTML fejléc <head></head>, ami technikai és dokumentációs adatokat tartalmaz, amelyeket az internet böngésző nem jelenít meg, tehát átlag felhasználó ezeket nem látja és
a HTML törzs <body></body>, amely a megjelenítendő információkat tartalmazza.
Tehát egy internetes oldal alapszerkezete a következőképpen nézhet ki:
<!DOCTYPE html><html><head><title>Fent lévő címsor</title><!--esetleges további fejléc-információk--><!--Itt fogjuk elkezdeni használni a CSS programnyelvet amiről bövebb információt találhatsz a wikipédián!--><style>h1{color:#478a9e;}</style></head><body><h1> Hello Világ! </h1><p> Üdvözöllek a weboldalon! </p></body></html>
Karakterkódolás
Egy HTML dokumentum alapértelmezésként ISO-8859-1, azaz nyugat-európai kódolást használ.[1] Gyakran előforduló hiba szokott lenni, hogy nincs beállítva a charset paraméter a fejléc content attribútumában, annak ellenére, hogy a dokumentum nem nyugat-európai kódolású szöveget tartalmaz. Magyar nyelvű oldalak esetén ilyenkor gyakran az „ő” és „ű” betűk helyett „õ” és „û” karaktereket látunk (ekkor valószínűleg "ISO-8859-2" vagy "windows-1250" volna a helyes charset érték), de az is lehet, hogy minden ékezetes betű teljesen olvashatatlanná válik, betűszemetet eredményezve (ha például a megjelenítendő szöveg UTF-8 kódolású). A charset paraméter értékeként több száz kódolás és érvényes alternatív név (alias) megadható.[2]
Numerikus karakter referenciák
Akármilyen kódolást használ is egy HTML dokumentum, bármilyen Unicode karakter megjeleníthető a szövegben annak UCS kódjával „&#” és „;” jelek között. Például a magyar kis „ő” betű UCS kódja a decimális 337 (vagy hexadecimális 151), ezért függetlenül a használt kódolástól, a HTML dokumentumban elhelyezett ő vagy ő mindig az „ő” betűt fogja megjeleníteni.
Az SGML számos Unicode karakterhez definiál egyedi megnevezéseket,[3][4] azonban a HTML a lehetséges SGML egyedeknek csak egy részét használja[5] (a használt egyedeket a dokumentum Dokumentumtípus-definíciójában kell megadni, és a HTML 4.01-es verziójáig ez nem tartalmazza a közép-európai karaktereket). Emiatt a magyar ékezetes karakterek közül is csak azokra lehetséges SGML egyedhivatkozást megadni, amelyek a nyugat-európai kódkészletben is megtalálhatók. Vagyis hiába definiálja az SGML például „ő” betűhöz az „odblac” nevet, hivatalosan azt egy böngészőnek nem kell tudnia megjeleníteni egy 4.01-es HTML dokumentum esetén.
Az egyedek neveire az „&” és „;” jelek között hivatkozhatunk, így például az é a kis „é” betűt jeleníti meg.
XHTML
Az XHTML a HTML megfogalmazása XML-ben (a HTML SGML-ben van definiálva). Gyakorlatilag nincs jelentős eltérés a két nyelv között, csak a formai követelmények lettek szigorúbbak:
Mindent kisbetűvel kell írni! (kivéve a DOCTYPE elemet)
Minden elemet le kell zárni! Az üres elemeket önmagukban egy szóközzel és egy / jellel: <br />.
Az elemeket csak egymásba ágyazva lehet használni! <b><i>Szöveg</b></i> helyett: <b><i>szöveg</i></b>
A jellemzőket idézőjelek közé írjuk! <table border=1> helyett: <table border="1">
A jellemzőknek legyen értéke! <input disabled /> helyett: <input disabled="disabled" />
HTML5
A HTML5 a következő, jelentősen átdolgozott változata a HTML-nek (Hypertext Markup Language), a web fő jelölőnyelvének. Egyik fő tervezési célja, hogy a webes alkalmazásokhoz ne legyen szükség pluginek (pl. Adobe Flash, Microsoft Silverlight, Sun JavaFX) telepítésére.
A specifikáció a HTML4 és az XHTML1 új verzióját jelenti, a hozzájuk tartozó DOM2 HTML API-val együtt. A HTML5 specifikációban leírt formátumba történő migráció HTML4-ről, vagy XHTML1-ről a legtöbb esetben egyszerű, mivel a visszamenőleges kompatibilitás biztosított.
A specifikáció a közeljövőben támogatni fogja a Web Forms 2.0 specifikációt is.
HTML5-ben lehetőség van audio és videofájlok beillesztésére, erre a célra külön tagek vannak (<audio>, <video>). Továbbá létezik egy úgynevezett <canvas> tag, mely egy vászon. Erre Javascript segítségével lehet rajzolni, vagy képet beilleszteni.
Fontos megemlíteni, hogy a HTML5-ből kivették az elrendezés megadó tulajdonságokat. Ezeket CSS-ben kell megadni.
