Technologie pro publikování na webu 1 Ing. Jiří Štěpánek.

Prezentace na téma: "Technologie pro publikování na webu 1 Ing. Jiří Štěpánek."— Transkript prezentace:

1 Technologie pro publikování na webu 1 Ing. Jiří Štěpánek

2  (X)HTML sám o sobě je mrtvým jazykem  Nedostatek prvků pro tvorbu moderních webů  Sémantika webu  Absence interaktivních prvků, validačních mechanismů a mnoha dalšího v (X)HTML  Absence pokročilé funkcionality v (X)HTML Ing. Jiří Štěpánek

3  Strukturování (sémantika)  Multimediální obsah, bitmapa  Formulářové pole  Web Storage  Web Sockets  Nové události v rámci dokumentu (JS)  A další… Ing. Jiří Štěpánek

4  Současné HTML postrádá sémantické prvky pro definování oblastí stránky  Oblasti stránky jsou standardně tvořeny elementy  HTML 5 nabízí nové strukturovací elementy, které umožní snadnou identifikaci účelu konkrétní oblasti Ing. Jiří Štěpánek

5

6

7 ............... Ing. Jiří Štěpánek

8  Současné HTML nemá podporu pro multimediální obsah  Používány jsou klientské multimediální aplikace (Flash, SilverLight, Java Appety…)  Multimediální aplikace třetích stran vyžadují instalaci prostředí pro spouštění (runtime) např. Adobe flash player  V HTML5 – elementy audio a video Ing. Jiří Štěpánek

9  Objem videa a audia v posledních letech markantně vzrostl  Pro přehrávání multimediálního obsahu postačuje základní rozhraní  V současné době existuje celá řada placených i volně dostupných přehrávačů (flash, SL)  Snaha tvůrců HTML5 – poskytnout vývojářům jednoduché rozhraní pro přehrávání multimediálního obsahu Ing. Jiří Štěpánek

10 Stáhnout film var video = document.getElementById("video"); Přehrát Pozastavit Vytvořeno i rozsáhlé API (javascript) pro ovládání multimediálních prvků: Ing. Jiří Štěpánek

11  Poskytuje prostor pro kreslení grafických primitiv  Přímo v HTML5 dokumentu lze tedy generovat obrázek (např. graf) např. na základě reakcí uživatele na ovládací prvky  V současnosti je toto možné udělat pouze přes klientskou multimediální aplikaci či skript na straně serveru. Ing. Jiří Štěpánek

12  Rozšíření parametrů type elementu input  datetime – reprezentuje datum a čas  date – datum  month – měsíc  week – týden  time – čas  number - číslo  range – rozsah číselných hodnot, které se nastaví parametry min a max  email – pole pro zadání e-mailové adresy včetně ověření, zda je formát správný  url – URL adresa  search – vyhledávací políčko  color – pole s výběrem barvy a převedením do jejího textového formátu Ing. Jiří Štěpánek

13 Ing. Jiří Štěpánek

14  Je třeba mít na paměti, že validace je uskutečněna pouze na straně klienta  Nutnost validovat vstupní data na straně serveru (webová aplikace) tím rozhodně neodpadá  Lze snadno změnit typ vstupního pole a data odeslat Ing. Jiří Štěpánek

15  Umožňuje uložit webové stránce data  LocalStorage ▪ Umožňuje uložit data, která jsou viditelná pouze v rámci jedné domény, jsou trvale uložena i v momentě, kdy je okno prohlížeče zavřeno. Kapacita v řádu jednotek – desítek MB  SessionStorage ▪ Viditelnost v rámci stránky, menší kapacita, data jsou po zavření prohlížeče odstraněna Ing. Jiří Štěpánek

16  Technologie obousměrné komunikace (webové stránky a webové aplikace) v reálném čase.  Není nutno se intervalově dotazovat, web sockets dovolují posílat zprávy i ze serveru směrem ke klientovi  V současném HTML nemožné Ing. Jiří Štěpánek

17

18  V současném HTML je možné pomocí javascriptu reagovat na události, které na stránce nastaly, například načtení stránky, kliknutí na nějaký element  HTML5 rozšiřuje události současné HTML o mnoho dalších Ing. Jiří Štěpánek

19

20  Výhody použití HTML  Zpětná kompatibilita se existujícími prohlížeči.  Autoři jsou již s touto syntaxí dobře obeznámeni.  Shovívavá a tolerantní syntaxe znamená, že se nikde nebude objevovat uživatelsky nepříjemná "žlutá obrazovka smrti" (informující uživatele o chybě v parsování XML dokumentu), pokud náhodou dojde k chybě.  Výhodná zkrácená syntaxe, takže autoři mohou vynechat některé značky a hodnoty atributů.  Výhody použití XHTML  Striktní XML syntaxe povzbuzuje autory ke tvorbě správně strukturovaného (well-formed) kódu, který mohou někteří shledat snáze udržovatelným.  Přímá integrace s dalšími derivacemi XML, jako je SVG nebo MathML.  Umožňuje využití mechanismů pro zpracování XML, které někteří autoři používají jako součást svých editačních či publikačních procesů. Ing. Jiří Štěpánek

21  Otázky?  Příště – časté chyby v projektech, webové aplikace  Zdroje:  http://interval.cz/clanky/seznameni-s-html-5/ http://interval.cz/clanky/seznameni-s-html-5/  http://cs.wikipedia.org/wiki/HTML5 http://cs.wikipedia.org/wiki/HTML5 Ing. Jiří Štěpánek