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

Přednáška TNPW1 – Martin Adámek Kontakt Ing. Martin Adámek www.adamek.cz/fim e-mail: martin.adamek na uhk.cz dveře č. 344 (naproti J22 a J23) konzultace po dohodě nebo kratší mezi výukou WebCT (Olivu) pro TNPW1 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 TNPW1 – Martin Adámek

TNPW1 – 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í (TNPW2, Mgr. Vacek) databáze (DBS1 a 2) Přednáška TNPW1 – Martin Adámek

TNPW1 – 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á. TNPW1 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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek 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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek 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 TNPW1 – Martin Adámek

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> výborně <89;70> velmi dobře <69;50> dobře Přednáška TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek 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 AI3 Letní semestr: obor IM3, IM5 Patřičné obory mají přednost, zbylé obory mají možnost dle kapacity Přednáška TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek Kapacita cvičení TNPW1 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 TNPW1 – Martin Adámek

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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek 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 TNPW1 – Martin Adámek

(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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek 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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek (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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek 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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek (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 TNPW1 – Martin Adámek

Přednáška TNPW1 – Martin Adámek (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čů. W3C 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 TNPW1 – Martin Adámek

Aktuální standardy HTML ! Různé normy pro konkrétní syntaxi jazyka HTML Definuje W3C (WWW Consorcium) – www.w3.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 TNPW1 – Martin Adámek

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 TNPW1 – Martin Adámek

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

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 TNPW1 – Martin Adámek

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:tux007@obchod.papirnictvi.cz/zbozi/ceniky_zip/propisky.zip Doménové jméno = symbolický název v systému DNS Přednáška TNPW1 – Martin Adámek

Složení URL (Uniform Resource Locator) protokol http, https, ftp ftp, resp. sftp užíván mj. pro upload obsahu webu na server SW: web. prohlížeč, Total Commander, WinSCP 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 TNPW1 – Martin Adámek

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

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 TNPW1 – Martin Adámek

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