Kurz			Cena	Množstvo

Kurzy zdarma: Zručnosti pre trh práce

Detail kurzu

Tvorba, programovanie webstránok III. - expert HTML a CSS, pokročilé selektory, médiá a formuláre

IT LEARNING SLOVAKIA, s.r.o.

Popis kurzu

Viete už spraviť dobre vyzerajúcu stránku, ale stále nie ste spokojní? Jazyky HTML a CSS sa konštantne vyvíjajú a niekedy je ťažké držať krok s vývojom. Máte dojem, že Vaša stránka ešte stále nevyzerá ako moderná stránka dnešnej doby? Chcete vedieť ako vložiť do vašej stránky to “pozlátko”, ktoré ju spraví výnimočnou? Na tomto kurze dvíhame latku a hovoríme o HTML značkách a CSS vlastnostiach, ktoré dokážu zmeniť Vašu stránku na stránku hodnú 21. storočia. Na tomto kurze si ukážeme si tipy a triky na štýlovanie tabuliek a zoznamov. Skrášlime si našu stránku “pozlátkom” - vytvoríme efektnú navigáciu v riadku, ktorá sa rozklikáva a použijeme ikonky pre vylepšený grafický dojem. Dôležitou časťou profesionálnych stránok sú formuláre a preto sa budeme venovať tomu ako fungujú, čo je to tá ich “prístupnosť” a čo je validácia a ako ju dosiahnuť pomocou čistého HTML. Nie posledná vec, ktorú sa naučíme sú dynamické prechody a animácie - efekty, ktoré našu stránku oživia pohybom a zmenou. A pri tom všetkom spomenieme všetky druhy CSS selektorov a atribútov. Na kurze sa očakáva, že máte znalosť jazyka HTML na úrovni, že Vám nerobí problém čítať HTML kód ľubovoľnej stránky. Takisto sa očakáva znalosť CSS na mierne pokročilej úrovni - viete formátovať text a obrázky v pozadí, poznáte CSS Box model a vlastnosti float, display a position Vám nie sú neznáme.

Obsah kurzu

=== Čo je to HTML5 - Rozdiely oproti HTML4.01, xHTML, DHTML ... - Nezmyslel s menom xHTML a zlé návyky - HTML obsah, forma a grafika - Zásuvné moduly - Prístupnosť - Čo sa môže v štandarde zmeniť - Budúcnosť webových stránok alebo aplikácií - Validácia kódu - Kontrola kódu – dostupné nástroje v prehliadači - Prosím zoznámte sa - Definícia - Znaková sada - Nové elementy - Odstránené elementy - … Alebo HTML dinosauri - Nové elementy a selektory - Správna konštrukcia web stánky - Kontajner webu - Header, footer, section, article, aside a nav - Selektory - Podpora prehliadačov - Príklady - Kreslíme po ploche – Canvas - Čo je to plátno - Súradnice - Podpora prehliadačov - JavaScript a canvas - Základné príkazy - Obsluha - Transformácie - Ovládanie - Multimédiá v HTML5 - Prečo Apple na svojich iOS zariadeniach bojkotuje Flash ? - Je Flash na ústupe alebo sa multimédiá majú robiť výslovne práve pomocou Flashu ? - Bezpečnosť multimédií - Podpora multimédií v HTML - Audio - Video - Podpora prehliadačov - Kodeky - Ovládanie - Multimédiá a JavaScript príkazy - Geolikácia v HTM5 - Čo vlastne viem o návštevníkovi - Informácie od servera napr. od PHP - Poloha - Podpora zo strany prehliadačov - Využitie v praxi - Ochrana súkromia - Formuláre v HTML5 - Čo o formulároch vieme - Potreba nových prvkov - Pôvodné HTML formulárové prvky - Nové HTML elementy - jQuery a virtualizácia HTML5 elementov - Podpora prehliadačov - Kontrola prvkov - Atribúty placeholder, autocomplete, pattern, min, max a autofocus - Datalist a praktické využitie - Validácia formulárov jednoduchšie - Praktické príklady - Úložisko na strane klienta – webstorage a websql - Session na stránke servera napr. v PHP - Cookie – výhody a nevýhody - Podpora prehliadačov - Ukladanie dát do lokálneho úložiska - Výber dát a ich platnosť - Web sql - JSON polia v HTML5 - Praktické príklady a diskusia - Odporučené zdroje čerpania informácií === CSS3 - pripraviť sa, odložiť Photoshop, štart! - História CSS, CSS2 a CSS3 - Podpora prehliadačov - Trendy v CSS - Tabuľky, odstavce, konštruktory - Referenčná príručka CSS3 - Ukážky a príklady na úvod - Kombinácia HTM5+CSS3 =dokonalý web - Príkazy a nové možnosti v CSS - Selektory - Box Model - Pozadia a orámovanie - Textové efekty - 2D/3D Transformácie - Animácie a prechody - Fonty, webfonty, vlastné fonty - Praktické využitie - Responzívny design v CSS - Potreba - Mobilné verzie web stránok - Ukážky - Google a mobilné verzie webstránok - Hlavné menu - Rámce stránky - Verzia pre počítače, tablet a telefóny = už iba jeden web - m.domena.sk – správne riešenie ? - Čo vieme spraviť cez CSS a čo nie - Praktické príklady