Internetové publikování

Prezentace na téma: "Internetové publikování"— Transkript prezentace:

1 Internetové publikování
Doc. Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222, 4167 (sekretariát ústavu 111)

2 Osnova předmětu http://www.vscht.cz/informatika-chemie
Úvod - principy fungování webových serverů a browserů HTML - základní struktura stránky HTML - základní konstrukce, přenos dat pomocí FTP na server HTML - formuláře CSS CSS vs. HTML konstrukce, pro a proti JavaScript - základy Grafická data a multimédia - formáty (GIF, PNG, JPEG), vhodnost použití Usability - domovská stránka Usability - navigace, vyhledávání, JavaScript Usability - návrh stránek respektujících i potřeby handikepovaných uživatelů (zrakově či motoricky postižení, starší osoby) Anonymita uživatelů Internetu, problematika ochrany osobních dat, zneužívání dat, spam Právní a morální aspekty - citování, odkazování, odpovědnost za zveřejněná data Prezentace vytvořených prací

3 Kontrola studia Projekt – WWW stránky na vlastní téma
Hodnocení zadaných WWW stránek Volitelná forma Písemně v rozsahu jednostránkové eseje Ústní prezentace formou přednášky na poslední hodině cvičení v semestru Zkouškový test ověřující znalosti získané během semestru

4 Zápočet a zkouška Zápočet Zkouška
Bude zapsán na základě předloženého projektu splňujícího všechny exaktně ověřitelné požadavky (viz dále) Zkouška Projekt, hodnocení i test budou bodovány samostatně Celkový výsledek bude dán váženým součtem 0,4*Projekt + 0,1*Hodnocení + 0,5*Test Všechny složky musí mít klasifikaci E a lepší Klasifikace A ... > 90 % B ... > 80 % C ... > 70 % D ... > 60 % E ... > 50 %

