TNPW 1 Technologie pro publikovn na webu Pednka

TNPW 1 Technologie pro publikování na webu Přednáška č. 1 • Organizační úvod • Základní pojmy Ing. Martin Přednáška TNPW 1 – Martin Adámek Katedra informačních technologií FIM UHK

Kontakt Ing. Martin Adámek – www. adamek. cz/fim – e-mail: martin. adamek na uhk. cz – dveře č. 344 (naproti J 22 a J 23) konzultace po dohodě nebo kratší mezi výukou Web. CT (Olivu) pro TNPW 1 nepoužíváme Facebook: „Martin Adámek – výuka“ Některá cvičení a přednášky Ing. Jiří Štěpánek Některá cvičení Mgr. Tomáš Rychetský Přednáška TNPW 1 – Martin Adámek 2

TNPW 1 – smysl a náplň předmětu technologie vnitřek webu (kód), ne atraktivita vnějšího vzhledu – laik obvykle neocení vytvoření kvalitního webu vyžaduje zvládnout – – – – technologii (řešíme) přehlednost, použitelnost, ef. webdesign (řešíme velmi okrajově) přístupnost (řešíme velmi okrajově) grafiku zajímavý obsah text bez pravopisných chyb (učivo SŠ, část hodnocení projektu) a další pro dynamický web navíc: jeho naprogramování (TNPW 2, Mgr. Vacek) databáze (DBS 1 a 2) Přednáška TNPW 1 – Martin Adámek 3

TNPW 1 – smysl a náplň předmětu TNPW jen jedna část z mnoha => pro kompletní schopnost tvorby webu nutno přidat další znalosti Řešíme to pod kapotou, ne tvar karoserie. Řešíme funkci, ne estetiku. Pěkná grafika v projektu sice nevadí, ale body nepřidá. TNPW 1 nepodceňujte ! – Zkušenosti s tvorbou webu WYSIWYG (např. ve Frontpage) se hodí cca. při prvních dvou cvičeních, pak téměř ne. Přednáška TNPW 1 – Martin Adámek 4

Organizace předmětu přednášky – teorie – účast nepovinná, ale velmi doporučená (aby bylo co procvičovat) cvičení – procvičení, příp. podrobnosti k teorii – povinná – prezenční úkoly přímo ve cvičení => body ke zkoušce Přednáška TNPW 1 – Martin Adámek 5

Organizace předmětu semestrální projekt (webová prezentace) – zadání koncem semestru – předběžná podoba podrobného zadání: na webu v XLS tabulce s výsledky ze cvičení – odevzdává se cvičícímu do konce semestru – za projekt body a zápočet – vyvarujte se pokusů o odevzdání cizího projektu ! na závěr zkouška – body z teoretického testu ve zkouškovém období (hodnotí se odborné znalosti a schopnosti, nikoliv oděv) – součet bodů ze cvičení, projektu a zkoušky => známka Přednáška TNPW 1 – Martin Adámek 6

Bodové hodnocení předmětu semestrální projekt: 40 bodů (max. 41) cvičení za celý semestr: 14 bodů zkouška: 46 bodů Hodnocení <101; 90> <89; 70> výborně velmi dobře <69; 50> dobře Přednáška TNPW 1 – Martin Adámek 7

Obory a semestry letní i zimní semestr pro snížení dramatičnosti zápisu na cvičení rozděleno podle oborů dodržení doporučeného studijního plánu není vyžadováno při nedostatku místa pro ty, kdo teď TNPW mít mají, bude vyškrtnut potřebný počet těch, kdo ho teď mít nemají Zimní semestr: obor AI 3 Letní semestr: obor IM 3, IM 5 Patřičné obory mají přednost, zbylé obory mají možnost dle kapacity Přednáška TNPW 1 – Martin Adámek 8

Kapacita cvičení – TNPW 1 se učí oba semestry – kdo je oficiálně zapsán v Událostech ISITu, má přednostní nárok na účast na cvičení – když se vejdete, můžete mezi mými dvěma cvičeními libovolně přebíhat a fluktuovat Přednáška TNPW 1 – Martin Adámek 9

