Zobrazení zdroje stránky Principy značkovacích jazyků a příklady použití jazyka HTML a XML

'''Značkovací jazyk''' je v informatice prostředek, pomocí kterého můžeme rozšířit text o další informace. To se nejčastěji týká '''struktury''', '''významu''' a '''způsobu zobrazování''' jednotlivých částí textu<ref>Značkovací jazyky (Markup languages), Management Mania [online]. [cit. 2018-04-24]. Dostupné z: https://managementmania.com/cs/znackovaci-jazyky-markup-languages</ref>.
Zásadní výhodou značkovacích jazyků je fakt, že pro jeho úpravu '''není zapotřebí žádný specializovaný program''', editovat tak lze i v nejběžnějších textových editorech od Poznámkového bloku až po kancelářský balík [[Microsoft Office]]. Lze najít také sofistikovanější aplikace přímo vytvořené na úpravu zdrojových kódů, ty jsou většinou zdarma dostupné (např. PSPad) a to často i s otevřeným zdrojovým kódem.

Značkovací jazyky se vymezují pomocí znaků, které zastávají konkrétní význam. Nejčastěji ve značkovacích jazycích nalezneme symboly < a > s textem uvnitř. Tento text dává jazyku instrukci, jak má následně s danou částí textu nakládat.

Nejznámějšími značkovacími jazyky jsou '''HTML''' ('''H'''yper'''T'''ext '''M'''arkup '''L'''anguage) a '''XML''' (e'''X'''tensible '''M'''arkup '''L'''anguage)- oba se nejčastěji používají na tvorbu webových stránek.

==Koncepce značkovacího jazyka HTML==

