14. Jazyk HTML (vývoj, principy, funkce, kostra stránky). Jazyk XML, XHTML. Algoritmizace - cyklus for, while a do while, implementace v jazyce



Podobné dokumenty
Technologie pro tvorbu webových aplikací 1. díl (rozdělení, HTML, XHTML)

Inovace výuky prostřednictvím šablon pro SŠ

Vývoj Internetových Aplikací

Internet WEB stránky HTML, Hypertext MarkUp Language - nadtextový jazyk - Místo příkazů obsahuje tagy - značky

Webové stránky. 2. Úvod do jazyka HTML. Datum vytvoření: str ánk y. Vytvořil: Petr Lerch.

HTML XHTML JavaScript PHP ASP.Net Zajímavé odkazy

Základy WWW publikování

Mgr. Stěpan Stěpanov, 2013

HTML Hypertext Markup Language

WWW a HTML. Základní pojmy. Ivo Peterka

Uspořádání klient-server. Standardy pro Web

(X)HTML a CSS. VOŠ a SŠT Česká Třebová

Tvorba WWW stránek. Mojmír Volf

Tvorba webu. Úvod a základní principy. Martin Urza

APLIKACE XML PRO INTERNET

Škola: Gymnázium, Brno, Slovanské náměstí 7 III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN

HTML - Úvod. Zpracoval: Petr Lasák

Mgr. Vlastislav Kučera přednáška č. 1

Mgr. Vlastislav Kučera přednáška č. 1

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

Tvorba jednoduchých WWW stránek. VŠB - Technická univerzita Ostrava Katedra informatiky

Stránka se dá otevřít dvěma způsoby

24. XML. Aby se dokument XML vůbec zobrazil musí být well-formed (správně strukturovaný). To znamená, že splňuje formální požadavky specifikace XML.

Úvod do tvorby internetových aplikací

Úvod do aplikací internetu a přehled možností při tvorbě webu

MODERNÍ WEB SNADNO A RYCHLE

Jazyk XSL XPath XPath XML. Jazyk XSL - rychlá transformace dokumentů. PhDr. Milan Novák, Ph.D. KIN PF JU České Budějovice. 9.

Tvorba jednoduchých WWW stránek. VŠB - Technická univerzita Ostrava Katedra informatiky

Jazyky pro popis dat

Internetové publikování

Základy informatiky. 03, HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

13. Vytváření webových stránek

ZNAČKOVACÍ JAZYKY A JEJICH VYUŽÍVÁNÍ MARKUP LANGUAGE AND THEIR USE. Zdeněk Havlíček

Čtvrtek 11. dubna. Základy HTML. Obecná syntaxe HTML. Struktura HTML

Základy XML struktura dokumentu (včetně testových otázek)

Databázové aplikace pro internetové prostředí PHP úvod, základní princip, vkládání skriptu, komentáře, výpis na obrazovku

(X)HTML, CSS a jquery

Kartografická webová aplikace. Přednáška z předmětu Počítačová kartografie (KMA/POK) Otakar Čerba Západočeská univerzita

Úvod do informatiky 5)

Úvod do jazyka HTML (Hypertext Markup Language)

Co je HTML. 1. Párový tag má začátek a konec: 2. Nepárový tag nemá ukončovací značku:

1. Struktura stránky, zásady při psaní kódu, MVC pattern. Web pro kodéry (Petr Kosnar, ČVUT, FJFI, KFE, PINF 2008)

Maturitní otázka webové stránky (technologie tvorby webu) Co znamená pojem Web? Web, www stránky, celým názvem World Wide Web,

PHP PHP je skriptovací programovací jazyk dynamických internetových stránek PHP je nezávislý na platformě

Vyšší odborná škola a Střední škola,varnsdorf, příspěvková organizace. Šablona 5 VY 32 INOVACE

TNPW1 Cvičení aneta.bartuskova@uhk.cz

CZ.1.07/1.5.00/

Obsah prezentace. Co je to XML? Vlastnosti. Validita

Dnešní téma. Oblasti standardizace v ICT. Oblasti standardizace v ICT. Oblasti standardizace v ICT

