HTML

Z Multimediaexpo.cz

Aktuální verze z 10. 6. 2014, 22:59

Oficiální logo HTML5

Jednoduchý HTML kód

HTML je zkratka z anglického HyperText Markup Language, značkovací jazyk pro hypertext. Je jedním z jazyků pro vytváření stránek v systému World Wide Web, který umožňuje publikaci stránek na Internetu.

Jazyk je podmnožinou dříve vyvinutého rozsáhlého univerzálního značkovacího jazyka SGML (Standard Generalized Markup Language). Vývoj HTML byl ovlivněn vývojem webových prohlížečů, které zpětně ovlivňovaly definici jazyka.

Vývoj jazyka

V roce 1989 spolupracovali Tim Berners-Lee a Robert Caillau na propojeném informačním systému pro CERN, výzkumné centrum fyziky poblíž Ženevy ve Švýcarsku. V té době se pro tvorbu dokumentů obvykle používal TeX, Postscript a také SGML. Berners-Lee si uvědomoval, že potřebují něco jednoduššího a v roce 1990 byl tedy navržen jazyk HTML a protokol pro jeho přenos v síti - HTTP (HyperText Transfer Protocol - přenosový protokol hypertextu).

V roce 1991 CERN zprovoznil svůj web. Současně NCSA (National Center for Supercomputer Applications) vybídlo Marca Andreessena a Erica Binu k vyvinutí prohlížeče Mosaic. Byl vyvinut v roce 1993 pro počítače PC a Macintosh a měl obrovský úspěch. Byl to první prohlížeč s grafickým uživatelským rozhraním. Došlo k velkému rozvoji webu a bylo nutné pro HTML definovat standardy.

Verze jazyka

• Verze 0.9 – Byla vydána zhruba v roce 1991. Nepodporuje grafický režim (Tim Berners-Lee)
• Verze 2.0 – Zachycuje stav jazyka v polovině roku 1994. Standard vydala komunita IETF (Internet Engineering Task Force). Je to první verze, která odpovídá syntaxi SGML. Přidává k původní specifikaci interaktivní formuláře, podpora grafiky.
• Verze 3.2 – Byla vydána 14. ledna 1997 a zachycuje stav jazyka v roce 1996. Připravovaná verze HTML 3.0 nebyla nikdy přijata jako standard, protože byla příliš složitá a žádná firma nebyla schopna naprogramovat její podporu ve svém prohlížeči. Standard už vydalo konsorcium W3C, stejně jako následující verze. Přidává k jazyku tabulky, zarovnávání textu a stylové elementy pro ovlivňování vzhledu.
• Verze 4.0 – Byla vydána 18. prosince 1997. Do specifikace jazyka přidala nové prvky pro tvorbu tabulek, formulářů a nově byly standardizovány rámy (frames). Tato verze se snaží dosáhnout původního účelu - prvky by měly vyznačovat význam (sémantiku) jednotlivých částí dokumentu, vzhled má být ovlivňován připojovanými styly. Některé prezentační elementy byly zavrženy.
• Verze 4.01 – Byla vydána 24. prosince 1999. Tato verze opravuje některé chyby verze předchozí a přidává některé nové tagy. Podle původního předpokladu se mělo jednat o poslední verzi, po které by se přešlo na XHTML.
• Verze 5.0 – 7. března 2007 byla založena nová pracovní skupina HTML, jejíž cílem je vývoj nové verze HTML. V květnu 2007 bylo odhlasováno, že základem nové specifikace se stanou Web Applications 1.0 a Web Forms 2.0 ze specifikace WHATWG. Jako název nové specifikace bylo odhlasováno HTML 5.0 a specifikace by měla být hotova v roce 2010.

Popis jazyka

Koncepce

Jazyk HTML je od verze 2.0 aplikací SGML. Je charakterizován množinou značek a jejich atributů pro danou verzi definovaných. Mezi značky se uzavírají části textu dokumentu a tím se určuje význam (sémantika) obsaženého textu. Názvy jednotlivých značek se uzavírají mezi úhlové závorky ("<" a „>“). Část dokumentu uzavřená mezi značkami tvoří tzv. element (prvek) dokumentu. Součástí obsahu elementu mohou být další vnořené elementy. Atributy jsou doplňující informace, které upřesňují vlastnosti elementu.

Značky (také nazývané tagy) jsou obvykle párové. Rozlišujeme počáteční a koncové značky. Koncová značka má před názvem značky znak lomítko. Příklad pro označení odstavce:

<p>Text odstavce</p>

Některé značky jsou nepárové - neobsahují žádný text. Příklad pro vykreslení vodorovné čáry

