Web Michal Žůrek Jak se na něj dívám já.
Webový prohlížeč Internet Explorer Předinstalovaný ve Windows Nejbezpečnější Uživatelé jsou poznamenáni předchozími verzemi Google chrome Jednoduchý Rychlý Sledovaný googlem Mozilla Firefox Open Source Spousta doplňků Příliš rychlý vývoj, doplňky se nestíhají aktualizovat
Historie (cca. před 20 lety) Historie × současnost Historie (cca. před 20 lety) Nyní 1 jazyk = celý web HTML – Hyper Text Markup Language Min. 5 jazyků = celý web HTML – definice obsahu webu CSS – styly webu JavaScript – interaktivní web PHP – dynamický web SQL – dotazy do databáze
Webová revoluce HTML5, CSS3, EcmaScript 5 Co umožnila? Web bez doplňků (HTML5, CSS3) Webové aplikace (JS) Responzivní web, web se přizpůsobuje moderním zařízením (CSS3) Menší vytížení serveru (JS a AJAX) Vnořené jazyky (SVG a MathML) Nové vizuální prvky, nejčastěji formuláře (HTML5) Video a zvuk bez doplňků (HTML5) Optimalizace stylů – nové selektory (CSS3) Interaktivní styl – responzivní webdesign, animace, přechody a pseudo třída :target (CSS3)
HTML Jazyk definující strukturu webové stránky XML Klientská část Jazyk definující strukturu webové stránky XML Text přenášející se k uživateli Pravé kliknutí myší > zobrazit zdrojový kód <!DOCTYPE html> <html> <head> <title>Hello world</title> <meta charset="utf-8"/> </head> <body> <h1>Hello world</h1> </body> </html>
CSS Styluje HTML Definuje vzhled Layout (nastavení pozice a velikosti) Klientská část Styluje HTML Definuje vzhled Layout (nastavení pozice a velikosti) body { background-color: #0094ff; }
JavaScript = EcmaScript Klientská část = EcmaScript Umožňuje měnit obsah stránky bez aktualizace (F5) Veškeré vysoce interaktivní prvky jsou naprogramované v JavaScriptu Stojí nad ním nadstavby CoffeeScript TypeScript window.onload = function () { document.write("Hello world"); }
Server × klient Server Klient Zdrojový kód je skrytý Generuje obsah Pracuje s velkým množstvím dat a databázemi PHP a SQL Zdrojový kód je veřejný Zpracovává obsah Rychle reaguje na uživatelovy akce JavaScript a jeho nadstavby
PHP Jazyk běžící na serveru Serverová část Jazyk běžící na serveru Zdrojový kód není návštěvníkovi k dispozici Dynamický web Generuje HTML <?php echo("Hello world"); ?>
SQL Dotazy do databází Snaží se podobat co nejvíce běžné angličtině Serverová část Dotazy do databází Snaží se podobat co nejvíce běžné angličtině Několik databázových strojů MSSQL MySQL Oracle INSERT INTO "databaze" VALUES ('Hello', 'world');
Mrtvé webové technologie Webová revoluce zabíjí Flash Silverlight Pluginy
Aktuální trendy Web na jakémkoliv zařízení Hry bez doplňků Načítání obsahu bez načítání stránky
Jak celý web dnes funguje? Webova.stranka.cz Dotaz http://www.advancetec.co.uk/media/catalog/product/cache/1/image/1250x1250/b65b7106e6199ae52d7f08f5a5033ae0/v/i/viewsonic-va2231wa-led-hd-black-led-22-monitor-slim-bezel-1.jpg http://it-factory.cz/img/sprava_serveru1.jpg http://sweetclipart.com/multisite/sweetclipart/files/logo_children_or_autism_puzzle_pieces_1.png
Děkuji za pozornost Prezentaci si můžete stáhnout na misaz.moxo.cz/web Použité ukázky naleznete na misaz.moxo.cz/web