HTML 5

Stále se jedná o draft - nejedná se o standard (doporučení - recomendation).
- stále se vyvíjí, může ještě doznat určité změny
- otevřená témata:
  - de facto semantická definice některých elementů, určených původně k prezentaci
  - detaily přístupnosti a nezávislosti na médiích jako jsou atributy alt a summary.
Definuje jazyk HTML 5, který může být aplikací SGML (HTML) i aplikací XML (XHTML).
- obě syntaxe jsou přípustné.
Definuje detailní model zpracování podporující interoperabilní implementace.
Vylepšuje značkování dokumentů.
Uvádí značkování a API pro např. Webové aplikace.
Cíle:
- HTML 4 a starší - příliš volná struktura
- XHTML 1.x - příliš pevná struktura
- Vytvořit standard, který bude využívat to dobré z obou specifikací.

Různé syntaxe HTML 5

HTML
- zpětně kompatibilní s HTML 4 a XHTML 1
- není plně kompatibilní s SGML specifikací HTML 4:
  - nepodporuje instrukce pro zpracování
  - a zkrácený zápis značek
    - prázdnou počáteční značku (<>)
    - prázdnou koncovou značku (</>)
    - …
- mimetype text/html
HTML sandboxed
- Syntaxe je shodná se syntaxí HTML.
- Vhodné pro použití se stránkami z nedůvěryhodných zdrojů.
  - mimetype text/html-sandboxed
XML
- kompatibilní s XHTML 1
- nutno definovat jmenný prostor http://www.w3.org/1999/xhtml
  - mimetype application/xhtml+xml nebo application/xml

Deklarace typu dokumentu

Slouží pouze k tomu, aby prohlížeče správně zvolili způsob zobrazování stránky.
Nemá žádný jiný účel.
Pro XML syntaxi je volitelná.
DOCTYPE:

<!DOCTYPE html>

Při použití HTML syntaxe není case-sensitive.
Jelikož se používá pouze pro zvolení správného režimu zobrazení prohlížeče, neobsahuje odkazy na DTD.

Novinky v HTML 5

Možnost přímo vkládat značkování SVG a MathML
Ukázkový dokument s vloženým SVG obrázkem:

<!DOCTYPE html>
<title>SVG v text/html</title>
<body>
 <p>
 Modrá elipsa
 <svg>
  <ellipse cx="100" cy="100" rx="90" ry="30" fill="blue"/>
 </svg>
 </p>
</body>

Změny v jazyce

Přidána řada nových elementů
- popis struktury
  - section, article, aside, header, footer, figure,
  - …

<figure>
 <video src="sample.mp4"></video>
 <figcaption>Ukázkové video</figcaption>
</figure>

multimédia
- video, audio.
nové typy vstupů ve formulářích (hodnoty atributu type u elementu input)
vynechány některé elementy (frame, frameset, noframes, …)
- vynechány některé atributy
- více viz specifikace a popis rozdílů oproti HTML4

Změny v jazyce (pokračování)

Přidány nové atributy:
- media u elementu a a area
- globální atribut contenteditable
- draggable
- změna hodnot atributy type u elementu input
- …
Vynechány některé elementy
- frame, frameset, noframes - nelze používat rámce pro zobrazení stránek - snižují přístupnost.
- font
- applet
- …
Vynechány některé atributy
- rev, charset (link, a)
- longdesc (img, iframe)
- target (link)
- align
- background
- bgcolor

Změny v jazyce - API

Přidána nová API
- pro přehrávání multimedií (videa/audia)
- pro offline práci s webovými aplikacemi
- umožňující webové aplikaci registrovat se pro zpracování určitého typu obsahu
- pro editaci obsahu ve spolupráci s atributem contenteditable
- pro Drag&Drop v kombinaci s atributem draggable
- …

Generování HTML5 pomocí XSLT

Deklarace typu dokumentu u HTML 5 neobsahuje odkazy na DTD.
Deklarace typu dokumentu slouží pouze k přepnutí prohlížeče do režimu pro HTML5.
Řešení:
- Možno generovat deklaraci typu dokumentu:

<!DOCTYPE html SYSTEM 'about:legacy-compat'>
<xsl:output method="html" doctype-system="about:legacy-compat" encoding="UTF-8" indent="yes"/>

Při použití XSLT procesoru Saxon ve verzi 9.4+ lze použít

<xsl:output method="html" version="5.0" encoding=UTF-8" indent="yes"/>

Nemělo by se používat, pokud lze generovat stručnou verzi.

Další zdroje informací

Specifikace HTML5
Rozdíly mezi XHTML 1.0, HTML 4 a HTML5
Stránky věnované HTML5
- html5tutorial
- Canvas tutorial
- HTML 5 tag reference na w3schools
Prezentace z brněnského setkání GUG vytvořená pomocí HTML5
- plně funkční v Google Chrome a Safari, projít si ji je možné v Opeře.
On-line nástroj pro testování podpory HTML5 v prohlížečích.
…