Zjednodušené absolvování možnost do 3. cvičení (2 týdny) odevzdat vyhovující projekt – při neúspěchu normální účast na cvičení a normální průběh studia předmětu – při úspěchu (min. 30 bodů za projekt) není nutno chodit na cvičení, za ně se přičte 8 bodů zkouška s ostatními za stejných podmínek bude se řešit na cvičení Přednáška TNPW 1 – Martin Adámek 10

Zdroje informací přednášky (ideálně s osobní účastí) cvičení další tipy, odkazy na další vhodné zdroje: – www. adamek. cz/fim/tvorba-webu – projděte si alespoň stránku „Tipy a rady“ řešení konkrétních problémů: Google Přednáška TNPW 1 – Martin Adámek 11

(Doplňková literatura) Kosek J. , Tvorba dokonalých HTML stránek Kučera M. , HTML – kouzla na webu Musciano Ch. , Kennedy B. , HTML a XHTML – kompletní průvodce Naik D. C. , Internet standards and protocols Prokop M. , CSS - kaskádové styly pro webdesignéry Přednáška TNPW 1 – Martin Adámek 12

Prostředí WWW World Wide Web – nejznámější, nejrozšířenější služba internetu Celosvětová dostupnost stránek Nezávislost na platformě (PC + Windows, Apple + Mac OS, Unix s nadstavbou X-Window, smartphony, MDA) Internet nemá „majitele“ Aplikuje se legislativa jednotlivých zemí šance vzdělávat se, získávat a publikovat informace, pracovat na dálku, bavit se, páchat zločiny, … Přednáška TNPW 1 – Martin Adámek 13

(Pravěk WWW) Skupina vědců z Evropského centra pro jaderný výzkum navrhla jazyk pro sdílení elektronických dokumentů přes Internet HTML = Hypertext Mark-up Language – sjednocení obrázků, zvuku a textu – díky WWW umožněno hypertextové propojení První webový prohlížeč: MOSAIC – vytvořen v Národním centru pro superpočítačové aplikace na universitě v Illinois – měl fce pro přístup k službám FTP a Gopher Přednáška TNPW 1 – Martin Adámek 14

WWW - přítomnost Internet má své standardy (RFC, Request For Comment) Základem stále HTML – Hypertext Mark-up Language Struktura hypertextu stojí na URL adresách a odkazech Hlavním komunikačním protokolem je HTTP Odlišujte dva pojmy: webová prezentace (web, webové stránky, web site) – celý web jedné firmy, celý osobní web jednoho člověka, portál, server; obvykle obsah jedné domény – skládá se z více stránek webová stránka (web page) – jeden konkrétní html soubor s konkrétní URL adresou Přednáška TNPW 1 – Martin Adámek 15

(HTML – vývoj jazyka) HTML 0. 9 - Tim Berners Lee (1991) Logické členění textu, úrovně, odkazy, obrázky HTML 2. 0 Vytvořen Level 1 a Level 2 (RFC 1866) Podpora formulářů HTML 3. 0 – vytvořena DTD (Document Type Definition) v univerzálním značkovacím jazyce SGML Standard vytvořen z rozšíření jazyka HTML+ (rok 1995) Podpora tabulek a matematických vzorců Kompletní podpora pouze u experiment. prohlížeče ARENA Přednáška TNPW 1 – Martin Adámek 16

(HTML – vývoj jazyka) HTML 3. 2 (rok 1996) Verze 3. 0 byla mohutným skokem, ale bez potřebné podpory ze strany prohlížečů. W 3 C rozhodlo o vlastnostech z verze 3. 0, kterými se rozšíří verze 2. 0 Vzniká nové „oficiální HTML 3. 0“ (kódové jméno Wilbur) s konečným označením HTML 3. 2 Podpora tabulek, Java apletů, lepší kontrola formátování HTML 4. 0 (rok 1997) rozšíření HTML 3. 2 s kódovým označením Cougar Podpora frames, skriptů, vkládaných objektů, vícejazyčných dokumentů Přednáška TNPW 1 – Martin Adámek 17

Aktuální standardy HTML ! Různé normy pro konkrétní syntaxi jazyka HTML Definuje W 3 C (WWW Consorcium) – www. w 3. org Document Type Declaration, doctype, DTD Běžně se používá HTML 4, 01 Zveřejněn koncept HTML 5 – umožňuje přímé vložení multimediálního obsahu Běžně se používá XHTML 1, 0 a 1, 1 Zastaven vývoj XHTML 2 Součástí konceptu HTML 5 je i definice XHTML 5 Přednáška TNPW 1 – Martin Adámek 18