Tvorba webových stránek

Dokumenty umístěné na počítačových serverech jsou adresovány pomocí URL (Uniform Resource Locator).

Základy informatiky. 03 HTML, tvorba webových stránek. Kačmařík/Szturcová/Děrgel/Rapant

Základy HTML. Autor: Palito

Tvorba webu v HTML. Redakční systém. CMS Joomla! Co je Joomla

Tvorba jednoduchých WWW stránek

VÝVOJ INTERNETOVÝCH APLIKACÍ - VIA

Syntaxe XML XML teorie a praxe značkovacích jazyků (4IZ238)

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

Euler - průvodce v češtině

1 Webový server, instalace PHP a MySQL 13

Inovace výuky prostřednictvím šablon pro SŠ

Značkovací jazyky a spol. HTML/XHTML XML JSON YAML Markdown, Texy!

22. Tvorba webových stránek

Možnosti využití XML v knihovnické praxi. Gabriela Krčmařová AKP 2001 Národní knihovna ČR Liberec,

Tvorba WWW stránek. přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování

PHP framework Nette. Kapitola Úvod. 1.2 Architektura Nette

SEZNAM VZDĚLÁVACÍCH MATERIÁLŮ - ANOTACE

Systém elektronického rádce v životních situacích portálu

Maturitní otázky z předmětu PROGRAMOVÁNÍ

Tvorba webových stránek

Úvod 1 ČÁST 1 HTML 1 Základy HTML a kaskádových stylů 5

Historie Internetu instalace prvního uzlu společností ARPA

Hlavička dokumentu. mezi <head> a </head> obsahuje informace vztažené k dokumentu metadata <title> - název stránky, povinná párová značka

Elektronické publikování. doc. RNDr. Petr Šaloun, Ph.D. katedra informatiky FEI VŠB TU Ostrava

NSWI096 - INTERNET. Úvod do HTML

Ing. Přemysl Brada, MSc., Ph.D. Ing. Martin Dostal. Katedra informatiky a výpočetní techniky, FAV, ZČU v Plzni

Internet 1 vývoj, html, css

DUM č. 11 v sadě. 36. Inf-12 Počítačové sítě

<link> - definuje vztah k jiným XHTML dokumentům, typicky

36 Elektronické knihy

Základy HTML. Obecná syntaxe HTML. Struktura HTML

(X)HTML-TAGY. VOŠ a SŠT Česká Třebová

Základy HTML. Obecná syntaxe HTML. Struktura HTML

Kurz je rozdělen do čtyř bloků, které je možné absolvovat i samostatně. Podmínkou pro vstup do kurzu je znalost problematiky kurzů předešlých.

Základy HTML (2. přednáška)

AUTOMATICKÉ ŘÍZENÍ S INTERNETOVOU KOMUNIKACÍ V PHP Automatic Control with Internet Communication in PHP

INOVACE PŘEDMĚTŮ ICT. MODUL 11: PROGRAMOVÁNÍ WEBOVÝCH APLIKLACÍ Metodika

Metody tvorby ontologií a sémantický web. Martin Malčík, Rostislav Miarka

JavaScript v jazyku HTML

Základy informatiky. HTML, tvorba WWW stránek. Daniela Szturcová Část převzata z přednášky P. Děrgela

Tvorba stránek v HTML ve Wordu

Název: VY_32_INOVACE_PG4116 SEO, standardy, sémantika kódu, přistupnost

Kaskádové styly základy grafiky

pracuje na principu Požavek/Odpověď (request/response) výhodou je jednoduchost a teoretická možnost přenášet objekty jakéhokoliv druhu

STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE

ČESKÁ TECHNICKÁ NORMA

WAP. Jirka Kosek. IZI228 tvorba webových stránek a aplikací. Poslední modifikace: $Date: 2004/09/30 09:02:59 $ Copyright Jiří Kosek

Registrační číslo projektu: Škola adresa:

Transkript:

4. Jazyk HTML (vývoj, principy, funkce, kostra stránky). Jazyk XML, XHTML. Algoritmizace - cyklus for, while a do while, implementace v jazyce PHP. HyperText Markup Language Z Wikipedie, otevřené encyklopedie Skočit na: Navigace, Hledání HyperText Markup Language, označovaný zkratkou HTML, je 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 dokumentů na Internetu. Jazyk je aplikací 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 989 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žívaly jazyky TeX, PostScript a také SGML. Berners-Lee si uvědomoval, že potřebují něco jednoduššího a v roce 990 byl tedy navržen jazyk HTML a protokol pro jeho přenos v počítačové síti HTTP (HyperText Transfer Protocol přenosový protokol hypertextu). Zároveň také Tim Berners-Lee napsal první webový prohlížeč, který nazval WorldWideWeb. V roce 99 CERN zprovoznil svůj web. Současně organizace NCSA (National Center for Supercomputer Applications) vybídla Marca Andreessena a Erica Binu k vytvoření prohlížeče Mosaic; ten vznikl v roce 993 ve verzích pro počítače IBM PC a Macintosh a měl obrovský úspěch. Byl to první prohlížeč s grafickým uživatelským rozhraním. Následoval rychlý rozvoj webu, takže bylo nutné pro HTML definovat standardy. Verze jazyka Verze 0.9 Verze 2.0 Byla vydána zhruba v roce 99. Nepodporuje grafický režim (verze, kterou vytvořil Tim Berners-Lee). Zachycuje stav jazyka v polovině roku 994. 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 a podporu grafiky.

Verze 3.2 Verze 4.0 Verze 4.0 Verze 5 Byla vydána 4. ledna 997 a zachycuje stav jazyka v roce 996. 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. Standard už vydalo 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. Byla vydána 8. prosince 997. Do specifikace jazyka přibyly 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. Byla vydána 24. prosince 999. Tato verze opravuje některé chyby verze předchozí. Podle původního předpokladu se mělo jednat o poslední verzi, po které by se přešlo na XHTML. 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.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 200 (odtud ji začnou vývojáři webových aplikací používat, finalní verze zbavená všech chyb se však odhaduje až na rok 2022). Popis jazyka HTML Koncepce Jazyk HTML je od verze 2.0 aplikací SGML. Je charakterizován množinou značek a jejich atributů definovaných pro danou verzi. 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 tvořená otevírací značkou, nějakým obsahem a odpovídající ukončovací značkou tvoří tzv. element (prvek) dokumentu. Například <strong> je otevírací značka pro zvýraznění textu a <strong>červená Karkulka</strong> je element obsahující zvýrazněný text. 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 (zvané tagy) jsou obvykle párové (v XHTML jsou párové všechny), přičemž koncové značka je shodná se značkou počáteční, jen má před názvem znak lomítko. Příklad pro označení odstavce: <p>text odstavce</p>

Některé značky jsou nepárové nemají žádný obsah a nepoužívají koncovou značku. Příklad pro vykreslení vodorovné čáry: <hr> Tagy mohou obsahovat atributy, které popisují 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">text odkazu</a> Jelikož je HTML aplikací SGML, existují i jiné, méně známé konstrukce pro tvoření elementů. Jedná se o tzv. zkrácené HTML zápisy: <element/obsah/ je totéž jako <element>obsah</element> <element>obsah</> je totéž jako <element>obsah</element> <el<el2>obsah je totéž jako <el><el2>obsah <ul><li>adam<>božena</ul> je totéž jako <ul><li>adam</li><li>božena</li></ul> Všechny tyto zápisy jsou sice podle normy validní a zcela ekvivalentní, ale žádný ze známých prohlížečů zkrácené verze nepodporuje, takže se nedoporučuje je používat. Pro každou verzi existuje definice pravidel DTD (Document Type Definition). Od verze 4.0 musí být odkaz na deklaraci DTD v dokumentu uveden pomocí klíčového slova DOCTYPE. DTD definuje pro určitou verzi elementy a atributy, které lze používat. 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 uveden 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.0, je uvedena direktivou <!DOCTYPE. Kořenový element element html (značky <html> a </html>) reprezentuje celý dokument. Kořenový element je povinný, ale otevírací a ukončovací značka samotná povinná není (pokud tyto značky nebudou v těle dokumentu uvedeny, prohlížeč si je sám doplní podle kontextu). Hlavička elementu obsahuje 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>. Element head je opět povinný, ale jeho otevírací a koncová značka povinná není, prohlížeč ji sám doplní podle kontextu. Tělo dokumentu obsahuje vlastní text dokumentu. Vymezuje se značkami <body> a </body>. Element body je povinný, ale jeho otevírací a koncová značka povinná není, prohlížeč ji sám doplní podle kontextu.

