Značkovací jazyky a spol. HTML/XHTML XML JSON YAML Markdown, Texy!
Značkovací jazyky Angl. termín "MARKUP" ("vyznačování")
Smyslem je přidat do textu metainformace: •formátovací •sémantické Výsledek je prostý text, lidsky čitelný. K vytvoření stačí textový editor.
Značkovací jazyky vs Programovací jazyky Programovací jazyky slouží k zápisu algoritmů, tedy předpisu činností Značkovací jazyky pouze zapisují (formátovaná) data
TeX, LaTeX \paragraph\ifx\pdfoutput\undefined\def\xsc#1 #2 {#2\ }\def\zrc#1{#1}\def\otoc#1{#1}\else\def\xsc#1 #2 {\setbox0=\hbox{#2}\hbox{\pdfliteral{q #1 0 0 1 0 0 cm}\rlap{#2}\pdfliteral{Q}\kern#1\wd0} }\def\zrc#1{\setbox0=\hbox{#1}\hbox{\kern\wd0\pdfliteral{q -1 0 0 1 0 0 cm}\rlap{#1}\pdfliteral{Q}}}\def\otoc#1{\setbox0=\hbox{#1}\hbox{\pdfliteral{q 0.98 0.2 0.2 0.98 0 0 cm}\rlap{#1}\pdfliteral{Q}\kern\wd0}}\fiVelkou výhodou pdf\TeX u je moľnost zapisovat příkazy přímo do pdf~souboru pomocí makra \verb \pdfliteral . Takto je moľné vyuľít vąechny moľnosti, které nabízí formát pdf, například moľnost vloľit zvuk nebo videoklip. Daląí moľností je změna transformační matice pdf~operátorem \verb cm . Tak lze provádět s textem různé afinní transformace, například \otoc{otočení} nebo \zrc{zrcadlení}. Vynásobením $x$-ové souřadnice lze docílit \xsc1.5 zvýraznění textu. Při změně transformační matice a jejím navrácením pdf~operátorem~\verb Q vąak dojde k neľádoucímu posunu daląího textu. To lze vyřeąit tak, ľe se pdf~prohlíľeč oklame makrem \verb \rlap (tento neľádoucí posun bude nulový) a ľe se \TeX{} oklame příkazem \verb \kern (nelze pouľít \verb \hskip , aby nedoąlo k neľádoucímu zalomení). Celý problém je vyřeąen makrem \verb \xsc .\begin{verbatim}\def\xsc#1 #2 {\setbox0=\hbox{#2}\hbox{\pdfliteral{q #1 0 0 1 0 0 cm}\rlap{#2}\pdfliteral{Q}\kern#1\wd0} }\end{verbatim}Pouľití makra je
TeX, LaTeX Čti: [tech]!!! Open source typografický "standard" Zaměřený především na definici vzhledu a na sazbu výsledného dokumentu Velmi oblíbený v akademickém prostředí i přes totální nečitelnost / díky totální nečitelnosti *) Řada nadstaveb usnadňuje psaní *) Sadističtí vyučující trvají na tom, že studenti v TeX-u musí psát diplomové práce
XML Obecný značkovací jazyk Lze nadefinovat vlastní sadu elementů, entit a tím přesně určit formát takového dokumentu
Pro elementy, atributy a entity využívá stejný zápis jako HTML – tedy lomené závorky <element> ... , &entity; či atributy, ale má přísnější pravidla: - hodnoty atributů v uvozovkách - elementy musí být uzavřené
XML XML: eXtensible Markup Language Velmi komplexní nástroj s přísnými syntaktickými pravidly
Pomocné nástroje: DTD (Document Type Definition) – definuje entity, elementy a syntaktická pravidla XSLT (eXtensible Stylesheet Language Transformations) – popisuje pravidla transformace dokumentu XML na jiný formát (HTML, PDF atd.)
XML ... Pomocné nástroje: XQuery – dotazovací jazyk podobný SQL pro práci s XML dokumenty
Aplikace: Syndikační formáty RSS, ATOM Grafický formát SVG Serializace HTML: XHTML
XML Díky volnosti lze XML aplikovat na jakákoli strukturovaná data: <posluchaci kurz="666"> <posluchac> <jmeno>Jan <prijmeni>Novak <posluchac> .....
XML Existuje podpora snad pro všechny programovací jazyky; XML je tedy ideální pro návrh datových formátů, které budou sloužit pro výměnu dat mezi systémy
Nevýhody: - Ukecané: velký podíl "balastních dat" - Pro některé implementace příliš přísná pravidla - Pro některé implementace příliš mocné
HTML vs XHTML XHTML1 je HTML4, zapsané v podobě XML
JSON JavaScript Object Notation
Zápis strukturovaných dat tak, jak jej zapisuje JavaScript. Výhody: Rozumí tomu JavaScript Rozumí tomu programátor Minimum balastních informací (=> rychlost) Nevýhoda: jednoduchost
JSON {posluchaci: {kurz:"666", posluchaci: [ {jmeno: "Jan", prijmeni: "Novak"}, {......} ] } }
JSON Existují implementace pro všechny jazyky používané na webu Pro velkou část webových aplikací zcela postačující schopnosti
YAML Yet Another Markup Language (YAML Ain't Markup Language) Blíží se "přirozenému zápisu struktury" používá odsazování, odrážky apod. Cílem je mít nástroj pro zápis dat v textovém formátu, který by byl intuitivně čitelný a upravovatelný
YAML posluchaci: kurz: "666" jmeno: "Jan" prijmeni: "Novak" jmeno: "Pepa" prijmeni: "Zdepa" jmeno: "Jolka" prijmeni: "Krásná"
Rekapitulace TeX, LaTeX – unixové nástroje, zaměřené na typografii XML – univerzální jazyk pro vytváření vlastních formátů JSON – jednoduché "programátorské" zapisování strukturovaných dat
YAML – strukturování běžnými textovými prostředky
HTML bez <, > Uživatelsky vytvářený obsah vyžaduje, aby jej uživatelé zapisovali tak, že bude kompatibilní s webem a bude splňovat určité požadavky.
Jak mohou obsah psát? 1. V HTML (to neumí) 2. Ve Wordu (problémy s převodem) 3. V online editoru 4. Ve strukturovaném zápise pomocí sémantického jazyka
WYSIWYG editory WYSIWYG – "What You See Is What You Get"
WYSIWYG editory Největší nevýhoda WYSIWYG:
Uživatelé jsou "kreativní"! S WYSIWYG se nesoustředí na to, co chtějí sdělit, ale na to, jak to má vypadat. Výsledek je sice validní HTML, ale sémanticky "nanic"
WYSIWYG editory...? Mnohem výhodnější je nechat uživatele jednoduše označit, co chtějí říct; čím míň grafických a prezentačních možností mají, tím lépe:
•soustředí se na strukturu sdělení •grafickou kreativitou "nerozkopou" web •výsledek se snáz transformuje do potřebné podoby
Sémantické značkovací jazyky Intuitivní zápis v podobě prostého textu:
Nadpis ====== Kapitola 1 -------------Někdo musel Josefa K. pomluvit, neboť byl, ač neprovedl nic zlého, jednou ráno zatčen.
Texy! "Texy! je sexy!"
Původní český nástroj výstupem je validní HTML s kvalitní typografií Velké možnosti rozšíření
http://texy.info
Markdown, Textile, ... Texy! není první ani jediný podobný.
Další podobné nástroje: Markdown Textile Wikipedia má vlastní značkovací jazyk Liší se pouze v detailech značkování
Všechno tohle dohromady... •Sémantické značkovací jazyky lze velmi dobře zkonvertovat do validního HTML •Výsledek má vysokou sémantickou úroveň (zůstává zachována informace "co to je?") •Výsledek mívá i velmi vysokou typografickou úroveň (pomlčky, správné uvozovky, správně odlišený matematický symbol "krát")
Všechno tohle dohromady...
XML
TeX
JSON YAML
HTML
PDF, ... Prezentační
Datové
Texy, Markdown, Textile
Zpět k HTML... Jak vytvořit webovou stránku v HTML?
1. 2. 3. 4.
textovým editorem (Notepad, PSPad, ...) HTML editorem (Hotmetal a spol.) WYSIWYG HTML editorem (Dreamweaver) strojově: - z dokumentu (Word, ...) - z databáze apod. - z jinak zapsané strukturované informace
Děkuji za pozornost