[https://wikisofia.cz/wiki/Www WWW] stránky jsou většinou tvořené v základu právě pomocí HTML (například v kombinaci s tzv. CSS - kaskádovými styly). Při tvorbě stránek se využívá tzv. značek (tagů), které dělíme na<ref>HTML příručka, Jak psát web [online]. [cit. 2018-04-24]. Dostupné z: https://www.jakpsatweb.cz/html/</ref>:
* '''Strukturální značky''' (např. nadpisy - <tt><big>'''<nowiki><h1></nowiki>'''</big></tt>)
* '''Popisné značky''' (např. titulek - <tt><big>'''<nowiki><title></nowiki>'''</big></tt>)
* '''Stylistické značky''' (např. tučné písmo - <tt><big>'''<nowiki><b></nowiki>'''</big></tt>)

Jako ukázka tvorby a funkčnosti nám bude sloužit následující kód:

<big><pre><h1>Ahoj světe!</h1>
<p>Toto je text prvního odstavce, jehož text může být zvýrazněný <b>tučně</b> či například <i>kurzívou</i>.</pre></big>


Dvojice značek začínající <tt><big>'''<nowiki><h1></nowiki>'''</big></tt> a končící <tt><big>'''<nowiki><h1></nowiki>'''</big></tt> označuje nadpis první úrovně. Pokud bychom zaměnili číslo 1 za jiné (např. číslo 2), postupovali bychom v nadpisové hierarchii směrem dolů.

Značka <tt><big>'''<nowiki><p></nowiki>'''</big></tt> označuje odstavec (angl. "Paragraph"), značky <tt><big>'''<nowiki><b></nowiki>'''</big></tt> a <tt><big>'''<nowiki><i></nowiki>'''</big></tt> potom zvýrazňují text: <tt><big>'''<nowiki><b></nowiki>'''</big></tt> jej napíše '''tučně''' (angl. "Bold") a <tt><big>'''<nowiki><i></nowiki>'''</big></tt> ''kurzívou'' (angl. "Italic")..

Zmíněné značky jsou '''obvykle párové''', přičemž je třeba každý pár '''uzavřít'''. Toho lze docílit znakem lomítko ('''/'''), jenž se napíše do druhé značky v páru. V tomto případě tedy <tt><big>'''<nowiki><i>takto</i></nowiki>'''</big></tt>.
Některé značky jsou však '''nepárové''', jako například značka pro vypsání vodorovné čáry:
<tt><big>'''<nowiki><hr></nowiki>'''</big></tt>.

Některé značky mohou obsahovat i další vlastnosti, které určují, jak se má konkrétní značka chovat. Nejběžnějším příkladem je značka pro odkaz, tedy <nowiki><a></nowiki>, ke které lze dodat vlastnost '''href'''. Ta prohlížeči určí, aby po kliknutí na text otevřel zmíněný odkaz, tedy například dle příkladu níže. V prohlížeči vidíme následující:

[http://priklad.cz <tt><big>'''Kliknutím na tento odkaz se dostaneme na stránku Příklad.cz'''</big></tt>]

Ve značkovacím jazyce je zapsáno takto:

<tt><big>'''<nowiki><a href="http://priklad.cz">Kliknutím na tento odkaz se dostaneme na stránku Příklad.cz</a></nowiki>'''</big></tt>

===Základní struktura HTML dokumentu===
HTML dokument má danou základní strukturu, která má několik bodů, jenž je třeba dodržet<ref>PILGRIM, Mark, 2014. Ponořme se do HTML5. Praha: CZ.NIC. CZ.NIC. ISBN 978-80-905802-6-8.</ref>:

* Deklarace typu dokumentu – značka <tt><big>'''<nowiki><!DOCTYPE html></nowiki>'''</big></tt> sděluje prohlížeči, že otevřel HTML dokument.
* Kořenový element – prvek html (značky <tt><big>'''<nowiki><html></nowiki>'''</big></tt> a <tt><big>'''<nowiki></html></nowiki>'''</big></tt>) – reprezentuje celý dokument.
* Hlavička dokumentu – prvek head (značky <tt><big>'''<nowiki><head></nowiki>'''</big></tt> a <tt><big>'''<nowiki></head></nowiki>'''</big></tt>) – obsahuje metadata, která se vztahují k celému dokumentu. Definuje např. kódování, název dokumentu, autora, popis, klíčová slova, titulek dokumentu nebo kaskádové styly.
* Tělo dokumentu – prvek body (značky <tt><big>'''<nowiki><body></nowiki>'''</big></tt> a <tt><big>'''<nowiki></body></nowiki>'''</big></tt>) – zahrnuje vlastní obsah dokumentu.

<big><pre>
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Titulek stránky</title>
 </head>
 <body>
  <h1>Nadpis stránky</h1>
  <p>Toto je <a href="http://example.com/">odkaz</a> v odstavci.</p>
  <!-- toto je komentář -->
 </body>
</html>
</pre></big>

==Koncepce značkovacího jazyka XML==
XML je obecný značkovací jazyk, který vyvinulo mezinárodní konsorcium W3C. Tento jazyk umožňuje snadné vytváření aplikací pro různé účely a typy dat. Nejčastěji se používá pro serializaci dat a konkuruje dalším známým jazykům, jako například JSON a YAML<ref>Co je XML?, 2005. Interval [online]. [cit. 2018-04-24]. Dostupné z: https://www.interval.cz/clanky/co-je-xml/</ref>.
Jazyk je tedy především určen pro výměnu dat (mezi tzv. aplikacemi) a také pro publikování dokumentů. Vzhled těchto dokumentů je často definován pomocí kaskádových stylů<ref>XML snadno a rychle, 2001. Zpravodaj ÚVT MU [online]. Brno, 3. února 2003 [cit. 2018-04-24]. Dostupné z: http://webserver.ics.muni.cz/bulletin/articles/268.html</ref>.

Struktura XML musí mít následující vlastnosti:
* Musí mít právě jeden kořenový (root) element.
* Neprázdné elementy musí být ohraničeny startovací a ukončovací značkou. Prázdné elementy mohou být označeny tagem „prázdný element“.
* Všechny hodnoty atributů musí být uzavřeny v uvozovkách – jednoduchých (') nebo dvojitých ("), ale jednoduchá uvozovka musí být uzavřena jednoduchou a dvojitá dvojitou. Opačný pár uvozovek může být použit uvnitř hodnot.
* Elementy mohou být vnořeny, ale nemohou se překrývat; to znamená, že každý (ne kořenový) element musí být celý obsažen v jiném elementu.

Stejně jako HTML se skládá ze značek, přičemž jako příklad uvádíme fiktivní zápis z výletu:

<big><pre>
<?xml version="1.0" encoding="UTF-8" ?>
<!-- Poznámka: Toto jsou informace o výletu -->
<výlet>
 <účastníci>
  <osoba jméno="Petr"/>
  <osoba jméno="František"/>
 </účastníci>
 <trasa>
  <start jméno="Liberec"/>
  <cíl jméno="Pardubice"/>
 </trasa>
 <svačina>
  <věc kolik="1">chleba</věc>
  <věc kolik="2">řízek
   <poznámka>Doporučuji dobře zabalit!</poznámka>
  </věc>
 </svačina>
</výlet>
</pre></big>


V tomto příkladu je kořenem celé struktury párová značka <tt><big>'''<nowiki><výlet></nowiki>'''</big></tt>, který obsahuje tři další značky: <tt><big>'''<nowiki><účastníci></nowiki>'''</big></tt>, <tt><big>'''<nowiki><trasa></nowiki>'''</big></tt> a <tt><big>'''<nowiki><svačina></nowiki>'''</big></tt>. Tyto značky dále obsahují další značky. U značky <tt><big>'''<nowiki><svačina></nowiki>'''</big></tt> také vidíme tzv. vnořenou značku s atributem (<tt><big>'''<nowiki><věc></nowiki>'''</big></tt>).

===Jmenné prostory===

Jmenné prostory (angl. "Namespace") umožňují logické sdružování jednoduchých či strukturovaných typů, které spolu souvisejí.

Jako příklad jmenných prostorů můžeme uvést nejčastější <tt><big>'''<nowiki>System</nowiki>'''</big></tt>, ke kterému se pojí následující typy<ref>Základní prvky jazyka XML: 2. Jmenný prostor (namespace), 2011. Katedra informatiky [online]. [cit. 2018-04-24]. Dostupné z: http://www.cs.vsb.cz/behalek/vyuka/pcsharp/text/ch04s02.html</ref>:

* Array - umožňuje práci s poli
* Console - práce s konzolí
* Math - třída pro matematické funkce a operace
* Random - generování náhodných čísel
* String - práce s řetězci
* DateTime - struktura pro práci s datem a časem

== Odkazy ==

=== Reference ===

<references/>

=== Externí odkazy ===

* [https://www.jakpsatweb.cz/zaklady-html.html Základy HTML]
* [https://www.w3schools.com/xml/xml_whatis.asp XML Introduction]

=== Související články ===

* [[World Wide Web]]
* [[Internet]]
* [[Hypertext]]
* [[Programovací jazyk]]
* [[Transformace konceptuálního modelu na datový model, základní prvky datového modelu, specifikace úlohy primárních a cizích klíčů]]
* [[Manipulační část jazyka SQL (DML – insert, update, delete) a příklady na databázi Knihovna]]
* [[Příkaz Select, jeho využití v databázi Knihovna]]

=== Klíčová slova ===
Značkovací jazyky, HTML, XML, jmenný prostor

[[Kategorie: Informační studia a knihovnictví]]
[[Kategorie:Státnicové otázky UISK]]