Příklad zdrojového kódu Příklad HTML dokumentu ve verzi 4.0: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/tr/html4/strict.dtd"> <html> <!-- toto je komentář --> <head> <title>titulek stránky</title> </head> <!-- tělo dokumentu --> <body> <h>nadpis stránky</h> <p>toto je tělo dokumentu</p> </body> </html> Druhy značek Značky lze z hlediska významu rozdělit na tři základní skupiny: Strukturální značky rozvrhují strukturu dokumentu, příkladem jsou odstavce (<p>), nadpisy (<h>, <h2>). Dodávají dokumentu formu. Popisné (sémantické) značky popisují povahu obsahu elementu, příkladem je 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>). Od tohoto druhu značek se postupně upouští, trendem je používání kaskádových stylů, které vzhled popisují odděleně od obsahu dokumentu. Mezi důvody pro neužívání těchto značek patří především to, že tyto značky jsou orientovány na prohlížení na obrazovce počítače, příliš se však nepočítá s používáním 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í nejčastěji monitoru počítače.

Extensible HyperText Markup Language XHTML (zkratka anglického extensible hypertext markup language rozšiřitelný hypertextový značkovací jazyk ) je značkovací jazyk pro tvorbu hypertextových dokumentů v prostředí WWW vyvinutý W3C. Původně se předpokládalo, že se stane nástupcem jazyka HTML, jehož vývoj byl verzí 4.0 ukončen. V roce 2007 však došlo k založení pracovní skupiny, která má za cíl vytvořit novou verzi HTML, která ponese označení HTML 5 a její XML variantu XHTML 5. Vedle toho paralelně pokračuje i vývoj XHTML 2.0. Cyklus for, while a do while Cykly se používají chceme-li opakovat určitou činnost, několikráte za sebou, opakovaně provádět stejnou proceduru. Postupně ověřovat data, nebo generovat informace. Cykly v jazyce PHP Do while Chceme zapsat čísla od od do 00. Je zbytečné zapsat,2,3... Poslouží nám jednoduchý skript: $c = ; do { echo($c. " "); $c++; } while($c<0); c je proměnná. Cyklus do {proces} while(podmínka) vždy vypíše hodnotu proměnné c. Zároveň k ní vždy přičte c++. Nakonec jsme příkazem while(podmínka) cyklus omezili, cyklus se bude provádět, pouze když je proměnná menší než 0. V momentě kdy není menší se skript přeruší. Stejným způsobem můžete vytvářet i jiné skripty, například pracovat s polem nebo databází. Projíždět postupně jednotlivé položky a vypisovat jejich obsah. While Příkaz while(podmínka) je možné použít samostatně. $c = ; while($c<0){ echo($c. " "); $c++; }

Výsledek je stejný, pouze pokud c přiřadíte hodnotu 0, příkaz do while vypíše 0, protože podmínka je definována až po procesu (skript nezná podmínku a tak napíše 0, teprve poté kontroluje podmínky). Příkaz while 0 nezapíše, protože podmínka předchází proces. Příkaz do while jednou provede proces, když už podmínka neplatí. Na tento rozdíl je třeba si vždy dát dobrý pozor a ověřit skript, když se dostane k podmínce. For Posledním příkazem je příkaz for. Syntaxe: for(inicializace proměnné; podmínka; operace) {skript}. for($c=; $c<0; $c++){ echo($c." "); } Příkaz for se užívá především, když víme kolikrát chceme proces uskutečnit. Počet je konečný. U do while a while ověřujeme proměnnou, která se v procesu mění. U for zavádíme přímo proměnnou určenou k tomu, aby se určil počet procesů.