Aktuální standardy HTML ! HTML vs. XHTML – XHTML je přísnější – kód XHTML je čistší, lépe odděluje grafiku od obsahu – XHTML = HTML respektující syntaxi XML – XHTML = Extensible Hypertext Markup Language – elementy v HTML jsou velkými písmeny, v XHTML malými Přednáška TNPW 1 – Martin Adámek 19

Aktuální standardy HTML ! Podle přísnosti (čistoty kódu) – od nejméně přísného: 1. HTML 4, 01 2. XHTML 1, 0 Transitional (Frameset) – „pro přechod“ obsahuje i staré nedoporučované elementy 3. XHTML 1, 0 Strict – jen elementy, které nejsou v HTML 4, 0 označeny jako nedoporučené – např. nepovoluje rámy (framy) 4. XHTML 1, 1 – nepovoluje a name (skok na id), vyžaduje lepší záhlaví tabulek 5. XHTML 2 V TNPW 1 vyžadováno XHTML 1, 0 Strict, možné je použít i přísnější XHTML 1, 1 Přednáška TNPW 1 – Martin Adámek 20

URL – Uniform Resource Locator jednotný způsob označování objektů (WWW stránek, souborů v FTP archivech, mailových adres, …) na Internetu – URL odkazy: řešení odkazů na jednotlivé WWW stránky a další objekty v rámci hypertextového dokumentu Příklad URL odkazu: http: //www. uhk. cz/heslo. asp – URL odkaz zahrnuje informace o: WWW serveru cílovém adresáři jménu a příponě cílového souboru Přednáška TNPW 1 – Martin Adámek 21

URL – Uniform Resource Locator Schéma URL odkazu <protocol>: //<user>: <password>@<host>: <port>/<path> <user> … uživatelské jméno (neanonymní FTP přihlášení) <host> … doménové jméno cíle nebo jeho IP adresa <port> … číslo IP portu (př: http: //mail. mujserver. cz: 8383) (např. u průmyslových kamer) <path> … cesta k cílovému souboru v rámci WWW serveru ftp: //obchodnik: tux 007@obchod. papirnictvi. cz/zbozi/ce niky_zip/propisky. zip Doménové jméno = symbolický název v systému DNS Přednáška TNPW 1 – Martin Adámek 22

Složení URL protokol (Uniform Resource Locator) http, https, ftp – ftp, resp. sftp užíván mj. pro upload obsahu webu na server SW: web. prohlížeč, Total Commander, Win. SCP doménové jméno – subdoména www, posta, isit – doména uhk – topdoména (topleveldoména, TLD) národní (cz) x generická (com) cesta jako v souborovém systému na HDD (pevném disku), jen „/“, ne „“ struktura souborů webu na serveru = struktura souborů webu na HDD – adresář – konkrétní soubor, vč. přípony (htm, html, php, cgi, asp, . . . ) Přednáška TNPW 1 – Martin Adámek 23

Anketa – Sociální sítě (nesouvisí s TNPW) Používáte Facebook? 1. 2. 3. 4. 5. 6. několikrát denně 1 x denně několikrát týdně 1 x týdně méně často přestal(a), ale nesmazal(a) účet 7. smazal(a) účet 8. nezačal(a) Přináší vám někdy něco užitečného, např. smysluplné informace, tedy nikoliv jen zábavu? 1. 2. 3. 4. 5. vůbec (nic užitečného) výjimečně občas často téměř výhradně (užitečné informace) Přednáška TNPW 1 – Martin Adámek 24

Anketa – Sociální sítě (nesouvisí s TNPW) Používáte jiné sociální sítě? – ne – ano + jaké? Máte zájem o využívání FB k předávání doplňkových informací souvisejících s výukou? – resp. odkazy na zajímavosti, bez kterých se dá přežít Doplňující informace a aktuality k TNPW – Krajta – patrně bude založena FB fan page Přednáška TNPW 1 – Martin Adámek 25

Příští přednáška Architektura internetu, DNS servery (X)HTML editory Přednáška TNPW 1 – Martin Adámek 26