Jak fungují webové stránky Úvod do HTML (1). Projekt: CZ.1.07/1.5.00/34.0745 OAJL - inovace výuky Příjemce: Obchodní akademie, odborná škola a praktická.

Prezentace na téma: "Jak fungují webové stránky Úvod do HTML (1). Projekt: CZ.1.07/1.5.00/34.0745 OAJL - inovace výuky Příjemce: Obchodní akademie, odborná škola a praktická."— Transkript prezentace:

1 Jak fungují webové stránky Úvod do HTML (1)

2 Projekt: CZ.1.07/1.5.00/34.0745 OAJL - inovace výuky Příjemce: Obchodní akademie, odborná škola a praktická škola pro tělesně postižené, Janské Lázně, Obchodní 282 Tento projekt je financován Evropskou unií – Evropským sociálním fondem a státním rozpočtem ČR. Autor:Mgr. Josef Kulhavý Předmět:Informační technologie

3 Obsah Co je WWW1 Internetová stránka2 HTTP protokol3 Skládání webové stránky4 5 6 Internetová stránka7 HTML8 Skriptovací jazyky9 Příklady10

4 Word Wide Web – „celosvětová pavučina“ Jedna ze služeb internetu Soustava propojených hypertextových dokumentů Pracuje s protokolem HTTP – HyperText Transport Protocol Využívá jazyk HTML – HyperText Markup Language (Hypertextový značkovací jazyk) Vznik: 1989 Co je WWW 1

5 http://www.oajl.cz/kviz/test.php?otazka=1&uzivatel=305 http://označení protokolu www.oajl.czdoména kvizsložka na serveru test.phpdokument na serveru otazka=1první parametr uzivatel=305druhý parametr Internetová adresa 2

6 Způsob, jakým internetový prohlížeč získá ze serveru internetovou stránku 1)Uživatel napíše adresu do internetového prohlížeče 2)Internetový prohlížeč zjistí z domény IP adresu (za pomoci DNS serveru) 3)Internetový prohlížeč kontaktuje internetový server na zjištěné IP adrese 4)Internetový server sestaví webovou stránku 5)Internetový server odešle HTML kód stránky zpět prohlížeči 6)Internetový prohlížeč zobrazí webovou stránku 7)V případě, že je to nutné, internetový prohlížeč požádá o zaslání dalších částí stránky (obrázky, styly, javascript) HTTP protokol 3

7 Internetový prohlížeč načte HTML kód Skládání webové stránky 4

8 5 Po načtení tzv. „kaskádových stylů“ dostane stránka svůj vzhled

9 Stránka bude úplná tehdy, až se stáhnou a zobrazí obrázky a případný další obsah Skládání webové stránky 6

10 Internetová stránka má dvě hlavní části: HEAD (hlava) – Informace o názvu stránky – Informace důležité pro vyhledávače – Informace o autorovi stránky – Odkazy na další připojené dokumenty (styly, javascript) BODY (tělo) – Viditelný text – HTML značky (instrukce pro zpracování textů) – Odkazy na další připojení dokumenty (obrázky) Internetová stránka 7

11 HyperText markup language (Hypertextový značkovací jazyk) „Programovací“ jazyk, kterým se tvoří webové stránky Obsahuje vlastní text, i instrukce pro jeho zpracování HTML dokument je obyčejný textový soubor Lze jej editovat například v Poznámkovém bloku Dnes se používají nejčastěji verze: – HTML 4.0 – HTML 5 – XHTML 2.0 HTML 8

12 HTML kód umožňuje tvořit tzv. „statické stránky“ – tj. takové, které zůstávají stále stejné Existují proto skriptovací jazyky, které mohou stránky neustále upravovat (například na základě dat z databáze) Nejvýznamnější skriptovací jazyky: – PHP –.NET – Java Skriptovací jazyky 9

13 Příklady HTML kódPHP kód 10

14 http://www.youthapostolate.com/wp-content/uploads/2009/12/www- internet.jpg http://pixabay.com/static/uploads/photo/2012/04/11/16/48/outline- 28866_640.png http://tammyhartdesigns.com/wp- content/uploads/2010/10/iStock_000003045800XSmall.jpg http://lincgeek.org/blog/wp-content/uploads/2010/10/php.png http://cache.lifehacker.com/assets/images/17/2011/04/dot_net_splash.jpg http://www.iclarified.com/images/news/26672/102317/102317-1280.jpg Použité zdroje