網(wǎng)頁(yè)設(shè)計(jì)之滾動(dòng)字幕教案.doc

20152016學(xué)年 第二學(xué)期網(wǎng)頁(yè)設(shè)計(jì)之滾動(dòng)字幕教案（公開課）信息技術(shù)組：米暢2016年6月22日授課內(nèi)容網(wǎng)頁(yè)設(shè)計(jì)之滾動(dòng)字幕課時(shí)安排1課時(shí) 教學(xué)目標(biāo)要求知識(shí)與技能會(huì)使用標(biāo)簽制作滾動(dòng)字幕，并理解屬性與屬性值之間的含義。過(guò)程與方法鞏固對(duì)Dreamweaver軟件中“標(biāo)簽”和“標(biāo)簽檢查器”的使用。學(xué)會(huì)合理的規(guī)劃滾動(dòng)圖片或文字的出現(xiàn)效果。情感態(tài)度與價(jià)值觀本節(jié)學(xué)習(xí)將滾動(dòng)字幕作為一個(gè)單獨(dú)的元素進(jìn)行講解，選取更為簡(jiǎn)單易懂的案列來(lái)幫助學(xué)生掌握重點(diǎn)。同時(shí)引導(dǎo)學(xué)生注意觀察周圍事物，將滾動(dòng)這種表現(xiàn)方式不僅僅局限于網(wǎng)頁(yè)設(shè)計(jì)，而是利用Dreamweaver這個(gè)軟件來(lái)實(shí)現(xiàn)該效果。待學(xué)生熟練掌握滾動(dòng)字幕的制作后，就可以在他們的網(wǎng)站里自由發(fā)揮。由此引導(dǎo)學(xué)生理解什么是觸類旁通，真正授人以漁。教學(xué)重點(diǎn)難點(diǎn)重點(diǎn)：利用滾動(dòng)字幕增強(qiáng)網(wǎng)頁(yè)表現(xiàn)力。難點(diǎn)：利用“標(biāo)簽檢查器”為標(biāo)簽的各個(gè)屬性設(shè)置參數(shù)。教學(xué)方法手段 講授法、演示法、任務(wù)驅(qū)動(dòng)法 教學(xué)內(nèi)容提綱一、新課引入 同學(xué)們，對(duì)于HTML語(yǔ)言的學(xué)習(xí)已有一段時(shí)間，其中我們認(rèn)識(shí)了很重要的一個(gè)元素標(biāo)簽。大家先跟老師一起回顧所學(xué)過(guò)的標(biāo)簽。【播放幻燈片】以上這些標(biāo)簽都是構(gòu)成靜態(tài)網(wǎng)頁(yè)的基本元素，若想實(shí)現(xiàn)如示例所示的網(wǎng)頁(yè)效果，我們?cè)撊绾沃谱髂兀肯日?qǐng)同學(xué)們欣賞這幾個(gè)網(wǎng)頁(yè)，找出它們的共同點(diǎn)?！菊故緷L動(dòng)字幕網(wǎng)頁(yè)】 師將發(fā)言簡(jiǎn)單總結(jié)，確定本節(jié)課的主題滾動(dòng)字幕。2、 本課教學(xué)師：既然同學(xué)們都見過(guò)滾動(dòng)字幕，那么它到底是如何實(shí)現(xiàn)的呢？接下來(lái)請(qǐng)大家觀看一段微視頻，觀看的同時(shí)思考以下幾個(gè)問(wèn)題。【提出問(wèn)題，播放視頻】1 滾動(dòng)字幕的標(biāo)簽如何表示？2 滾動(dòng)字幕的標(biāo)簽中有哪些屬性？3 該標(biāo)簽是否可以用來(lái)制作滾動(dòng)圖片？通過(guò)微視頻我想同學(xué)們對(duì)滾動(dòng)字幕都有了自己的認(rèn)識(shí)，那么剛才提出的三個(gè)問(wèn)題心中也有了答案。哪位同學(xué)來(lái)回答第一個(gè)問(wèn)題？【提問(wèn)回答】1 2 behavior滾動(dòng)方式、direction滾動(dòng)方向、scrollamount滾動(dòng)速度、scrolldelay滾動(dòng)時(shí)停頓的時(shí)間 3 可以師：在微視頻中學(xué)生不僅學(xué)習(xí)了一個(gè)新標(biāo)簽，同時(shí)也獲得了如何制作滾動(dòng)字幕的信息。現(xiàn)在，我們發(fā)布挑戰(zhàn)一，請(qǐng)同學(xué)們自主完成，速度最快的兩名同學(xué)可以充當(dāng)小老師幫助其他同學(xué)。挑戰(zhàn)一：根據(jù)已給的文字素材，每位同學(xué)制作滾動(dòng)字幕，表現(xiàn)形式不限。最先做完的三名同學(xué)將為所在大組贏得一面小紅旗?！菊故緦W(xué)生作品，并上臺(tái)進(jìn)行演示】一探究竟：大部分同學(xué)已經(jīng)實(shí)現(xiàn)文字滾動(dòng)效果，在前面思考的問(wèn)題中有一個(gè)“滾動(dòng)字幕的標(biāo)簽中有哪些屬性”，但是對(duì)標(biāo)簽的屬性有多少同學(xué)能熟練運(yùn)用呢？為了能讓大家實(shí)現(xiàn)更多的滾動(dòng)效果，請(qǐng)同學(xué)們按照老師所說(shuō)的步驟，一步一步的執(zhí)行，然后仔細(xì)觀察網(wǎng)頁(yè)中的文字發(fā)生了怎樣的變化?！静シ呕脽羝? 將behavior屬性后面雙引號(hào)中的內(nèi)容進(jìn)行修改2 將direction屬性后面雙引號(hào)中的內(nèi)容進(jìn)行修改3 將scrollamount屬性后面的數(shù)值增大，接著減少4 將scrolldelay屬性后面的數(shù)值增大，接著減少簡(jiǎn)單的我們已經(jīng)掌握，像游戲一樣我們來(lái)提升難度。剛才思考的第三個(gè)問(wèn)題是“該標(biāo)簽是否可以用來(lái)制作滾動(dòng)圖片”，答案是當(dāng)然可以。所以接下來(lái)請(qǐng)同學(xué)們利用老師下發(fā)的素材包括文字、圖片，挑選自己認(rèn)為合適的難度任務(wù)來(lái)完成。完成速度較快的并且充滿創(chuàng)意的同學(xué)，可以幫助其他同學(xué)?！静シ呕脽羝刻魬?zhàn)二：難度系數(shù)：一顆星自由發(fā)揮，制作一段滾動(dòng)字幕，內(nèi)容自定義。難度系數(shù)：兩顆星自由發(fā)揮，利用已給圖片素材制作滾動(dòng)圖片。難度系數(shù)：三顆星自由發(fā)揮，利用已給的圖片和文字素材，制作多樣的滾動(dòng)內(nèi)容。 先將全體學(xué)生分為四個(gè)組，然后學(xué)生根據(jù)情況自由選擇不同難度的挑戰(zhàn)，并在20分鐘內(nèi)完成。老師檢查通過(guò)后，可在所對(duì)應(yīng)的大組加上相應(yīng)的星星數(shù)。最后，星星數(shù)最多的一組為獲勝組。【展示學(xué)生作品】三、課堂小結(jié)首先，采用快問(wèn)快答的方式對(duì)本節(jié)課的知識(shí)點(diǎn)進(jìn)行一個(gè)鞏固，老師提問(wèn)學(xué)生集體回答。師：最后我們一起對(duì)本節(jié)課進(jìn)行一個(gè)小結(jié)。在Dreamweaver中制作滾動(dòng)字幕，無(wú)需手動(dòng)輸入代碼，可以使用HTML的標(biāo)簽，并設(shè)置屬性即可。標(biāo)簽的屬性常用的有四個(gè)，分別為behavior滾動(dòng)方式、direction滾動(dòng)方向、scrollamount滾動(dòng)速度、scrolldelay滾動(dòng)時(shí)停頓時(shí)間。當(dāng)然也可以用來(lái)制作滾動(dòng)圖片，只需將我們要滾動(dòng)顯示的單張或多張圖片排列好選中后，再添加標(biāo)簽并設(shè)置參數(shù)就可以了。課外學(xué)習(xí)要求 師：課后，請(qǐng)同學(xué)們利用今天所學(xué)的滾動(dòng)字幕，為自己所作網(wǎng)站增添亮麗一筆。同時(shí)結(jié)合課本第72頁(yè)至73頁(yè)，自己嘗試?yán)肁P Div元素（層）布局網(wǎng)頁(yè)。教學(xué)后記 這堂課我把教學(xué)內(nèi)容轉(zhuǎn)化為具有潛在意義的問(wèn)題，讓學(xué)生產(chǎn)生強(qiáng)烈的探究意識(shí)，使學(xué)生的整個(gè)學(xué)習(xí)過(guò)程成為“猜想”，繼而緊張地探索，期待尋找答案和理由的一個(gè)過(guò)程。在實(shí)際情況下進(jìn)行學(xué)習(xí)，可以先讓學(xué)生見證網(wǎng)頁(yè)效果，然后自己動(dòng)手嘗試達(dá)到同樣的效果。并且教師需要引導(dǎo)學(xué)生將不同參數(shù)值設(shè)置的情況進(jìn)行對(duì)比，發(fā)現(xiàn)不同加深映象，這樣獲取的知識(shí)，不但易于保持，而且易于遷移到陌生的問(wèn)題情境中。本課沿用了我一貫的教學(xué)手段“挑戰(zhàn)難度任務(wù)”，同時(shí)這一環(huán)節(jié)也貫穿了始終，讓學(xué)生在競(jìng)爭(zhēng)中得到歡樂(lè)，獲得知識(shí)。由易到難的制作過(guò)程，促使學(xué)生一步步掌握了滾動(dòng)字幕的制作技巧，再利用到自己的網(wǎng)站中實(shí)現(xiàn)增強(qiáng)網(wǎng)頁(yè)表現(xiàn)力這一目標(biāo)。最后的快問(wèn)快答的總結(jié)形式，再一次加深了學(xué)生對(duì)新知識(shí)的記憶，更主要強(qiáng)調(diào)了創(chuàng)新的重要性。同時(shí)，溫故