HTML5
A HTML5 a HTML (Hypertext Markup Language, a web fő jelölőnyelve) korábbi verzióinak az átdolgozott változata. A kifejlesztésének egyik fő célja, hogy a webes alkalmazásokhoz ne legyen szükség pluginek (pl. Adobe Flash, Microsoft Silverlight, Oracle JavaFX) telepítésére.
| HTML5 (Hypertext Markup Language) | |
 | |
 | |
| Fájlkiterjesztés | HTML: .html, .htm XHTML: .xhtml, .xht, .xml |
| MIME-típus | HTML: text/html XHTML: application/xhtml+xml, application/xml |
| Fejlesztő | W3C HTML WG, WHATWG |
| Kiadás dátuma | 2014. október 28. |
| Formátum típusa | jelölőnyelv |
| Mac OS típuskód | TEXT |
| Uniform | public.html |
| Standard | |
| Weboldal | html.spec.whatwg.org/multipage/ |
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.
Jelölés
szerkesztésA HTML5 bevezet jó néhány új elemet (címkét) és tulajdonságot, amelyek a modern weblapokon jellemzően alkalmazott szerkezetekre kínálnak új megoldást. Néhány változtatás szemantikai jellegű, például az általánosan használt <div> és a soron belüli részek formázását biztosító <span> helyett a <nav> (a weboldal navigációs területe) és a <footer> (lábléc). Más elemek új funkciók elérését biztosítják szabványosított felületen, mint az <audio> és a <video> elemek.
Néhány a HTML 4.01-ben már érvénytelenített elem az új szabványba már nem került be. Ilyenek a mai weblapokon még gyakran jelenlévő <font> és <center> elemek, amelyek hatását most már végleg CSS kóddal kell megvalósítani. Újra hangsúlyt helyeztek a DOM szkriptek (gyakorlatilag a JavaScript) jelentőségére a weboldalak viselkedésével kapcsolatban.
A jelölések hasonlósága ellenére a HTML5 szintaxisa már nem az SGML-en alapul. Ezzel együtt úgy tervezték, hogy visszafelé kompatibilis legyen, így a korábbi HTML szabványokhoz készült elemzők a szokásos elemeket megérthetik.
Oldalstruktúra
szerkesztésA HTML5 !DOCTYPE tagja (címkéje) is megváltozott. Lerövidítették, egyszerűsítették:
<!DOCTYPE html>
A kezdőtag után jön a html nyitó- és zárótag. Ezek közé kerül minden:
<html lang="hu"> </html>
Ezután a head tagek jönnek. Ezek közé kerülnek a háttérinformációk:
<head> </head>
A head tag zárótagje után jönnek a body tagek. Ez így fest:
<body> </body>
Ez a struktúra. Összegezve így néz ki:
<!DOCTYPE html>
<html lang="hu">
<head>
</head>
<body>
</body>
</html>
A head tagek közé kell betenni minden háttérinformációt.
- Meta tagek.[1] Lehet benne keresőkulcsszó, tartalom, oldaldefiníció.
- Linkek. CSS-re (Cascading StyleSheets, egymásbaágyazott stíluslapok), vagy faviconra mutatnak.
- Script tagek, bennük scriptekkel, vagy azokhoz tartozó elérési utakkal.
- Base tagek. Ezeknek általában href attribútuma van, amik a weboldal egyes (általában fő-) oldalára mutatnak.
- Title tagek. Ezekben van az oldal címe.
A body tagek között kap helyet az oldal és többek között néhány (ha van) script (kivétel a PHP). A weboldalak alapstruktúrája általában
- egy fejléc, logóval és szlogennel,
- egy menüsor, oldalt, vagy a fejléc alatt/felett,
- egy tartalom doboz, ebben van minden tartalom.
- egy lábléc, másolásvédelmi szöveggel, vagy hasonlókkal.
Ez így fest, csupa HTML5-tel:
<!DOCTYPE html>
<html lang="hu">
<head>
<title>
Oldal neve
</title>
<link rel="stylesheet" href="/style.css" />
<script type="text/javascript">
/* Javascript, ha kell. */
</script>
<meta charset="kívánt karakterkódolás" />
</head>
<body>
<header id="fejlec">
<img src="elérésiút" alt="logo, kép" />
<h1 id="szlogen">
Szlogen
</h1>
</header>
<section id="tartalom">
<nav id="menusav">
<a href="/oldal1">Menü1</a>
<a href="/oldal2">Menü2</a>
<a href="/oldal3">Menü3</a>
<a href="/oldal4">Menü4</a>
<a href="/oldal5">Menü5</a>
</nav>
<article id="lenyeg">
<header>
<h2>Cikk címe</h2>
<h3>Cikk alcíme</h3>
</header>
<p>
Első bekezdés.
</p>
<p>
Második bekezdés.
</p>
</article>
</section>
<footer>
<p>
Lábléc szövege
</p>
</footer>
</body>
</html>
Jegyzetek
szerkesztés- ↑ Ezek a legfontosabb META tag-ek (magyar nyelven). [2019. március 6-i dátummal az eredetiből archiválva]. (Hozzáférés: 2017. augusztus 5.)
Külső hivatkozások
szerkesztés- WHAT Working Group (angolul)
- W3C HTML Working Group Archiválva 2011. február 28-i dátummal a Wayback Machine-ben (angolul)
- WHATWG Editor's draft (angolul)
- W3C Editor's draft (angolul)
- HTML5 differences from HTML4 Archiválva 2013. március 30-i dátummal a Wayback Machine-ben (angolul)
- HTML 5 Reference (angolul)
- HTML Design Principles Archiválva 2011. január 21-i dátummal a Wayback Machine-ben (angolul)
- HTML 5: The Markup Language Archiválva 2011. január 10-i dátummal a Wayback Machine-ben (angolul)
- HTML 5 Quick Reference Guide (angolul)
- Compatibility tables for features in HTML5, CSS3, SVG and other upcoming web technologies (angolul)
- HTML5 használata keresőoptimalizálási szempontból
- HTML5 programozás (magyar)
