課程名稱：網(wǎng)頁設(shè)計與制作主備人：審核人：第6頁網(wǎng)頁設(shè)計與制作教案（第7周）專業(yè)課程學(xué)習(xí)任務(wù)項目4：了解文字與圖層任務(wù)7掌握操控變形綜合實戰(zhàn)—設(shè)計與制作加濕器宣傳網(wǎng)頁項目5：掌握切片與網(wǎng)頁圖像任務(wù)1了解網(wǎng)頁切片任務(wù)2掌握網(wǎng)頁圖像課時6教學(xué)對象授課時間設(shè)計者一、學(xué)習(xí)任務(wù)分析1．掌握網(wǎng)頁切片的使用。2．教材中的知識與案例均是從實際工作中精選而來，具有很強的應(yīng)用性和示范作用。同時教材結(jié)構(gòu)清晰、內(nèi)容翔實、語言淺顯易懂，并配以精美的素材圖片。二、學(xué)情分析對于剛剛接觸網(wǎng)頁設(shè)計的學(xué)生，思想活躍，有探索新知識的強烈心理，專業(yè)課的學(xué)習(xí)，除需要一定專業(yè)基礎(chǔ)外，還需要學(xué)生具有很強的技能操作能力，所以在本次課的講授中，采用演示、引導(dǎo)、任務(wù)練習(xí)的方法，讓學(xué)生了解所學(xué)的內(nèi)容。三、學(xué)習(xí)目標(biāo)知識目標(biāo)：掌握網(wǎng)頁切片輸出的方法。掌握網(wǎng)頁圖像的優(yōu)化與輸出的方法。能力目標(biāo)：學(xué)會為制作的網(wǎng)頁創(chuàng)建切片。學(xué)會為制作的切片進(jìn)行輸出。學(xué)會為網(wǎng)頁圖像進(jìn)行優(yōu)化。學(xué)會為網(wǎng)頁圖像進(jìn)行輸出。素質(zhì)目標(biāo)：積極積累網(wǎng)頁各個方面知識點并將其在工作中進(jìn)行運用。四、教學(xué)策略重點難點：重點：了解操控變形的應(yīng)用；難點：掌握切片的編輯與的使用。教學(xué)方法：演示案例教學(xué)法。教學(xué)模式：分組討論，集中點評，共同提高。五、教學(xué)環(huán)境及資源準(zhǔn)備教學(xué)環(huán)境：多媒體實訓(xùn)室課前準(zhǔn)備：1.對應(yīng)本節(jié)課制作了相應(yīng)的備課。2.認(rèn)真設(shè)計教案、課件和教學(xué)過程。六、教學(xué)過程教學(xué)環(huán)節(jié)教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖情景描述上課，同學(xué)們好?。ㄏ嗷柡茫。?S管理組織教學(xué)。課前3分鐘：一個在家能主動幫助父母，在學(xué)校主動幫助老師同學(xué)的人，一定是一個優(yōu)秀的人。送人玫瑰，手留余香。助人者，收獲的是能力的提高和心靈的愉悅。復(fù)習(xí)提問：一、對于圖層有哪些不懂得？7S管理組織教學(xué)、統(tǒng)計出勤；課前3分鐘教育；進(jìn)行復(fù)習(xí)提問，讓學(xué)生進(jìn)入思考狀態(tài)。以小組為團(tuán)體回答，并加分。使學(xué)生注意力集中積極思考，積極回答問題。7S管理形成習(xí)慣，鞏固知識，增強團(tuán)隊意識。引導(dǎo)問題如果網(wǎng)頁上的圖像較大，瀏覽器下載整個圖像需要花很長的時間。切片就是將一幅大圖像分割為一些小的圖像切片，然后在網(wǎng)頁中通過沒有間距和寬度的表格重新將這些小的圖像沒有縫隙的拼接起來，成為一幅完整的圖像。這樣做可以減小圖像的大小，減少網(wǎng)頁的下載時間，還能將圖像的一些區(qū)域用HTML來代替。為此，小艾想使用比較專業(yè)的軟件對處理中的網(wǎng)頁進(jìn)行輸出優(yōu)化，而同事凱程告訴她，Photoshop就可以完成對一個設(shè)計的網(wǎng)頁進(jìn)行切片制作并輸出的功能。在此方面只要了解網(wǎng)頁切片輸出和網(wǎng)頁圖像的優(yōu)化與輸出即可。引出本節(jié)重點內(nèi)容，注意培養(yǎng)學(xué)生的觀察力和注意力。學(xué)生跟隨老師的講解和啟發(fā)進(jìn)入內(nèi)容，積極思考。通過導(dǎo)入問題,讓學(xué)生分小組思考。相關(guān)知識介紹任務(wù)7掌握操控變形該功能能夠通過添加的顯示網(wǎng)格和圖釘對圖層中的圖像進(jìn)行變形，從而使僵化的變換變得更加具有柔性，使變換后的圖像更符合創(chuàng)作者的要求，變換后的效果如圖所示。任務(wù)1了解網(wǎng)頁切片“切片工具”是Photoshop軟件自帶的一個平面圖片切割工具。使用“切片”工具可以將一個完整的網(wǎng)頁切割成許多小圖片，以便于從網(wǎng)絡(luò)上下載?；顒?了解創(chuàng)建切片Photoshop中的切片工具主要用于在制作網(wǎng)頁時候?qū)D片進(jìn)行“瘦身”，它可以在不損失圖像效果的前提下，減小文件的容量。在打開的圖片上，使用切片工具，將光標(biāo)置于要創(chuàng)建切片的位置，按住鼠標(biāo)左鍵拖動，拖動到合適的切片大小繪制切片，具體的創(chuàng)建過程與矩形選框工具相同，如圖所示?；顒?了解編輯切片如果切片大小不合適，還可以調(diào)整和編輯切片，在圖片中創(chuàng)建切片后，單擊鼠標(biāo)右鍵，在彈出的快捷菜單中選擇“劃分切片”命令，在彈出的“劃分切片”對話框中，將劃分切片的“垂直劃分為”設(shè)置為3，設(shè)置完畢單擊“確定”按鈕，完成切片的劃分，如圖所示。任務(wù)2掌握網(wǎng)頁圖像優(yōu)化網(wǎng)頁使之能快速下載是頁面制作中很重要的考慮因素。網(wǎng)頁優(yōu)化涉及方方面面，圖片優(yōu)化則是其中重要手段之一，本此任務(wù)就講述如何進(jìn)行網(wǎng)頁圖像的優(yōu)化?；顒?掌握圖像的優(yōu)化及應(yīng)用顏色表圖像的優(yōu)化應(yīng)用顏色表活動2掌握圖像大小及保存圖像圖像大小保存圖像課件設(shè)疑，引起注意，牢牢抓住和吸引學(xué)生探究新知識的心理。講練結(jié)合，突出實操能力培養(yǎng)。跟隨老師進(jìn)入思考分析狀態(tài)。認(rèn)真完成操作任務(wù)。通過課件引出問題，演示法和指導(dǎo)法，使學(xué)生掌握知識點。提高學(xué)生操作能力。分組討論組織學(xué)生分小組討論引導(dǎo)問題，保證人人有任務(wù)，人人有活干。評分項目評分指標(biāo)標(biāo)準(zhǔn)分評分儀態(tài)舉止是否得體0.5準(zhǔn)備準(zhǔn)備是否充分0.5語言聲音是否洪亮、表達(dá)是否準(zhǔn)確0.5小組配合組分工是否明確，配合是否默契0.5小計2分配小組長任務(wù)。通過引導(dǎo)問題，學(xué)生進(jìn)行分析、思考。各個小組分配任務(wù)進(jìn)行討論問題。達(dá)到培養(yǎng)學(xué)生分工合作和查找資料能力。小組展示各小組派代表上黑板前展示自己小組引導(dǎo)問，由全班同學(xué)找出問題并由小組代表進(jìn)行解答。展示并解答問題。學(xué)生展示討論成果，回答問題。鍛煉學(xué)生表達(dá)能力和儀表。鍛煉學(xué)生表達(dá)能力和儀表。全班查找問題。課堂總結(jié)找最優(yōu)秀小組講解設(shè)計中的注意事項，并由教師點評總結(jié)設(shè)計注意事項，并分組點評各組優(yōu)缺點?？偨Y(jié)點評設(shè)計情況，并歸納知識點。學(xué)生總結(jié)所學(xué)知識，積極回答問題。學(xué)生掌握知識。布置作業(yè)一、為圖像創(chuàng)建切片并設(shè)置鏈接布置作業(yè)，并講解具體要求。記錄并在課下思考問題，主動學(xué)習(xí)。培養(yǎng)學(xué)生學(xué)習(xí)能力。便于下次課進(jìn)行。七、教學(xué)評價設(shè)計通過小組自我評價、小組評價、教師評價完成對小組進(jìn)行評價，教師和組長對成員進(jìn)行評價，回答問題加1分；演示操作加2分，第一名小組的成員每人加1分。記入平面成績，期末進(jìn)行成績綜合評定。評價項目評價指標(biāo)標(biāo)準(zhǔn)分自我評價小組評價教師評價學(xué)習(xí)態(tài)度學(xué)習(xí)主