HTML5 dokumentum típus és head újdonságok

English Version!

Maga a dokumentum típus meghatározás (Document Type Definition, DTD) történetébe nem szeretnék túl mélyen elmerülni, de lényegében azért volt muszáj bevezetni, mert a böngészők nem tudták követni a szabványok hihetetlen ütemű változását. Emiatt a weboldalak gyakorlatilag helytelenül vagy hibákkal teli-tűzdelve jelentek meg a felhasználó böngészőjében.

A DTD meghatározását a HTML dokumentum legelején kell alkalmazni a <html> tag előtt. A deklaráció nem egy HTML tag, hanem egy meghatározás, amely segíti a böngészőt, hogy milyen verzióban íródott a HTML kódunk.
Nem számoltam meg, de a HTML4 és HTML4.01 minimum 7 ilyen meghatározással rendelkezik, ezek közül mutatnék be két példát.

Az alábbi deklaráció például megengedi az összes DTD HTML elemet, de a keretek (frames) nem engedélyezettek.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

A következő példa mindenben megegyezik az elsővel és itt a keretek használata is engedélyezett.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

A fentiekből is látható, hogy a deklarációk meglehetősen bonyolultak és a szabványból eredően számos változatuk született az idők során. Akit részletesebben érdekelnek a HTML4 Doctype deklarációk, azoknak javaslom, hogy látogassák meg a következő weboldalt. http://www.w3.org/TR/html4/struct/global.html

Mit hoz a HTML5 ezen a téren? 15 karaktert.

<!DOCTYPE html>

Ennyi. Nem kevesebb, nem több. Azt gondolom ez megjegyezhető és elrontani is jóval nehezebb lesz.

A gyökérelem <html>

Nézzük mi történt a gyökérelemmel. A következő példa bemutatja, hogy is néz ez ki a HTML4.01-ben.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xml:lang="en">

A HTML5-ben ez is rövidült, egyszerűsödött.

<!DOCTYPE html>
<html lang="en">

Mi van a fejben?

Legfőképp a karakterkódolásra vonatkozó információk, lássuk ezek miként változtak.

<meta http-equiv="content-type" content="text/html charset=UTF-8">

Mint számos dolog, ez is rövidült.

<meta charset="UTF-8">

Valamint lehetnek hiperhivatkozások, CSS fájlokra mutató linkek. A CSS-re mutató. Ilyen volt:

<link rel="stylesheet" type="text/css" href="style.css" />

Ilyen lett:

<link rel="stylesheet" href="style.css" />

Egy kis Internet Explorer trükk

Számos HTML5 szabvány megjelenítése gondot okoz az IE böngészőknek, ehhez kínál egy trükkös megoldást a következő script. Erről bővebben tudtok olvasni a http://code.google.com/p/html5shim/ weboldalon.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>IE HACK!</title>
<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body>
</body>
</html>

Forrás:

http://hu.wikipedia.org/wiki/HTML
http://www.w3schools.com/html5/tag_meta.asp
http://code.google.com/p/html5shim/

Creative Commons Licenc
HTML5 dokumentum típus és head újdonságok a Creative Commons Nevezd meg! – Ne add el! – Így add tovább! 2.5 Magyarország Licenc alatt van.
Permissions beyond the scope of this license may be available at https://html5.ugyesen.com.

You may also like...