Výukový materiál zpracovaný v rámci projektu Registrační číslo projektu: CZ.1.07/1.4.00/21.3712 Škola adresa: Základní škola T. G. Masaryka Ivančice, Na Brněnce 1, okres Brno-venkov, příspěvková organizace Na Brněnce 1, Ivančice, okres Brno-venkov www.zstgmivancice.cz zstgmasaryka@seznam.cz Šablona: III/2 č. 4 Ověření ve výuce (dne): 7. 11. 2012 Pořadové číslo hodiny: 15 Třída: 9. A, 9. B, 9. C Předmět: Tvorba webových stránek Název: Hot Potatoes JQuiz Anotace: Materiál provází žáka tvorbou interaktivních cvičení. Pracovní list je součástí výuky tvorby webových stránek bez znalosti HTML jazyka. Zápis s dalšími úkoly je k dispozici na http://www.zstgmivancice.cz/studium/info9/kap08.html. Autor: Mgr. Otmar Němec Jazyk: čeština Očekávaný výstup: Získá praktické dovednosti k tvorbě interaktivních cvičení (kvízů). Pracuje s informacemi v souladu se zákony o duševním vlastnictví. Ověřuje věrohodnost informací. Kriticky myslí, je schopen obhájit své činy, uvědomuje si zodpovědnost za svá rozhodnutí. Uplatňuje základní typografická pravidla. Klíčová slova: Hot Potatoes, JQuiz, kvíz, interaktivní kvíz, HTML kód Rozvíjené klíčové kompetence: KU, KŘP, KP Druh učebního materiálu: pracovní list Druh interaktivity: kombinované Cílová skupina: žák Stupeň a typ vzdělávání: základní vzdělávání druhý Ročník: devátý Celková velikost: 680 kb
Interaktivní cvičení: V současné době již dokážeme vytvářet webové stránky přes on-line redakční systémy. Než přejdeme k tvorbě webu prostřednictvím HTML jazyka, ukážeme si, jak můžeme web zajímavě oživit a to ještě stále bez znalosti HTML jazyka. Existují programy, které dokáží námi vložené informace vygenerovat do zajímavých interaktivních cvičení. Programů, kterým stačí data vkládat do předem připravených políček, není mnoho. Za pozornost ale jistě stojí Hot Potatoes, kterému se budeme podrobněji věnovat v několika digitálních učebních materiálech. Hot Potatoes Program má 6 částí, z nichž každá slouží k vytváření určitého typu cvičení, která lze ve formátu.htm umístit na web jako interaktivní cvičení vyhodnocované automaticky počítačem. Cvičení využívají jazyk HTML a JavaScript, který realizuje interaktivitu na webu. O těchto jazycích nemusíme zatím samozřejmě vůbec nic vědět, abychom mohli program využívat. Stačí tedy pouze vložit informace (text, obrázky) a program je zpracuje do interaktivní podoby ve formě webových stránek. Pro program existuje několik možných překladů do českého jazyka, proto se názvy některých tlačítek v popisu programu mohou nepatrně lišit. V rámci výuky budeme využívat následující části programu: - JQuiz kvízy, - JCross křížovky, - JMatch přiřazování informací (může jít jak o text, tak i obrázky) z jednoho sloupce do druhého, - JMix cvičení, kdy se z několika slov skládá věta nebo i více vět.
JQuiz zadání práce: Program JQuiz dokáže na základě vložených informací vytvořit několik typů kvízů. Podle postupu viz níže vytvoř 2 typy kvízů. Výslednou práci si ulož na plochu do složky Interaktivní cvičení. Obsahové zaměření kvízů: Kvíz č. 1 se bude týkat naší školy, tj. vytvoř alespoň 10 otázek s odpověďmi, které zahrnou dění naší školy od jejího založení až po současnou dobu (otázky mohou být směrovány k vyhledávání informací na školním webu). Kvíz č. 2 zaměř buď na předmět Tvorba webových stránek (kvíz se zadáním Vyberte odpověď ), nebo na předmět Anglický jazyk (kvíz se zadáním Krátká odpověď ). Vytvoř alespoň 10 otázek s odpověďmi, které tematicky obsáhnou probrané učivo kolem on-line tvorby webu na Webnode, nebo 20 otázek zaměřených na překlad libovolných anglických slovíček 9. ročníku. JQuiz postup při vypracování úkolu: JQuiz umožňuje tvorbu kvízů s několika typy zadání. Společně si vyzkoušíme zadání typu: a) Vyberte odpověď respondent vybírá odpovědi z několika nabídnutých možností. b) Krátká odpověď respondent dopisuje hledaná slova do vynechaných polí cvičení. Kvíz typu Vyberte odpověď Jednotlivé body odpovídají číslům na obrázku níže: 1. Vlož Název (titulek) pro webovou stránku s cvičením. 2. Zapiš otázku. 3. Mezi otázkami se můžeš pohybovat. 4. Zapiš několik možných odpovědí (každou odpověď do jednotlivého políčka). 5. V případě, že ti nestačí využít čtyři nabídnutá pole pro odpovědi, můžeš přidat další. 6. Označ mezi odpověďmi tu správnou. 7. Můžeš zadat odezvu k jednotlivým odpovědím. K jejímu zobrazení dojde po výběru jedné z odpovědí u již hotového kvízu. 8. Konfigurační nastavení před vygenerováním interaktivního cvičení (podrobněji viz další kapitola). 9. Uložení práce ve formátu.jqz (vhodné pro pozdější úpravy). 10. Generování do HTML.
9 10 8 1 3 2 5 4 7 6
Konfigurační nastavení Velkou výhodou tohoto programu je vlastní konfigurace nebo-li pojmenování všech prvků ve vygenerovaných cvičeních (tlačítka, nápovědy ). To znamená, že výsledná cvičení lze kompletně připravit pro publikaci na web podle našich požadavků. Postup: 1. Volbou tlačítka Konfigurační okno dojde k zobrazení následujícího okna, ve kterém můžeš upravovat popisky, instrukce, tlačítka atd. Přednastavený název lze změnit. Doplníme instrukce pro vyplňování kvízu, nebo necháme prázdné. 2. Projdi si jednotlivé karty s přednastavenými názvy tlačítek a příkazů. Můžeš si také změnit výsledný vzhled interaktivního cvičení na stejnojmenné kartě. 3. Všechny provedené změny ulož příkazem Uložit a potvrď OK.
4. Na kartě Časovač nastav dle obtížnosti svého kvízu přiměřený čas. Generování do HTML Poté, co je kvíz již vytvořen a konfiguračně nastaven, přejdi na jeho vygenerování do HTML podoby, tj. formátu spustitelném přes internetový prohlížeč. Postup: 1. Vyber tlačítko Export do HTML. 2. Nabídne se ti cesta, kam chceš soubor nahrát (soubor si nějak pojmenuj, vždy bez háčků, čárek, mezer a pouze s malými písmeny). Pro uložení zvol složku Interaktivní cvičení. 3. Potvrď příkaz Uložit.
4. Zobrazí se ti následující okno. 5. Pokračuj možností Zobrazit cvičení v prohlížeči. 6. Pro správnou funkci interaktivního cvičení je na některých PC nutné v prohlížeči Povolit blokovaný obsah viz obr. Kvíz typu Krátká odpověď U tohoto typu kvízu postupuješ úplně stejně jako v předcházejícím případě. Hlavním rozdílem je, že tebou zapsané odpovědi bude respondent zapisovat do prázdných polí, nikoliv tedy vybírat z nabídnutých možností. Obzvlášť důležité je dbát na přesné zapsání slov bez chyb.
Zdroj: NĚMEC, Otmar. Školní interaktivní web [online]. [cit. 7.10.2012]. Dostupný na WWW: <http://www.zstgmivancice.cz/zamestnanci/skolni_interaktivni_web.pdf> Použité obrázky z aplikace Hot Potatoes jsou vlastní tvorbou autora.