HTML — Hypertextový značkovací jazyk: co to je, použití a verze

HTML — co je to, jak funguje a kde se používá: přehled značkování, metainformací, CSS, JavaScriptu a verzí včetně HTML5.2.

Autor: Leandro Alegsa

02-03-2026 13:04

Hyper Text Markup Language (HTML) je značkovací jazyk pro vytváření webových stránek. Webové stránky se obvykle prohlížejí ve webovém prohlížeči. Mohou obsahovat písmo, odkazy, obrázky, a dokonce i zvuk a video. Jazyk HTML se používá k označení a popisu každého z těchto druhů obsahu, aby je webový prohlížeč mohl správně zobrazit. Jazyk HTML lze také použít k přidání metainformací na webovou stránku. Metainformace obvykle webové prohlížeče nezobrazují a jsou to údaje o webové stránce, např. jméno osoby, která stránku vytvořila. Kaskádové styly (CSS) se používají ke stylování prvků HTML, zatímco JavaScript slouží k manipulaci s prvky HTML a styly CSS.

Co HTML dělá a kde se používá

HTML popisuje strukturu obsahu na webu pomocí značek (tagů). Každá značka říká prohlížeči, jaký druh obsahu se nachází (nadpis, odstavec, seznam, obrázek, odkaz, formulář apod.). Díky tomu prohlížeč dokáže obsah správně vykreslit a uživatel s ním pracovat. HTML najdete prakticky všude na internetu: od jednoduchých informačních stránek přes blogy a e‑shopy až po komplexní webové aplikace.

Základní struktura HTML dokumentu

Typický HTML dokument obsahuje elementy, které definují hlavičku i tělo stránky. Základní kostra vypadá přibližně takto:

— deklarace typu dokumentu (informuje prohlížeč o verzi HTML).
<html> — kořenový element celé stránky.
<head> — metadata, jako je kódování znaků (<meta charset="utf-8">), název stránky (<title>), odkazy na CSS nebo meta tagy.
<body> — viditelný obsah: nadpisy (<h1>–<h6>), odstavce (<p>), odkazy (<a>), obrázky (<img>), seznamy (<ul>, <ol>), formuláře (<form>), atd.

Semantika a moderní značky

Novější verze HTML zdůrazňují semantiku — používání elementů, které popisují účel obsahu: <header>, <nav>, <main>, <article>, <section> nebo <footer>. Semantické značky zlepšují čitelnost kódu, usnadňují indexaci pro vyhledávače a zvyšují přístupnost pro asistivní technologie (např. čtečky obrazovky).

Multimédia, grafika a interaktivita

HTML umožňuje vkládat multimediální obsah přímo do stránky: <img> pro obrázky, <audio> pro zvuk a <video> pro video. Pro kreslení a dynamickou grafiku slouží <canvas> a možnost osazení vektorové grafiky přes SVG. Interaktivitu obvykle přidává JavaScript, zatímco vzhled a rozložení se řeší pomocí CSS.

Metainformace a SEO

V <head> sekci se uvádějí metadatové prvky (např. <meta name="description">), které pomáhají vyhledávačům správně indexovat stránku a poskytují další informace o obsahu. Správné používání titulů, nadpisů a meta tagů má vliv na SEO (optimalizaci pro vyhledávače).

Verze HTML a standardy

HTML je definováno standardy, které vytváří organizace jako konsorcium World Wide Web Consortium (W3C) a WHATWG. Významné milníky:

HTML5 — velká modernizace jazyka, která přidala multimédia, nové semantické značky a API pro webové aplikace. Oficiální doporučení W3C pro HTML5 bylo publikováno v roce 2014.
HTML 5.1 a 5.2 — postupné aktualizace, rozšiřující a upřesňující specifikaci; W3C vydává stabilní doporučení, zatímco WHATWG udržuje tzv. "living standard" (žijící standard), který se průběžně vyvíjí.

Pro vývojáře tedy platí, že je dobré sledovat jak W3C doporučení, tak WHATWG living standard, protože browsery často implementují nové funkce podle WHATWG specifikací a praktických potřeb webu.

Dostupnost a responzivní design

Při tvorbě stránek je důležité myslet na přístupnost (accessibility) — správné používání alternativních textů u obrázků (atribut alt), sémantických značek, ARIA atributů pro zlepšení práce s asistivními zařízeními. Responzivní design, který zajistí, že stránka bude vypadat dobře na mobilu i desktopu, se řeší kombinací HTML (struktura) a CSS (media queries, flexibilní layouty).

Nástroje pro práci s HTML

HTML lze psát v libovolném textovém editoru (Notepad, VS Code, Sublime Text) nebo v profesionálních IDE a vizuálních editorech (Adobe Dreamweaver, online editory). Pro ověřování a ladění se používají nástroje vývojářů v prohlížečích (DevTools), validátory HTML a testery přístupnosti.

Shrnutí

HTML je základním stavebním kamenem webu — popisuje strukturu a obsah stránek, spolu s CSS a JavaScriptem tvoří kompletní prostředí pro tvorbu moderních webových aplikací. Naučit se správně používat HTML, rozumět jeho semantice a standardům je první krok k tvorbě kvalitních a přístupných webů.

Tagy