<hr>

Tagy mohou obsahovat atributy popisující jejich vlastnosti nebo nesou jinou informaci. Příkladem může být odkaz (tag a), jehož atribut href říká, kam se uživatel po kliknutí na něj dostane (v tomto příkladu na stránku http://example.com)

<a href="http://example.com">odkaz</a>

Pro každou verzi existuje definice pravidel DTD (Document Type Definition). Od verze 4.01 musí být odkaz na deklaraci DTD v dokumentu uveden pomocí klíčového slova DOCTYPE. DTD definuje pro určitou verzi, které elementy je možné používat a s jakými atributy.

Dokument může mimo značkování obsahovat další prvky:

• Direktivy - začínají znaky „<!“, jsou určeny pro zpracovatele dokumentu (prohlížeč)
• Komentáře - pomocné texty pro programátora, nejsou součástí obsahu dokumentu a nezobrazují se (prohlížeč je ignoruje). Příklad komentáře je níže.
• Kód skriptovacích jazyků
• Definice událostí a kód pro jejich obsluhu

Struktura dokumentu

Dokument v jazyku HTML má předepsanou strukturu:

• Deklarace DTD - je povinná až ve verzi 4.01, je uvedena direktivou <!DOCTYPE.
• Kořenový element - element html (značky <html> a </html>) reprezentuje celý dokument. Je nepovinný, ale je doporučeno ho používat.
• Hlavička elementu - jsou to metadata, která se vztahují k celému dokumentu. Definují např. název dokumentu, jazyk, kódování, klíčová slova, popis, použitý styl zobrazení. Hlavička je uzavřena mezi značky <head> a </head>.
• Tělo dokumentu - obsahuje vlastní text dokumentu. Vymezuje se značkami <body> a </body>

Příklad zdrojového kódu

Příklad HTML pro verzi 4.01:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!-- toto je komentář -->
   <head>
      <title>Titulek stránky</title>
   </head>
<!-- tělo dokumentu -->
   <body>
      <h1>Nadpis stránky</h1>
      <p>Toto je tělo dokumentu</p>
   </body>
</html>

Tvoříme odkazy

<A HREF="http://www.multimediaexpo.cz/">"Multimediaexpo – priklad odkazu"</A>

Vkládáme obrázek K přidání obrázku používáme tag IMG, tímto tagem však můžeme přidat i video nebo píseň,není to však vhodné.

<IMG src="nazev.soubor">

Programovaný soubor poté bude přidán.

Druhy značek

Značky můžeme z hlediska významu rozdělit na tři základní skupiny:

• Strukturální značky jsou ty, které rozvrhují strukturu dokumentu. Příkladem jsou odstavce (<p>), nadpisy (<h1>, <h2>). Dodávají dokumentu formu.
• Popisné (sémantické) značky popisují povahu obsahu elementu. Příklad nadpis (<title>) nebo adresa (<address>). Současný trend je orientován právě na sémantické značky, které usnadňují automatizované zpracovávání dokumentů a vyhledávání informací v záplavě dokumentů na webu. Vyvrcholením této snahy je v současné době jazyk XML.
• Stylistické značky určují vzhled elementu při zobrazení. Typickým příkladem je značka pro tučné písmo (<b>). Tento druh značek se nedoporučuje používat, trendem je používání kaskádových stylů oddělených od obsahu dokumentu. Problém je především v tom, že tyto značky jsou orientovány na obrazovku monitoru, problémy mohou nastat při používání dokumentu jiným způsobem - alternativní prohlížeče pro postižené (čtečky pro slepce), v mobilních zařízeních a podobně. Kaskádové styly umožňují definovat rozdílné zobrazení pro různá zařízení.

Parsování v prohlížečích

Webové prohlížeče jsou programy, jejichž účelem je prezentovat dokument na zobrazovacím zařízení - převážně monitoru počítače. Dokument je prohlížečem načítán a rozkládán (parsován, syntaktická analýza) na jednotlivé elementy. Prohlížeč obsahuje tabulku značek, které podporuje. Tuto tabulku je možné omezit typem dokumentu (DTD), je-li deklarován.

Každému elementu je poté přiřazen styl (způsob zobrazení). Styly mohou být uvedeny ve stylovém předpisu. Vlastnosti stylů, které nejsou předepsány, doplní prohlížeč podle implicitního stylu, který má zabudován. Některé prohlížeče umožňují uživateli implicitní styly definovat.

Novější prohlížeče pracují obecně ve dvou základních režimech:

• Standardní režim - je dodržována specifikace verze HTML, deklarovaná v dokumentu. Elementy v dokumentu musí odpovídat verzi, neznáme elementy jsou považovány za chybu a nezobrazují se. Netolerují se syntaktické chyby.
• Quirk mód - nestandardní režim. Prohlížeč se snaží „napravovat“ chyby v syntaxi dokumentu, domýšlí si chybějící koncové párové značky, neznámé elementy zobrazuje implicitním formátem.

Režim se stanoví obecně podle typu dokumentu, ale rozhodování je dost složité (označuje se výrazem doctype sniffing). Účelem je zachování zpětné kompatibility pro dokumenty, které nedodržují definici HTML. Tato vlasnost ale umožňuje vytvářet nestandardní dokumenty - autory zatím nic nenutí pracovat bez chyb podle specifikace.

Prohlížeče mají různé implicitní styly zobrazování a chovají se různě v quirk módu. Stejný dokument se tedy může v různých prohlížečích zobrazovat různě, rozdíly jsou i mezi verzemi prohlížeče stejného výrobce. Současné chování prohlížečů je výsledek vývoje, kdy si výrobci jednotlivých prohlížečů přizpůsobovali definici HTML podle svých potřeb a prohlížeče podporovaly nestandardní elementy a syntaxi. Řada těchto „vylepšení“ byla následně přejímána do standardů, a některé zase v dalších verzích vyřazeny.

Budoucnost HTML

Vývoj jazyka HTML byl ukončen verzí 4.01. Dalším pokračováním vývoje jazyků pro psaní dokumentů na webu je jazyk XHTML.

Důvodů pro tuto změnu je celá řada. Překotný vývoj prohlížečů umožnil vznik obrovského množství dokumentů, které neodpovídají specifikaci HTML. Současné prohlížeče tolerují chybné značkování (neuzavřené, překřížené, či špatně vnořené elementy) a řadu dalších chyb a při parsování se s těmito chybami snaží vyrovnat („myslí“ za uživatele), zpravidla však ale ne dle představ tvůrce. Tento princip je ale příliš náročný pro nový druh aplikací, které vznikají pro malá méně výkonná zařízení - mobilní telefony, přenosné počítače (palmtopy) atd. Tyto aplikace potřebují přesně definovanou strukturu s přesnými pravidly. To poskytuje jazyk XML, ale HTML není aplikací XML a těmto novým požadavkům nevyhovuje. Pokud by však nové verze prohlížečů začaly vyžadovat přesně napsané HTML dokumenty bez chyb, pravděpodobně většina dokumentů na webu by nešla zobrazit.

V současné době (rok 2004) probíhá určitý spor mezi webovými vývojáři o to, zda přejít na XHTML, nebo dále používat HTML. Jsou různé argumenty pro a proti, souvisí také s používáním kaskádových stylů a se způsobem rozvržení stránky (tabulky versus pozicování styly). Tento argument je zavádějící, protože XHTML 1.0 a HTML 4.0 jsou si prakticky ekvivalentní, měnila se pouze syntaxe. Velký vliv při tomto rozhodování má kvalita nejrozšířenějších prohlížečů, stránky se musí navrhovat tak, aby šly zobrazit běžnými prostředky.

Vývoj tedy pokračuje jiným jazykem, ale specifikace HTML platí dál - je tedy možné vyvíjet nové aplikace a vytvářet dokumenty podle HTML 4.01 všude tam, kde tento jazyk stačí. I HTML kód je možné psát tak, aby do značné míry vyhovoval novým požadavkům na dokumenty webu.

Poznámka k terminologii

Vzhledem k rozvoji jak na poli software, tak i hardware, přibylo mnoho nových možností zpracování HTML dokumentů. Proto se pojem „prohlížeč“ stal zavádějícím (jsou např. i hlasové čtečky, či tiskárny) a W3C začalo používat termín „user agent“. V tuto chvíli (konec r. 2005) ještě neexistuje jednotný český termín, používá se buď doslovný překlad - uživatelský agent, nebo např. „interpret“, „interpretr“, „zařízení“ či jiné.

Podívejte se také na

• XML
• XHTML
• HTTP
• Metadata
• HTML entita
• HTML tagy

Externí odkazy

• Stránky konsorcia W3C o značkovacích jazycích (anglicky)
• Specifikace HTML verze 4.01 (anglicky)
• New elements in HTML 5 (anglicky)
• Interval.cz - české stránky věnované webdesignu a webdevelopmentu
• Jak psát web - o tvorbě internetových stránek
• Interval.cz - Seznámení s HTML 5
• Lupa.cz - Webové aplikace podle WHATWG