PAGE6PAGE1《美麗風光網(wǎng)頁》《美麗風光網(wǎng)頁》教案科目《網(wǎng)頁設(shè)計與制作案例教程》授課班級計算機應(yīng)用班教學手段多媒體輔助教學教師崔昊昱課題《案例9美麗風光網(wǎng)頁》課時1課時課型一體化教學目標知識目標：掌握塊元素和行內(nèi)元素各自的特點；掌握<span>標記的應(yīng)用；掌握塊元素間垂直和水平外邊距的計算方式；掌握float屬性的使用。能力目標：能夠理解并列舉常見的塊元素和行內(nèi)元素；能夠利用<span>標記設(shè)置一行內(nèi)容中某部分內(nèi)容的單獨樣式；能夠熟練計算網(wǎng)頁中塊元素間的外邊距；能夠利用浮動屬性實現(xiàn)網(wǎng)頁中塊元素水平排列。情感目標：通過美麗風光網(wǎng)頁感受祖國河山增強學生民族自豪感；在編輯代碼中培養(yǎng)認真細致、精益求精的工匠精神。課前準備依據(jù)教材并在網(wǎng)絡(luò)平臺上精選素材、錄入微課、多媒體課件教學重點元素的類型塊元素的外邊距元素的浮動解決方法：提出問題和簡單案例演示教學難點利用浮動屬性布局網(wǎng)頁元素解決方法：觀看微課自主練習教材與學情分析“網(wǎng)頁設(shè)計與制作”是我校計算機專業(yè)一門重要的專業(yè)課，本節(jié)課選材于中國工信出版集團人民郵電出版社《網(wǎng)頁設(shè)計與制作案例教程（HTML5+CSS3+JavaScript）（微課版）（第2版）》中模塊二【案例9】。該書設(shè)置“以學生為主體，以能力為本位，以就業(yè)為導(dǎo)向”。教材內(nèi)容以任務(wù)驅(qū)動，注重核心技能的訓(xùn)練。通過該課程的學習，使學生熟練使用HTML5+CSS3+JavaScript技術(shù)實現(xiàn)網(wǎng)站結(jié)構(gòu)設(shè)計、頁面樣式美化和布局、網(wǎng)站動態(tài)效果添加等，從而能獨立設(shè)計并開發(fā)小型靜態(tài)網(wǎng)站，在網(wǎng)站開發(fā)中主要培養(yǎng)學生的工匠精神和團隊精神、標準意識和創(chuàng)新思維。因材施教是教學原則，本授課計劃的教學對象是中職二年級的學生，學生第一次接觸HTML5，專業(yè)基礎(chǔ)薄弱，充分調(diào)動學生學習興趣，在充分學習教材內(nèi)容的基礎(chǔ)上，對部分學習態(tài)度濃厚、想深入學習的同學可以加大項目作業(yè)的力度，充分利用網(wǎng)絡(luò)資源等進行學習深入，拓展知識的深度和廣度，加大對學生動手操作能力的培養(yǎng)。對基礎(chǔ)稍差的同學要求只要掌握教材內(nèi)容即可。通過一學期的學習，爭取使所有同學都能做出自己的網(wǎng)站作品。因此，本節(jié)課從簡單案例開始，來增加學生的成就感，讓學生成為學習的主體。為此適合于“做中學，學中做”的教學模式。教學設(shè)計教法教學中我采用情景教學法引入教學，任務(wù)驅(qū)動法實施教學，演示教學法突破重難點，讓學生通過自主探究培養(yǎng)創(chuàng)新能力。學法以“學生為主”，巧妙設(shè)計，讓學生通過自主探究、微課學習、小組合作等方式自主學習，很好的實現(xiàn)了知識的傳遞和融合。教學環(huán)節(jié)教學活動學生活動設(shè)計意圖趣味導(dǎo)入（3分鐘）【欣賞作品趣味導(dǎo)入】設(shè)置情景：展示幾組趣味的網(wǎng)頁圖像，供學生欣賞。學生觀看視頻，并思考這些網(wǎng)頁的共同點?通過作品欣賞，抓住學生的注意力，激發(fā)學生的學習興趣。探索新知（10分鐘）【層層設(shè)問情景導(dǎo)向】以情景為導(dǎo)向，引發(fā)學生思考，講解塊元素與行內(nèi)元素的特點及應(yīng)用、塊元素的外邊距、元素的浮動屬性與清除浮動等相關(guān)知識點。學生通過觀察，了解塊元素與行內(nèi)元素、塊元素的外邊距、元素的浮動屬性與清除浮動等。通過展示樣例，明確本節(jié)課學習重點自主練習（10分鐘）【基礎(chǔ)任務(wù)】根據(jù)以上分析，觀看微課嘗試制作書中[案例9]美麗風光網(wǎng)頁。教師巡回指導(dǎo)學生。學生觀看微課自主練習【案例9】激發(fā)學生的自我探究欲，通過自主練習培養(yǎng)學生自學的能力，幫助學生循序漸進地完成整個作品。創(chuàng)意拓展（12分鐘）【創(chuàng)意任務(wù)】利用素材制作自己的相冊網(wǎng)頁?！菊故军c評】在自主探究之后進行小組合作，然后小組內(nèi)選出最佳作品展示點評，鼓勵大家互相幫助，互相合作，共同完成任務(wù)。小組合作制作個性化的作品，并在同學們間充分交流、合作、分享。創(chuàng)意任務(wù)是基本任務(wù)的延伸，采用任務(wù)驅(qū)動方式，讓學生進入網(wǎng)頁制作自由應(yīng)用階段，從而培養(yǎng)學生自我創(chuàng)新能力。評價總結(jié)（5分鐘）【小結(jié)】總結(jié)本課的知識點?！咀鳂I(yè)】布置作業(yè)：完成課本課后習題與實訓(xùn)；掃碼觀看案例10中的微課，學習元素的幾種定位方式及具體定位方法?；貞洷竟?jié)課所學知識。欣賞作品并嘗試課下完成作業(yè)。課后作業(yè)讓學生對所學知識點進行鞏固練習，培養(yǎng)學生自主學習能力。教學反思本節(jié)課通過案例教學法，讓學生在實際操作中掌握了網(wǎng)頁設(shè)計與制作的相關(guān)知識和技能。在教學過程中，學生對塊元素和行內(nèi)元素的特點、外邊距的計算以及浮動屬性的使用有了更深入的理解，學生的動手能力和團隊合作意識也得到了很好的鍛煉。然而，在教學過程中也發(fā)現(xiàn)了一些問題。部分學生在理解浮動屬性對頁面布局的影響時存在困難。此外，由于學生的基礎(chǔ)