Jazyk HTML používá speciální části programovacího jazyka zvané "značky", které prohlížeči umožňují zjistit, jak má webová stránka vypadat. Značky se obvykle vyskytují ve dvojicích: úvodní značka definuje začátek bloku obsahu a uzavírací značka definuje konec tohoto bloku obsahu. Existuje mnoho různých druhů značek a každá z nich má jiný účel. Příklady značek najdete v části Základní značky HTML níže.

Některé značky fungují pouze v určitých prohlížečích. Například značka <menuitem>, která se používá k tomu, aby se něco zobrazilo, když člověk stiskne pravé tlačítko myši, funguje pouze v prohlížeči Mozilla Firefox. Ostatní prohlížeče tuto značku jednoduše ignorují a nápis zobrazí normálně. Mnoho tvůrců webových stránek se používání těchto "nestandardních" značek vyhýbá, protože chtějí, aby jejich stránky vypadaly ve všech prohlížečích stejně.

Příklad

Zde je příklad stránky v jazyce HTML.

1 <!DOCTYPE html> 2 < html> 3 < head> 4 < title> Toto je název stránky </title> 5 </head> 6 < body> 7 < p> Toto je odstavec. </p> 8 < a href="https://www.domain.com"> Toto je odkaz. </a> 9 < img src="image.jpg" alt="Obrázek"> 10 </body> 11 </html>

Jednoduchá stránka HTML by vypadala takto: jeden odstavec s textem "Hello world! ".

1 <!DOCTYPE html> 2 < html> 3 < head> 4 < title> Ahoj! </title> 5 </head> 6 < body> 7 < p> Hello world! </p> 8 </body> 9 </html>

Základní značky HTML

Název štítku	Název	Funkce	Příklad kódu
`<!DOCTYPE>`	Doctype	Definuje typ dokumentu	<!DOCTYPE html>
`<html>`	HTML	Definuje dokument HTML a spustí dokument HTML.	< html> Celý kód</html>
`<head>`	Hlava	Obsahuje jakýkoli kód, který se nepoužívá k zobrazení prvků na webové stránce.	< head></head>
`<title>`	Název	Určuje název webové stránky (zobrazuje se na kartě) a zadává se do `<head>.`	< title> Webová stránka</title>
`<body>`	Tělo	Obsahuje viditelné prvky webové stránky (a obsahuje odstavec a další).	<body> Html značky</body>
`<h1>` až `<h6>`	Rubriky	Nadpisy různých velikostí (`<h1>` je největší)	< h1> Nadpis</h1>
	Odstavec	Definuje odstavec textu	< p> TEXT</p>
	Kotva	Vytváří aktivní odkazy na jiné webové stránky	< a href="www.domain.com"> Navštivte naše stránky</a>
`<img>`	Obrázek	Zobrazí obrázek na stránce	< img src="ImageUrl" alt="Text zobrazený, pokud není k dispozici obrázek">
`<br>`	Přestávka	Vloží jeden zlom řádku	Text < br> Text
`<center>`	Středisko	Přesune obsah do středu stránky	< center> Kód</center>
`<script>`	Skript	Vytvoří skript na webové stránce, obvykle napsaný v jazyce JavaScript.	< script> document. write("Hello World!")</script>

Použití značek HTML

Vytvoření webové stránky

Vytvoření webové stránky je snadné.Stačí si zapamatovat značky a pořadí, v jakém chcete webovou stránku vytvořit.

Nejprve je třeba najít místo pro zadání značek HTML (doporučuji Poznámkový blok) a zadat značky.

Zde je další příklad stránky se značkou HTML.

<html>

<head>

<h1> Ahoj světe!</h1>

</head>

<body>

<p>

Toto je stránka HTML Tag.

</p>

Podle: *Vložte jméno*

</footer>

</html>

Po dokončení uložte tento soubor ve formátu: helloworld.htm.

(nedělejte mezery)

A je hotovo! Jakmile ji uložíte do počítače, po stisknutí vás to pošle na vaši webovou stránku v Googlu!

Otázky a odpovědi

Otázka: Co je to HTML?

Odpověď: HTML je typ značkovacího jazyka, který se používá k vytváření webových stránek obsahujících písmo, odkazy, obrázky a audiovizuální materiály.

Otázka: Jaká je funkce jazyka HTML?

A: Úkolem jazyka HTML je sdělit webovým prohlížečům, jak mají webové stránky vypadat, a přidat metainformace, například jméno tvůrce webové stránky.

Otázka: Jaké jsou příklady médií, která lze zahrnout do webových stránek vytvořených pomocí jazyka HTML?

Odpověď: Příklady médií, která lze zahrnout do webových stránek vytvořených pomocí jazyka HTML, jsou zvukové soubory a videoklipy.

Otázka: Jak CSS doplňuje jazyk HTML?

Odpověď: CSS se používá ke změně vzhledu stránek HTML.

Otázka: Jaká je role jazyka JavaScript při tvorbě webových stránek?

Odpověď: JavaScript je při vývoji webových stránek základním skriptovacím jazykem, protože říká webovým stránkám, jak se mají chovat, a může měnit vzhled HTML a CSS.

Otázka: Kdo je zodpovědný za tvorbu jazyka HTML?

A: HTML vytváří konsorcium World Wide Web Consortium (W3C).

Otázka: Jaká je současná standardní verze jazyka HTML?

Odpověď: Od září 2018 je nejnovější standardní verzí HTML 5 verze 5.2.

Vyhledávání