Cílem práce je vytvoření učební pomůcky pro předmět webové technologie, která byla zpracována v programu PSPad. Teoretická část je zaměřena na vybrané programy, které umožňují zápis různých jazyků. Následuje popis základní struktury HTML5 dokumentu a jeho náležitosti. Každý záznam vytvořený v HTML dokumentu je potřeba objasnit za použití kaskádových stylů. Závěr teoretické části je věnována struktuře Bootstrap. Praktická část je zaměřena hlavně na praktické znalosti využití HTML, CSS a Bootstrap. Tyto jazyky nám pomáhají k zobrazení názorného popisu a vysvětlení kódu. Výsledný zápis je vyobrazen přes webový prohlížeč. Součástí práce jsou také prezentace pro výuku se vzorovými příklady.
Annotation in English
The aim of this thesis is to create learning aids for the web-based technology which was developed in PSPad. The theoretical part is focused on selected programs that allow wri-ting of different languages. The next part is a description of the basic structure HTML5 do-cument and its elements. Each record created in the HTML document is needed to be clari-fied by the use of cascading style sheets. The ending of the theoretical part is devoted to the structure Bootstrap. The practical part is focused mainly on practical use of the knowledge of HTML, CSS and Bootstrap. These languages help us to show illustrative description and explanation of the code. The final entry is shown via a Web browser. This thesis also includes presentations for teaching with sample examples.
Cílem práce je vytvoření učební pomůcky pro předmět webové technologie, která byla zpracována v programu PSPad. Teoretická část je zaměřena na vybrané programy, které umožňují zápis různých jazyků. Následuje popis základní struktury HTML5 dokumentu a jeho náležitosti. Každý záznam vytvořený v HTML dokumentu je potřeba objasnit za použití kaskádových stylů. Závěr teoretické části je věnována struktuře Bootstrap. Praktická část je zaměřena hlavně na praktické znalosti využití HTML, CSS a Bootstrap. Tyto jazyky nám pomáhají k zobrazení názorného popisu a vysvětlení kódu. Výsledný zápis je vyobrazen přes webový prohlížeč. Součástí práce jsou také prezentace pro výuku se vzorovými příklady.
Annotation in English
The aim of this thesis is to create learning aids for the web-based technology which was developed in PSPad. The theoretical part is focused on selected programs that allow wri-ting of different languages. The next part is a description of the basic structure HTML5 do-cument and its elements. Each record created in the HTML document is needed to be clari-fied by the use of cascading style sheets. The ending of the theoretical part is devoted to the structure Bootstrap. The practical part is focused mainly on practical use of the knowledge of HTML, CSS and Bootstrap. These languages help us to show illustrative description and explanation of the code. The final entry is shown via a Web browser. This thesis also includes presentations for teaching with sample examples.
Seznamte se s webovými technologii (HTML 5, CSS, Jquery,Bootstrap) v aktuální verzi.
Zpracujte popis těchto technologií.
Zpracujte podklady pro výuku - teroretickou i praktickou.
Realizujte sadu vzorových příkladů.
Navrhněte sadu 60 testovacích úkolů včetně řešení.
Uveďte možné směry rozvoje učební pomůcky.
Research Plan
Seznamte se s webovými technologii (HTML 5, CSS, Jquery,Bootstrap) v aktuální verzi.
Zpracujte popis těchto technologií.
Zpracujte podklady pro výuku - teroretickou i praktickou.
Realizujte sadu vzorových příkladů.
Navrhněte sadu 60 testovacích úkolů včetně řešení.
Uveďte možné směry rozvoje učební pomůcky.
Recommended resources
BROWN, Tiffany B, Kerry BUTTERS a Sandeep PANDA. HTML5 okamžitě: \matsymb{lbrack}ovládněte HTML5 za víkend\matsymb{rbrack}. 1. vyd. Brno: Computer Press, 2014, 256 s. ISBN 978-80-251-4296-7.
PÍSEK, Slavoj. HTML: začínáme programovat. 4., aktualiz. vyd. Praha: Grada, 2014, 181 s. ISBN 978-80-247-5059-0.
CASTRO, Elizabeth a Bruce HYSLOP. HTML5 a CSS3: názorný průvodce tvorbou WWW stránek. 1. vyd. Brno: Computer Press, 2012, 439 s. ISBN 978-80-251-3733-8.
HOGAN, Brian P. HTML5 a CSS3: výukový kurz webového vývojáře. Vyd. 1. Brno: Computer Press, 2011, 272 s. ISBN 978-80-251-3576-1.
LUBBERS, Peter, Brian ALBERS a Frank SALIM. HTML5: programujeme moderní webové aplikace. Vyd. 1. Brno: Computer Press, 2011, 304 s. ISBN 978-80-251-3539-6.
LAZARIS, Louis. CSS okamžitě. 1. vyd. Brno: Computer Press, 2014, 168 s. ISBN 978-80-251-4176-2.
DOMES, Martin. 333 tipů a triků pro CSS. 2., aktualiz. vyd. Brno: Computer Press, 2011, 272 s. ISBN 978-80-251-3366-8.
Recommended resources
BROWN, Tiffany B, Kerry BUTTERS a Sandeep PANDA. HTML5 okamžitě: \matsymb{lbrack}ovládněte HTML5 za víkend\matsymb{rbrack}. 1. vyd. Brno: Computer Press, 2014, 256 s. ISBN 978-80-251-4296-7.
PÍSEK, Slavoj. HTML: začínáme programovat. 4., aktualiz. vyd. Praha: Grada, 2014, 181 s. ISBN 978-80-247-5059-0.
CASTRO, Elizabeth a Bruce HYSLOP. HTML5 a CSS3: názorný průvodce tvorbou WWW stránek. 1. vyd. Brno: Computer Press, 2012, 439 s. ISBN 978-80-251-3733-8.
HOGAN, Brian P. HTML5 a CSS3: výukový kurz webového vývojáře. Vyd. 1. Brno: Computer Press, 2011, 272 s. ISBN 978-80-251-3576-1.
LUBBERS, Peter, Brian ALBERS a Frank SALIM. HTML5: programujeme moderní webové aplikace. Vyd. 1. Brno: Computer Press, 2011, 304 s. ISBN 978-80-251-3539-6.
LAZARIS, Louis. CSS okamžitě. 1. vyd. Brno: Computer Press, 2014, 168 s. ISBN 978-80-251-4176-2.
DOMES, Martin. 333 tipů a triků pro CSS. 2., aktualiz. vyd. Brno: Computer Press, 2011, 272 s. ISBN 978-80-251-3366-8.
