Na czym polegają różnice między HTML5 a HTML4.01 oraz XHTML 1.0?

HTML5 rozszerza możliwości HTML4.01 o semantyczne tagi (<nav>, <article>, <aside>), nowe typy wejść dla formularzy (email, date, range), obsługę multimediów bez wtyczek (<video>, <audio>), API do pracy offline (Service Worker, Cache Storage) i lokalnego przechowywania (localStorage, sessionStorage), a także API dla websocketów. Składnia HTML5 jest bardziej elastyczna, pozwala na pomijanie niektórych tagów zamykających i atrybutów w określonych przypadkach.

XHTML 1.0 jest przekształceniem HTML 4.01 w formę aplikacji XML. Główna różnica to bardziej rygorystyczna składnia: wszystkie tagi muszą być zamknięte (w tym samozamykające się jak <br />), wszystkie atrybuty muszą być w cudzysłowach, a nazwy tagów i atrybutów są wrażliwe na wielkość liter. Celem było stworzenie bardziej strukturalnej i poprawnej składni dla lepszej zgodności z parserami XML. Jednak w praktyce większość przeglądarek traktowała XHTML jak HTML, ignorując rygorystyczne zasady, jeśli dokument nie był wysyłany z MIME type application/xhtml+xml.

Porównanie w tabeli:

Cecha	HTML4.01	XHTML 1.0	HTML5
Składnia	Bardziej elastyczna	Rygorystyczna (oparta na XML)	Bardziej elastyczna niż XHTML, strukturalna
Zamknięcie tagów	Nie zawsze wymagane	Zawsze wymagane (<br />, <img>)	Czasami nie wymagane (<p>, <li>, itp.)
Wielkość liter	Nieczuła na wielkość liter	Wrażliwa na wielkość liter	Nieczuła na wielkość liter
Cudzysłowy w atrybutach	Nie zawsze konieczne	Zawsze konieczne	Czasami nie konieczne w określonych przypadkach
Obsługa multimediów	Wymaga wtyczek	Wymaga wtyczek	Natychmiastowa (<video>, <audio>)
Tag semantyczny	Mniej (<div>, <span>)	Podobnie do HTML4.01	Więcej (<nav>, <article>, <aside>)
Nowe API	Ograniczone	Ograniczone	WebSocket, Local Storage, Canvas, SVG
Obsługa offline	Prawie brak	Prawie brak	Cache API, Service Worker
Typ MIME	text/html	application/xhtml+xml (ścisłe), text/html (jak HTML)	text/html
Rozszerzalność	Ograniczona	Opiera się na XML	Przez API i elementy niestandardowe (w przyszłości)

Przykład składni:

<!-- HTML 4.01 -->
<p>Akapit.
<img src="image.jpg" alt=Obrazek>

<!-- XHTML 1.0 -->
<p>Akapit.</p>
<img src="image.jpg" alt="Obrazek" />

<!-- HTML5 -->
<p>Akapit.
<img src="image.jpg" alt="Obrazek">

HTML5 stał się de facto standardem dla rozwoju stron internetowych, łącząc elastyczność HTML4.01 z nowymi możliwościami i częściowo dziedzicząc idee rygorystyczne XHTML, skupiając się na kompatybilności.