5 Projekt Povinné požadavky (exaktně ověřitelné)
Strukturované dokumenty, musí zde být nějaký skutečný obsah, část z něj musí být textová Alespoň 3 dokumenty XHTML nebo HTML 4.01 dokumenty. Dokumenty musí být validní ( Použijte externí kaskádové styly (CSS). Obrázky umístěte do zvláštního adresáře. Projekt umístěn na Další požadavky, které jsou také povinné, ale nelze je zcela exaktně definovat  Minimalizujte formátování pomocí atributů XHTML, snažte se co nejvíce formátování přesunout do CSS. Snažte se o přístupnou prezentaci Pokuste se o grafický návrh odpovídající cílové skupině Vaší prezentace

6 Hodnocení dokumentu Technické zpracování
Kvalita navigace - umístění, srozumitelnost, logika, ... Obsah, informační hodnota Srozumitelnost výkladu Hypertextové odkazy Bloky textu Strukturovanost - je vytvořena hierarchie informací (kapitoly, seznamy, tabulky)? Jazyková stránka Pravopis Sloh Objektivita Grafika, návrh: Velikost fontu Barevné kontrasty, celková čitelnost Členění a rozvržení stránek Vliv velikosti monitoru, rychlosti připojení (= čas stahování) Umělecký dojem Konzistentnost - slovní výrazy, velká/malá písmena na začátcích hesel, atd.

7 Informační zdroje Studijní informační systém Materiály ke cvičením
Materiály ke cvičením Literatura Jiří Kosek: HTML -- tvorba dokonalých WWW stránek -- podrobný průvodce. Grada Publishing 1998. ... nebo jiná, na trhu je bohatá nabídka Jakob Nielsen: Web design, SoftPress 2002. WWW standardy Internet

8 Historie WWW 50. léta – Douglas Engelbert – provázané dokumenty
1980 – Ted Nelson – projekt „Xanadu“ 1989 – CERN Ženeva - Tim Berners-Lee Program pro tvorbu hypertextových dokumentů Název „World-Wide Web“ infrastruktura internetu technologie HTML, HTTP, URL

9 Webový prohlížeč

10 Základ fungování služby WWW
Přenos souborů, protokol HTTP jednoduchý bezstavový protokol Globální adresace souborů – URL jedno URL = jeden dokument Hypertext, jazyk HTML

11 World-Wide Web Prohlížeč (browser) Obsah (dokumenty, data) WWW server
HTTP požadavek - URL Klient HTTP odpověď - dokument Prohlížeč (browser) Obsluha protokolu HTTP Zobrazování obsahu Obsah (dokumenty, data) Statický Dynamický

12 Uniform Resource Identifier/Locator
úplná definice URI je mnohem komplexnější (viz např. Wikipedia) JAK? KDE? CO? /seznam/SeznamVSCHT/index.html Shéma komunikace Zdroj, server Umístění v rámci zdroje

13 Schéma 1/2 file:/// mailto: http:// https:// ftp://
HyperText Transfer protocol ftp:// ftp://ftpin.vscht.cz/pub/ File Transfer Protocol file:/// file:///c|/windows/win.ini Lokální soubor mailto:

14 Schéma 2/2 Schéma není zcela formální
ftp://ftpin.vscht.cz/ Prohlížeče „inteligentně“ doplňují schéma chybí-li

15 Server http://147.33.15.10/ IP adresa Doménové jméno
Řád domény

16 Umístění (cesta) Odpovídá skutečné nebo virtuální cestě na serverovém systému Velikost písmen hraje roli

17 Obsah Statický Dynamický Souborový systém Trvale existující dokumenty
Reprezentace obecných informací Dynamický Databáze Dynamicky generované dokumenty Zobrazení informací specifických pro uživatele, dobu, apod.

18 Prohlížeč Obsluhuje přenos a interpretuje obsah Hlavní prohlížeče
Microsoft Internet Explorer Firefox Opera Safari …

19 WWW stránka WWW stránka – dokument (soubor) s informacemi a pokyny pro jejich zobrazení Určena pro WWW prohlížeč – interpret WWW dokumentu Standardizace W3C – World Wide Web Consortium

20 Co obsahuje WWW stránka ?
HyperText Markup Language – HTML Text Značky (tagy) Pokyny pro interpretaci dokumentu Informace o struktuře dokumentu Odkazy na další (binární) data <html> <head> <title>Title of page</title> </head> <body> This is my first homepage. <b>This text is bold</b> </body> </html>

21 Vývoj HTML 2.0 – první verze s formální specifikací
Značkovací jazyk založený na SGML Standard Generalized Markup Language ISO 8879:1986 2.0 – první verze s formální specifikací 3.0 – neimplementovaný návrh Příliš složitá specifikace 3.2 – standard na základě podmnožiny nestandardních řešení různých výrobců 4.0, 4.01 – poslední verze Kaskádové styly CSS

22 Problémy s WWW současnosti
Prolínání obsahu a formy v HTML Problémy se strukturou dokumentu Problematické vyhledávání

23 XHTML eXtensible HyperText Markup Language Upravená verze HTML 4.01
Vyhovuje standardu XML Nevyžaduje podporu XML na straně prohlížeče Striktnější

24 XML eXtensible Markup Language SGML „light“
Orientace na informační hodnotu dokumentu Možnost definovat další jazyky založené na XML Striktnější syntaxe

25 Tvorba/Editace stránek
Textové editory Notepad PSPad HTML editory HomeSite WYSIWYG editory FrontPage MS Word

26 FrontPage

27 Notepad

28 HomeSite

29 Přehledný HTML kód

30 „Méně“ přehledný HTML kód

31 Porovnání editorů WYSIWYG Zpravidla snadná a komfortní obsluha
„Dokonalá“ kontrola nad vzhledem, ale slabší platformová nezávislost Problémy s dodržováním standardů Netransparentnost tvorby dokumentu Závislost na použití konkrétního software Omezené využití pro publikační systémy

32 Porovnání editorů Textové a HTML editory
Je třeba znát alespoň částečně standardy Dokonalá kontrola nad kódem Tvorba dokumentů se může zdát pracnější, ale při důsledném oddělení obsahu a formy a u větších webu je to spíše naopak Specializované HTML editory nebývají zdarma