HTML5CSS3Web前端設計基礎教程（第3版）教案-教學設計 任務22 Web App頁面的設計與實現-7課時-課堂教學設計

課堂教學設計課程名稱Web前端開發(fā)/網頁設計與制作授課時數7授課班級授課時間授課地點授課形式多媒體教學參考資料參考教材《HTML5+CSS3Web前端設計基礎教程（第3版）（微課版）》，人民郵電出版社，2024年專業(yè)教學標準《Web前端開發(fā)》課程標準職業(yè)技能標準Web前端開發(fā)職業(yè)技能等級標準（標準代碼：510001）校本補充材料中國大學MOOC（/）其他資源媒體資源智能課堂、微課、PPT、配套素材等環(huán)境資源多媒體教室教學目標知識目標掌握在WebApp項目開發(fā)中的方法；技能目標掌握WebApp類型網站的制作流程素質目標增強學生對“開放”“合作共贏”的深刻理解；培養(yǎng)學生綜合應用能力，強化社會責任感。教學重點頁面實現過程教學難點頁面實現過程學情分析學生已經能夠使用HTML+CSS搭建基本頁面，對于復雜頁面布局和不同設備間的響應式設計缺乏知識儲備。教學總體設計依據教學標準要求，結合學生學情，動態(tài)調整應用“翻轉課堂”模式的教學比重，以邊講邊練、分組討論、實踐操作、課堂小結的路徑組織實施教學過程。課外拓展有針對性的安排訓練，同時培養(yǎng)學生發(fā)現問題、自主解決問題的意識和習慣，進而提高綜合素養(yǎng)。教學環(huán)節(jié)(時間安排)教學內容教學活動技術資源教學隨記(教學過程中記錄)教師學生課前準備(提前2-3天發(fā)布教學任務)預習微課視頻任務下達、課前準備任務獲取、課前準備PPT、微課、網絡資源課堂教學（一）情境創(chuàng)設[15分鐘]1.回顧上節(jié)課基本知識，，引出完成本次任務需要掌握的知識基礎。學生聆聽任務情境，理解任務與知識點的關系。2.明確課程的學習目標和預期成果，讓學生對學習路徑有一個清晰的認識。理論講授明確任務知識獲取智能課堂、微課、PPT、多媒體電腦、互聯(lián)網資料等。課堂教學（二）知識學習[100分鐘]1.頁面實現的詳細過程（1）首頁的實現（2）列表頁的實現（3）詳細內容頁的實現案例教學知識獲取智能課堂、微課、PPT、多媒體電腦、互聯(lián)網資料等。課堂教學（三）仿真演練[230分鐘]1.根據教材內容上機演練各個示例，獨立思考，理解技術難點。2.鼓勵學生在上機演練時相互討論，分享學習心得和遇到的問題，通過集體的智慧解決問題。3.教師即時的反饋和指導，幫助學生及時糾正錯誤，加深理解。實踐指導實踐訓練智能課堂、微課、PPT、多媒體電腦、互聯(lián)網資料等。課堂教學（四）總結評價[30分鐘]1.課堂小結，重申課堂重點難點，明確課題學習任務，針對課堂教學內容，互動交流討論。2.課程整體評價。作業(yè)點評課程小結查漏補缺吸收整理智能課堂、微課、PPT、多媒體電腦、互聯(lián)網資料等。課后拓展1.獨立完善“WebApp”的其他頁面