《網(wǎng)頁制作》教案設(shè)計

《網(wǎng)頁制作》教案設(shè)計《網(wǎng)頁制作》教案設(shè)計/《網(wǎng)頁制作》教案設(shè)計湖南省商業(yè)技術(shù)學(xué)院學(xué)期授課進度計劃（二年級第一學(xué)期）課程名稱 網(wǎng)頁制作及設(shè)計適用班級 16高21、22制定教師 易會芝審批簽字教研室主任年月日教務(wù)科長年月日教務(wù)院長年月日2017-2018學(xué)年第一學(xué)期制定課時分配授課周數(shù)周課時授課總課時其中講課實驗復(fù)習(xí)考試機動23期末完成情況計劃課時完成課時超出或缺少課時超出缺少彌補教學(xué)截至章節(jié)內(nèi)容備注：用藍黑或碳素墨水鋼筆填寫教學(xué)計劃學(xué)情分析本門課程《網(wǎng)頁設(shè)計及制作》的教學(xué)班級為14級計算機班，計算機班對網(wǎng)絡(luò)知識有一定的了解，基礎(chǔ)知識較好，同時根據(jù)實際情況，特擬定本計劃。大綱要求通過本學(xué)期《網(wǎng)頁設(shè)計及制作》的學(xué)習(xí)，主要要求同學(xué)們掌握網(wǎng)頁制作的一些基本功能和操作，為以后的一些學(xué)習(xí)和工作打下較好的基礎(chǔ)。通過學(xué)習(xí)要求同學(xué)達到以下要求：1、了解DreamweaverCS6的詳細功能及操作方法。2、熟練掌握網(wǎng)頁制作技巧。3、掌握網(wǎng)頁規(guī)范以及網(wǎng)頁優(yōu)化和網(wǎng)站推廣的知識。4、明確網(wǎng)站建設(shè)的流程和站點建設(shè)成后需要做的優(yōu)化推廣工作。教學(xué)重點1、超級鏈接2、表格表單應(yīng)用3、框架使用4、CSS樣式教學(xué)難點1、超級鏈接2、用表格和框架布局頁面3、創(chuàng)建數(shù)據(jù)庫教學(xué)方法講授法、演示法、項目教學(xué)法、合作學(xué)習(xí)、對話、任務(wù)驅(qū)動法、頭腦風(fēng)暴、小組討論法等教學(xué)方法。學(xué)期授課進度計劃表周次授課內(nèi)容課時備注31.1HYPERLINK網(wǎng)站基礎(chǔ)知識21、2周新生軍訓(xùn)1.2HYPERLINK網(wǎng)站建設(shè)概述2實訓(xùn)HYPERLINK新建一個網(wǎng)頁2上機42.1HYPERLINK添加和編輯文本2實訓(xùn)HYPERLINK網(wǎng)站素材處理2上機實訓(xùn)HYPERLINK制作簡單網(wǎng)頁2上機567國慶放假6機動補周一課82.2HYPERLINK添加和編輯圖像62.3HYPERLINK創(chuàng)建超級鏈接2實訓(xùn)HYPERLINK圖像處理和創(chuàng)建超級鏈接2上機9實訓(xùn)HYPERLINK跳轉(zhuǎn)菜單2上機2.4HYPERLINK使用表格布局頁面2實訓(xùn)HYPERLINK表格布局實例分析2上機102.5HYPERLINK使用框架布局頁面2運動會充周三到周五運動會11實訓(xùn)HYPERLINK框架布局實例分析2上機HYPERLINK3.3添加動畫2HYPERLINK添加音頻和視頻212實訓(xùn)HYPERLINKDIV及表格的轉(zhuǎn)換2上機4.3HYPERLINK晃動的圖片2實訓(xùn)HYPERLINK交換圖像2上機13實訓(xùn)HYPERLINK拼圖游戲2上機4.4HYPERLINK修改屬性特效及動態(tài)菜單制作2實訓(xùn)HYPERLINK效果行為應(yīng)用2上機14實訓(xùn)HYPERLINK圖片展播實例2上機5.1HYPERLINK認(rèn)識和編輯CSS2實訓(xùn)HYPERLINK美化頁面2上機15實訓(xùn)HYPERLINK應(yīng)用CSS到網(wǎng)頁中2上機5.2HYPERLINK類型、背景和區(qū)塊樣式2實訓(xùn)HYPERLINK方框、邊框和導(dǎo)航欄2上機16實訓(xùn)HYPERLINK超鏈接樣式及設(shè)置技巧2上機學(xué)期授課進度計劃表6.1HYPERLINKDIV布局頁面26.2HYPERLINK認(rèn)識Spry217實訓(xùn)HYPERLINK調(diào)整樣式2上機6.3HYPERLINK選擇服務(wù)器和使用虛擬機26.4HYPERLINK申請域名218實訓(xùn)HYPERLINK網(wǎng)站發(fā)布2上機7.1HYPERLINK個人主頁制作27.2HYPERLINK策劃構(gòu)思及設(shè)計流程219實訓(xùn)HYPERLINK頁面布局2上機7.3HYPERLINK制作頁面頭部27.4HYPERLINK制作中間表格內(nèi)容220元旦放假2機動2充周一課22122222復(fù)習(xí)考試6教研組意見課題1.1網(wǎng)頁制作基礎(chǔ)知識教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)能了解網(wǎng)頁制作軟件的特點能力目標(biāo)能掌握網(wǎng)頁制作的基本概念情感目標(biāo)提高學(xué)生團結(jié)合作精神，提高學(xué)生競爭意識教學(xué)重點網(wǎng)頁的組成教學(xué)難點網(wǎng)頁的分類，網(wǎng)址及域名的區(qū)分教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件.多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程課前準(zhǔn)備導(dǎo)入新課講授新課動手實踐課堂小結(jié)作業(yè)布置時間分配510501555教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖課前準(zhǔn)備1、教師自我介紹；2、點名；3、課程介紹4、課堂要求1.自我介紹2.按照花名冊點名3.課程介紹4.統(tǒng)計學(xué)情5.提出期望及要求1.班長統(tǒng)計座次表2.學(xué)生自我介紹3.反應(yīng)學(xué)情4.推薦課代表。使師生盡快互相認(rèn)識，并促使學(xué)生答題了解我們的課程。導(dǎo)入新課本次課是本學(xué)期第一次上課，簡單介紹本課程：1、網(wǎng)頁設(shè)計相關(guān)級別及其薪資待遇2、網(wǎng)頁設(shè)計的就業(yè)方向及其公司類型以提問的方式了解學(xué)生對網(wǎng)頁設(shè)計的認(rèn)知學(xué)生之間相互討論，加深對網(wǎng)頁設(shè)計的認(rèn)識提問跟就業(yè)和薪資有關(guān)的問題，抓住學(xué)生注意力。任務(wù)一講授新課一、網(wǎng)頁設(shè)計介紹1、網(wǎng)站是企業(yè)向用戶和網(wǎng)民提供信息（包括產(chǎn)品和服務(wù)）的一種方式，是企業(yè)開展電子商務(wù)的基礎(chǔ)設(shè)施和信息平臺，離開網(wǎng)站去談電子商務(wù)是不可能的。2、企業(yè)的網(wǎng)站被稱為“網(wǎng)絡(luò)商標(biāo)”，也是企業(yè)無形資產(chǎn)的組成部分，而網(wǎng)站是Internet上宣傳和反映企業(yè)形象和文化的重要窗口。二、網(wǎng)頁設(shè)計的要點1、明確建站目標(biāo)和需求。2、網(wǎng)站主題鮮明。3、網(wǎng)站版式設(shè)計。4、色彩在網(wǎng)站設(shè)計中的作用。5、網(wǎng)站設(shè)計形式及內(nèi)容統(tǒng)一。三、網(wǎng)站設(shè)計級別1、新手入行2、跳槽階段3、穩(wěn)定階段4、大師階段四、網(wǎng)頁設(shè)計公司類型1、門戶游戲類2、企業(yè)部門類3、網(wǎng)站建設(shè)類4、互動設(shè)計類五、網(wǎng)頁三劍客Dreamweaver：可視化頁面設(shè)計、網(wǎng)站管理Fireworks頁面圖象設(shè)計工具Flash動畫制作六、網(wǎng)頁基礎(chǔ)知識1、網(wǎng)頁及網(wǎng)站的區(qū)別（1）網(wǎng)頁是WWW系統(tǒng)中信息的基本單位，簡單來說，就是后綴名為htm的文件。（2）網(wǎng)站是指存放在網(wǎng)絡(luò)服務(wù)器上的完整信息的集合體。2、網(wǎng)頁的組成（1）文字：最直接、通用、容易的溝通方式（2）圖片：網(wǎng)頁的一大特點——圖文并茂（3）動畫：1995年，Sun公司開發(fā)了Java語言，用戶可以創(chuàng)建能調(diào)用圖片和聲音的多媒體應(yīng)用小程序（4）超鏈接：要通過一種方式把各獨立的網(wǎng)頁整和在一起，使之構(gòu)成一有機整體，而這種鏈接頁面的功能叫超鏈接。（5）特殊組件：圖片及動畫可算是最常見的特殊組件。3、主頁Homepage引導(dǎo)訪問者瀏覽網(wǎng)站。index、main、default4、網(wǎng)頁空間在Internet上申請的一個存儲空間，用以存放網(wǎng)頁。5、網(wǎng)址和域名網(wǎng)址：IP地址域名：及IP地址相對應(yīng)，唯一性，善于識別最右邊：國家（中國——cn）其次：機構(gòu)（商業(yè)機構(gòu)——com）再次：子網(wǎng)名稱最左邊：服務(wù)器類別（web服務(wù)器——www）6、網(wǎng)頁的分類靜態(tài)頁面及動態(tài)頁面7、認(rèn)識網(wǎng)站門戶網(wǎng)站：sina個人網(wǎng)站：明星專業(yè)網(wǎng)站：醫(yī)療職能網(wǎng)站：政府簡單介紹網(wǎng)頁知識提問：網(wǎng)頁設(shè)計要點并將學(xué)生分組進行討論講述網(wǎng)站設(shè)計級別，引導(dǎo)學(xué)生對這個行業(yè)向往，并鼓勵學(xué)生向大師階段努力簡單介紹學(xué)生將來從事本行業(yè)的范圍介紹網(wǎng)頁制作需要的軟件給學(xué)生灌輸網(wǎng)頁設(shè)計的基本知識吸收新知識并思考生活中常見網(wǎng)頁設(shè)計知識分組討論，并派出代表來總結(jié)思考自己的定位了解本行業(yè)的現(xiàn)狀認(rèn)識軟件基本組成做筆記，識記教師講述的知識講述基礎(chǔ)知識，為后面學(xué)習(xí)打下基礎(chǔ)加強學(xué)生之間交流溝通能力，加深學(xué)生對網(wǎng)頁設(shè)計要點理解引導(dǎo)學(xué)生了解這個行業(yè)引導(dǎo)學(xué)生了解本行業(yè)從事范圍提前引導(dǎo)學(xué)生認(rèn)識dreamweavercs5為后面軟件學(xué)習(xí)打下基礎(chǔ)這些知識都是學(xué)網(wǎng)頁設(shè)計最基本的基礎(chǔ)知識，學(xué)生基礎(chǔ)知識薄弱，必須了解這些才能學(xué)習(xí)后面的內(nèi)容任務(wù)二動手實踐根據(jù)網(wǎng)頁設(shè)計要點，以小組為單位確定一個網(wǎng)站主題，小組討論需要的步驟以及素材巡回指導(dǎo)，給予學(xué)生幫助小組討論，相互溝通加深學(xué)生對網(wǎng)頁設(shè)計要點學(xué)習(xí)課后作業(yè)按照課堂分組課后進行討論每組確定一個網(wǎng)站主題方向。每組設(shè)計一個網(wǎng)站調(diào)查問卷。課堂小結(jié)網(wǎng)頁設(shè)計師就業(yè)方向網(wǎng)站設(shè)計流程常見網(wǎng)站教學(xué)反思本次課是網(wǎng)頁設(shè)計第一次上課，主要講述一些網(wǎng)頁基礎(chǔ)知識，學(xué)生基礎(chǔ)知識薄弱，需要加強，整體來說計算機班基礎(chǔ)知識要好于電子商務(wù)班板書一、網(wǎng)頁設(shè)計介紹二、網(wǎng)頁設(shè)計的要點三、網(wǎng)站設(shè)計級別四、網(wǎng)頁設(shè)計公司類型五、網(wǎng)頁三劍客六、網(wǎng)頁基礎(chǔ)知識課題1.2網(wǎng)站建設(shè)概述教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)了解做網(wǎng)站的準(zhǔn)備工作，掌握站點的建立。能力目標(biāo)能了解網(wǎng)站開發(fā)的基本流程。能掌握網(wǎng)站開發(fā)的基本原則。能學(xué)會站點的建立及管理。情感目標(biāo)提高學(xué)生團結(jié)合作精神，增強小組合作能力教學(xué)重點站點的建立教學(xué)難點如何規(guī)劃好一個網(wǎng)站教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖課前準(zhǔn)備1、搜集了解網(wǎng)站開發(fā)的基本流程。2、網(wǎng)站設(shè)計、制作過程中的一些原則、注意事項。配合學(xué)生搜索資料及解答疑問網(wǎng)上搜索教師提出問題，了解網(wǎng)站設(shè)計事項培養(yǎng)學(xué)生自主學(xué)習(xí)能力導(dǎo)入新課(5min)網(wǎng)站設(shè)計大致流程是哪些？每組派出一個代表闡述本組課前搜集的資料聽取學(xué)生的觀點并給予一定的知道闡述觀點，組員之間相互討論鍛煉學(xué)生的語言表達能力和分析能力任務(wù)一講授新課(35min)網(wǎng)站設(shè)計流程架構(gòu)內(nèi)容信息架構(gòu)內(nèi)容信息搜集整理資料規(guī)劃網(wǎng)站結(jié)構(gòu)網(wǎng)頁制作網(wǎng)頁制作整合網(wǎng)站效果測試網(wǎng)站上傳網(wǎng)站上傳網(wǎng)站推廣更新維護任務(wù)二分組討論(40min)網(wǎng)站開發(fā)原則確定主題討論：網(wǎng)站是靠什么贏利的？2、規(guī)劃站點結(jié)構(gòu)（1）結(jié)構(gòu)設(shè)計（2）目錄結(jié)構(gòu)設(shè)計（3）形象設(shè)計（4）主頁設(shè)計（5）其他頁面設(shè)計（6）企業(yè)站點設(shè)計（7）為站點設(shè)計目標(biāo)對象訪問率三、網(wǎng)頁版面布局設(shè)計1、版面布局的原則（1）主次分明、中心突出（2）大小搭配、相互呼應(yīng)（3）圖文并茂、相得益彰（4）動靜適度、平衡對稱2、頁面布局的類型（1）“國”字型（2）框架型（3）標(biāo)題正文型（4）封面型（5）綜合型四、規(guī)劃站點1、建立站點目錄2、站點規(guī)劃規(guī)劃站點結(jié)構(gòu)是利用不同的文件夾將不同的網(wǎng)頁內(nèi)容分門別類的保存。3、創(chuàng)建導(dǎo)航草圖五、搜集素材1、搜集并制作素材無論是文字素材還是圖片、動畫素材，都應(yīng)注意其來源是否注明版權(quán)所有。網(wǎng)站素材要為網(wǎng)站主題服務(wù)。2、整理素材原始素材、編輯處理好的素材3、命名規(guī)范六、創(chuàng)建站點1、不使用服務(wù)器技術(shù)2、本地編輯3、不連接到遠程服務(wù)器七、管理站點（1）編輯現(xiàn)有站點（2）刪除已有站點1、確定網(wǎng)站主題的建議2、給網(wǎng)站取名3、提示決定網(wǎng)站的性質(zhì)小組討論，相互溝通加深學(xué)生對網(wǎng)頁設(shè)計要點學(xué)習(xí)課后作業(yè)(5min)根據(jù)這次課的內(nèi)容、注意事項，構(gòu)思一個明確的網(wǎng)站主題，并將站點結(jié)構(gòu)的規(guī)劃用文件夾表示出來課堂小結(jié)(5min)網(wǎng)站設(shè)計確定主題網(wǎng)站設(shè)計流程站點管理教學(xué)反思本次主要講述站點的建立和管理，課程較簡單，學(xué)生掌握較好板書一、網(wǎng)站設(shè)計流程二、網(wǎng)站開發(fā)原則三、網(wǎng)頁版面布局設(shè)計四、規(guī)劃站點五、搜集素材六、創(chuàng)建站點七、管理站點實訓(xùn)課題新建一個網(wǎng)頁實訓(xùn)課時2課時實訓(xùn)目標(biāo)熟悉Dreamweavercs4界面制作簡單網(wǎng)頁實訓(xùn)重點學(xué)會在網(wǎng)頁中輸入文字、插入圖片等掌握簡單代碼的編寫實訓(xùn)難點代碼的編寫實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程內(nèi)容操作要求及步驟任務(wù)一新建網(wǎng)頁1雙擊打開軟件——新建HTML網(wǎng)頁——網(wǎng)頁名字為nes01——輸入以下文字然后保存2、文字要求：標(biāo)題宋體二號藍色正文：五號宋體加粗任務(wù)二新建網(wǎng)頁2制作如下網(wǎng)頁素材見文件夾網(wǎng)頁命名文字為index保存在文件夾中上交給老師操作步驟：新建HTML網(wǎng)頁——輸入文字——將標(biāo)題設(shè)置為36號，藍色，宋體——插入兩根紅色的水平線——插入時間——插入商標(biāo)——插入背景圖片——保存完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次課是學(xué)生第一次上機，制作一個較簡單的網(wǎng)頁，學(xué)生存在對DW界面不熟，操作不熟練等缺點，需加強操作課題2.1編輯和添加文本教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)掌握輸入和編輯文本2、學(xué)會插入文本，掌握設(shè)置文本格式的方法能力目標(biāo)掌握網(wǎng)頁中三種常見列表的創(chuàng)建，及其各自的特點情感目標(biāo)提高學(xué)生自主學(xué)習(xí)和團隊競爭意識教學(xué)重點插入和編輯文本教學(xué)難點創(chuàng)建列表教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件.多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課（5min）提問：在DW中輸入文本和在Word中輸入文本有何區(qū)別？將學(xué)生分組，并提出問題，引導(dǎo)學(xué)生小組之間討論并總結(jié)討論并思考以討論的形式提高學(xué)生之間的交流溝通任務(wù)一插入文本(20min)一、插入文本插入普通文本插入不換行空格插入水平線插入日期和特殊字符二、編輯文本1、基本樣式設(shè)置2、設(shè)置段落格式3、創(chuàng)建列表演示并強調(diào)重點認(rèn)真聽講并記下重點文本插入是基礎(chǔ)知識，為下面任務(wù)二打下基礎(chǔ)任務(wù)二(55min)完成以下網(wǎng)頁實例：引導(dǎo)學(xué)生討論該網(wǎng)頁由哪幾部分組成引導(dǎo)學(xué)生小組組內(nèi)分工，完成小模塊小組討論本實例即是對任務(wù)一的鞏固，也為下一次課打下基礎(chǔ)作業(yè)布置（5min）找一篇文章輸入至頁面中，然后利用所學(xué)知識，對其進行格式編排課堂小結(jié)（5min）插入文本編輯文本板書一、插入文本插入普通文本插入不換行空格插入水平線插入日期和特殊字符二、編輯文本1、基本樣式設(shè)置2、設(shè)置段落格式3、創(chuàng)建列表三、實例操作教學(xué)反思本次課是一個基礎(chǔ)知識內(nèi)容，文本是一個網(wǎng)頁必不可少的內(nèi)容，對網(wǎng)頁設(shè)計至關(guān)重要，學(xué)生必須牢牢掌握文本的各個要點。目前來說學(xué)習(xí)興趣較好。實訓(xùn)課題網(wǎng)站素材處理實訓(xùn)課時2課時實訓(xùn)目標(biāo)掌握創(chuàng)建本地站點和遠程站點學(xué)會修改站點和多站點的管理實訓(xùn)重點站點的管理實訓(xùn)難點站點的管理實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程內(nèi)容操作要求及步驟任務(wù)一創(chuàng)建站點1、熟悉DW界面2、在D盤根目錄創(chuàng)建一個站點名稱為《我的足球網(wǎng)》，本地站點文件夾為jcwww，如下圖所示任務(wù)二設(shè)置默認(rèn)圖像文件夾利用教師所給素材，制作簡單網(wǎng)頁《我的偶像》，素材見文件夾完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次上機主要是讓學(xué)生掌握站點的建立及輸入文本和編輯文本等，學(xué)生操作較好，大部分能完成任務(wù)。實訓(xùn)課題制作簡單網(wǎng)頁實訓(xùn)課時2課時實訓(xùn)目標(biāo)掌握新建網(wǎng)頁、編輯文字、處理圖像新建站點插入水平線、空格、自動更新時間實訓(xùn)重點制作簡單網(wǎng)頁流程實訓(xùn)難點綜合運用HTML工具實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)摗嵱?xùn)過程內(nèi)容操作要求及步驟任務(wù)一足球偶像網(wǎng)頁熟悉DW菜單欄常用界面完成以下簡單網(wǎng)站，素材見素材庫完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次上機內(nèi)容較多，主要考察學(xué)生綜合性的練習(xí)，如圖片的插入，文字的編輯及水平線的插入等，需要學(xué)生對前面的知識非常熟悉，13高12班整體班級學(xué)習(xí)氛圍較好，所有學(xué)生都能按時上交作業(yè)，值得表揚課題2.2添加和編輯圖像教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)掌握圖像裁剪、重新取樣、亮度、銳化的設(shè)置2、掌握圖像屬性設(shè)置能力目標(biāo)掌握運用軟件對圖像處理的能力情感目標(biāo)提高學(xué)生團結(jié)合作精神，提高學(xué)生競爭意識教學(xué)重點圖像的編輯教學(xué)難點圖像的編輯教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件.多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)前面介紹網(wǎng)頁的時候有說過，在保證畫質(zhì)的情況下，圖片的數(shù)據(jù)量越小越好。問題：如果一張圖片數(shù)據(jù)量很大，我們該如何編輯？演示cluo.jpeg這張圖片，分析數(shù)據(jù)量為93k、畫質(zhì)為1024*768規(guī)格的圖片如何更改數(shù)據(jù)量和規(guī)格？分組討論用什么方法來更改數(shù)據(jù)量和規(guī)格提出問題引發(fā)學(xué)生思考，引出這次課的主題任務(wù)一編輯圖片(30min)給出cluo.jpeg和gg.jpeg兩張圖片進行對比，提出任務(wù)：如何從cluo.jpeg變化到gg.jpeg？具體操作步驟：打開DW軟件——插入圖像cluo.jpeg，對圖片屬性設(shè)置如下目標(biāo)值：編輯完成后及原圖像進行對比，會發(fā)現(xiàn)數(shù)據(jù)量、規(guī)格都發(fā)生變化，但瀏覽網(wǎng)頁更友好對圖片寬、高、裁切、重新采樣、銳化等設(shè)置進行演示觀看教師演示，并思考cluo.jpeg變成cluo.jpeg的方法引導(dǎo)學(xué)生學(xué)習(xí)理論的時候思考如何理論運用到實踐任務(wù)二制作翻轉(zhuǎn)圖像(50min)概念：在網(wǎng)頁瀏覽中，有時當(dāng)鼠標(biāo)移到某個圖像上或者單擊時，圖像會變成另外一副圖像。瀏覽時效果：鼠標(biāo)放上去時效果：鼓勵學(xué)生小組討論如何完成翻轉(zhuǎn)圖像效果；給學(xué)生展示翻轉(zhuǎn)圖像做出來的效果，然后講解如何才能完成這個效果小組討論如何完成該效果并進行嘗試課堂小結(jié)(5min)如何編輯圖像制作翻轉(zhuǎn)圖像效果板書設(shè)計一、編輯圖像重新采樣裁剪、銳化二、翻轉(zhuǎn)圖像制作效果教學(xué)反思本次教學(xué)學(xué)生較感興趣，特別是鼠標(biāo)經(jīng)過的圖像，學(xué)生完成得較好，值得鼓勵課題2.3創(chuàng)建超級鏈接教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)掌握創(chuàng)建超鏈接的方法掌握相對鏈接和絕對鏈接的區(qū)別創(chuàng)建錨點鏈接能力目標(biāo)提高學(xué)生學(xué)習(xí)創(chuàng)作能力情感目標(biāo)提高學(xué)生團結(jié)合作精神，提高學(xué)生競爭意識教學(xué)重點正確認(rèn)識路徑理解相對鏈接和絕對鏈接的區(qū)別教學(xué)難點添加超鏈接、相對路徑、絕對路徑教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件.多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)每次瀏覽網(wǎng)頁的時候點擊某個文字或者圖片，能自動跳轉(zhuǎn)到另一個頁面，提問：這樣的鏈接形式叫什么？如何實現(xiàn)？進入新浪網(wǎng)給學(xué)生演示超級鏈接的效果并進行提問觀看效果并討論如何才能實現(xiàn)該效果以提問且學(xué)生較熟悉的瀏覽網(wǎng)頁的方式吸引學(xué)生的注意任務(wù)一創(chuàng)建超級鏈接（20min）一、新建站點jcww，并在站點內(nèi)新建默認(rèn)圖像文件夾images，將網(wǎng)頁Index.HTML里的“我及足球”鏈接到news.HTML，目標(biāo)為-blank；“足球新聞”鏈接到“逢入京使.HTML”，目標(biāo)為-new；“足球明星”鏈接到“我及足球網(wǎng).HTML”，目標(biāo)為-self。二、對比每個目標(biāo)不同，網(wǎng)頁新建窗口不同并進行總結(jié)給學(xué)生演示如何插入鏈接；演示不同目標(biāo)新建窗口的區(qū)別觀看教師演示，并思考-new、-blank、-self幾個目標(biāo)值窗口的區(qū)別讓學(xué)生熟悉DW添加超級鏈接的界面任務(wù)二相對鏈接和絕對鏈接(20min)任務(wù)三錨點鏈接(35min)區(qū)別：相對鏈接是指鏈接的地址是本站點之內(nèi)的對象；絕對鏈接是指鏈接的地址是遠程對象，用域名或IP作為地址一、概念：在本頁進行鏈接的叫做錨點，一般在長篇的文章或技術(shù)文檔中是使用，鏈接到某個特殊的段落。二、打開第4章/4-3/jieshao.html網(wǎng)頁，演示錨點鏈接效果演示教材P60實例演示如何插入錨點鏈接思考并正確理解相對鏈接和絕對鏈接概念觀看教師演示并思考錨點鏈接的應(yīng)用正確理解相對鏈接和絕對鏈接，為下面的學(xué)習(xí)打下基礎(chǔ)錨點鏈接應(yīng)用比較廣泛，學(xué)生需要掌握并應(yīng)用課堂小結(jié)(5min)頁面及頁面之間的超鏈接相對鏈接和絕對鏈接錨點鏈接（本頁之間鏈接）作業(yè)布置(5min)網(wǎng)上查找哪些頁面常用頁面及頁面鏈接，哪些是用錨點鏈接并總結(jié)利用教材第4章/4-3/jieshao.html的素材，自己動手創(chuàng)建錨點鏈接板書創(chuàng)建超級鏈接的方法及步驟相對鏈接和絕對鏈接創(chuàng)建錨點鏈接教學(xué)反思本次課主要介紹超鏈接的常用方法，超鏈接在學(xué)生上網(wǎng)中隨處可見，較易理解，學(xué)生之間的討論也非常激烈，較好。實訓(xùn)課題圖像處理和創(chuàng)建超鏈接實訓(xùn)課時2課時實訓(xùn)目標(biāo)學(xué)會利用DW處理圖像掌握創(chuàng)建超級鏈接的方法理解相對鏈接和絕對鏈接概念實訓(xùn)重點圖片處理超級鏈接實訓(xùn)難點超級鏈接的使用實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程操作要求及步驟任務(wù)一處理圖像將圖片6.jpeg修改為尺寸為240*160，數(shù)據(jù)量設(shè)置為8K左右（6-11k都可以）并進行裁剪和銳化等設(shè)置，熟悉圖片處理幾個設(shè)置，設(shè)置完成后以網(wǎng)頁的形式保存，保存在文件夾中，保存名稱為“xiugai.html”任務(wù)二超級鏈接將教師發(fā)送的Index.HTML網(wǎng)頁進行編輯，將“我及足球”四個字鏈接到“我及足球網(wǎng).html”，目標(biāo)為-self；將“足球新聞”四個字鏈接到“逢入京使.html”，目標(biāo)為-blank；將“足球明星”四個字鏈接到“news.html”，目標(biāo)為-new。修改頁面屬性：在頁面屬性對話框中，設(shè)置鏈接選項中的大小為16像素，鏈接顏色為“#6666cc”，變換圖像顏色為“#ff6600”，已訪問鏈接為“#663366”，活動鏈接為“#99cc00”，下劃線樣式為“僅在變換圖像時顯示下劃線”。設(shè)置的對話框如下圖所示：完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實習(xí)內(nèi)容較多，大部分學(xué)生能在規(guī)定時間內(nèi)完成任務(wù)，較好。實訓(xùn)課題跳轉(zhuǎn)菜單實訓(xùn)課時2課時實訓(xùn)目標(biāo)掌握圖像熱點鏈接的使用掌握腳本鏈接掌握鏈接檢查器的使用實訓(xùn)重點路徑的正確使用實訓(xùn)難點鏈接的運用及鏈接檢查器的使用實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)摗嵱?xùn)過程操作要求及步驟任務(wù)一創(chuàng)建圖像熱點鏈接在地圖中創(chuàng)建熱點鏈接任務(wù)二制作跳轉(zhuǎn)菜單打開news.HTML網(wǎng)頁，在如下圖所示的位置插入圖片，圖片為“鼠標(biāo)經(jīng)過的圖片”，鏈接到本頁的“冠軍杯新聞”處（提示：利用錨點鏈接）打開“jieshao.html”網(wǎng)頁，在下載資源文本中將教師提供的“qq.rar”放入站點，做成的效果是點擊“下載資源”就能下載“qq.rar”，同理在“聯(lián)系我們”中設(shè)置郵件下載完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實習(xí)內(nèi)容較多，大部分學(xué)生能在規(guī)定時間內(nèi)完成任務(wù)，較好。課題2.4使用表格布局頁面教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、了解表格在網(wǎng)頁設(shè)計中的作用。2、掌握網(wǎng)頁中表格的制作方法、表格屬性的設(shè)置方法以及單元格屬性的設(shè)置方法，能夠在單元格中正確插入文字和圖片。3、能夠根據(jù)網(wǎng)頁設(shè)計內(nèi)容，正確布局表格的結(jié)構(gòu)，掌握表格嵌套的設(shè)計方法。能力目標(biāo)1、利用對比學(xué)習(xí)，培養(yǎng)學(xué)生知識遷移的能力。2、通過用表格結(jié)構(gòu)設(shè)計網(wǎng)頁，使學(xué)生進一步理解表格的作用、功能及網(wǎng)頁設(shè)計方法的多樣性，培養(yǎng)學(xué)生的發(fā)散思維能力情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點1、了解表格在網(wǎng)頁設(shè)計中的重要作用。2、掌握插入、編輯表格的方法及表格的屬性設(shè)置。3、掌握單元格屬性的設(shè)置。教學(xué)難點表格的嵌套在網(wǎng)頁設(shè)計中的應(yīng)用教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件.多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)（1）展示兩個頁面并進行比較：一個使用表格布局，表格邊框隱藏，其頁面工整，文本、圖片擺放對稱，具有一定的規(guī)律；另一個頁面凌亂，圖文混雜，擺放雜亂。問題1：你喜歡那個頁面的布局？問題2：用什么方法可以達到第二個頁面的效果？展示并引導(dǎo)學(xué)生思考學(xué)生仔細觀察并比較兩個網(wǎng)頁，討論、交流，回顧Word中學(xué)習(xí)過的表格，領(lǐng)悟表格在Dreamweaver中的作用。通過對比學(xué)習(xí)，培養(yǎng)學(xué)生知識遷移的能力。任務(wù)一網(wǎng)頁框架(25min)一、仿照網(wǎng)頁3的樣式，制作一個網(wǎng)頁框架。在學(xué)生自主探究的基礎(chǔ)上，教師總結(jié)插入表格的一般方法。并插入一個2行1列，表格寬度800像素，邊框粗細0像素的表格。演示如何插入表格并對表格的設(shè)置分析網(wǎng)頁3，找出其中使用的表格，仿照插入圖像的方法，探索插入表格的方法。插入表格，通過實際操作強化對表格屬性的認(rèn)識。引導(dǎo)學(xué)生學(xué)習(xí)理論的時候思考如何理論運用到實踐動手分析和進行創(chuàng)意設(shè)計，培養(yǎng)學(xué)生的模仿以及創(chuàng)新能力任務(wù)二表格合并和拆分(20min)二、在任務(wù)一的基礎(chǔ)上，探索表格基本屬性：合并及拆分單元格；單元格的寬度及高度；用實例來演示如何合并和拆分單元格根據(jù)需要，插入圖片，在第二行拆分為兩列，左邊放文字，右邊放圖通過實例，培養(yǎng)學(xué)生分析問題、解決問題的能力。任務(wù)三表格嵌套(30min)表格的嵌套。在大表中插入一個小的表格，這是創(chuàng)建復(fù)雜表格樣式的有效方法。要提示學(xué)生不要嵌套過多。展示幾種常見的圖文混排樣式，讓學(xué)生選擇自己喜歡的一種完成網(wǎng)頁。完善網(wǎng)頁，制作完成的同學(xué)把網(wǎng)頁通過FTP上傳。讓學(xué)生自主發(fā)揮，充分展示個性風(fēng)采課堂小結(jié)(5min)網(wǎng)頁框架和表格基本操作表格的合并和拆分表格嵌套課堂作業(yè)(5min)完成教材第五章/Index.html的表格教學(xué)反思通過表格的嵌套及分析，對頁面進行布局。需要加強學(xué)生對表格合并和拆分的運用實訓(xùn)課題表格布局實例分析實訓(xùn)課時2課時實訓(xùn)目標(biāo)能運用表格為頁面布局能掌握表格的嵌套操作

能做出“超越公司簡介”頁面。實訓(xùn)重點1、掌握插入、編輯表格的方法及表格的屬性設(shè)置。2、掌握單元格屬性的設(shè)置。實訓(xùn)難點表格的嵌套在網(wǎng)頁設(shè)計中的應(yīng)用實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程操作要求及步驟任務(wù)一創(chuàng)建圖像熱點鏈接制作如下圖所示的界面：操作要求：top區(qū)（1）一行三列：

788px=128+540+120Logo+Banner+主頁常用選項（2）第三列嵌套三行兩列表格：

120px=30+90

小圖標(biāo)+文本選項2、menu區(qū)（1）一行兩列：788px=148+640顯示當(dāng)前日期+導(dǎo)航條（2）第二列嵌套1行17列表格：

奇數(shù)列單元格輸入欄目文本，寬65px；偶數(shù)列單元格輸入“|”，寬為6px。3、main區(qū)（1）2行3列：788px寬，500px高788=150+10+628500=5+495（2）A、maintop區(qū)合并單元格（3）B、mainleft區(qū)

嵌套13行1列表格：145px寬，2px間距第1行及第7行：高25px

第2-6行：高36px，輸入文本第8-13行：高40px，插入圖片（3）C、mainmiddle區(qū)空單元格（4）D、mainright區(qū)

嵌套3行1列表格：495px高495=30+375+90第一行：輸入文本

第二行：嵌套1行2列表格(628px=304+324）

第一列：輸入文本

第二列：嵌套2行1列表格

300px寬，右對齊

375px高=220+160

第1行：插入圖片

第2行：嵌套3行5列表格

高160=30+65+65

寬300=80+30+80+30+80

第三行：鼠標(biāo)經(jīng)過圖像4、bottom區(qū)3行1列：

788px寬，45px高第一行：水平線

第二行：版權(quán)信息

第三行：聯(lián)系方式完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)表格布局是最常見的一種布局方式，本次實訓(xùn)學(xué)生較積極，特別是13高12班同學(xué)學(xué)習(xí)氛圍特別好。課題2.5使用框架布局頁面教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、能掌握框架的基本操作。2、能理解框架技術(shù)的實質(zhì)。能力目標(biāo)能用框架布局頁面情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點框架的基本操作

教學(xué)難點用框架為頁面布局教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件.多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)在學(xué)習(xí)過表格布局后，我們可以做一些常規(guī)的頁面布局了，但有些特殊效果我們卻無法實現(xiàn)。如圖所示的網(wǎng)頁：今天我們來學(xué)習(xí)另一種頁面布局技術(shù)——框架。展示框架頁面給學(xué)生，引發(fā)學(xué)生思考預(yù)習(xí)并思考框架頁面布局通過實例來展示，引發(fā)學(xué)生思考特殊效果如何實現(xiàn)，培養(yǎng)學(xué)生積極思考問題的能力任務(wù)一基本知識(35min)一、基本概念：框架是一種網(wǎng)頁布局技術(shù)。

二、創(chuàng)建框架及框架集1、手動設(shè)計2、插入預(yù)定義框架三、創(chuàng)建嵌套框架四、選擇框架和框架集1、在編輯區(qū)中選擇2、在框架面板中選擇五、刪除框架六、保存框架及框架集文件加強學(xué)生對框架布局的理解并進行簡單操作認(rèn)真聽講并對概念進行消化理解學(xué)生只有在牢固的掌握了基本概念后才能為任務(wù)二的學(xué)習(xí)打下基礎(chǔ)任務(wù)二實例操作(40min)完成如下圖所示的頁面：要求如下：topFrame：

高：100px

表格：2x2，寬-788px，高-100px

高：100=75+25

寬：788=128+660第一行：Logo+Banner

第二行：當(dāng)前頁位置信息+導(dǎo)航欄

導(dǎo)航欄：1x7表格

寬：660px

高：25px

字號：9pt

行高：14ptmainFrame：

表格：2x2

寬：788Px，高：400Px

邊框：5px，間距：5px

表格：3x1

寬：788px，高：45px

邊框：0px，間距：0px將學(xué)生分7組，并引導(dǎo)學(xué)生分組討論如何完成如圖所示的效果討論如何才能實現(xiàn)如圖所示的效果并總結(jié)通過實例，培養(yǎng)學(xué)生分析問題、解決問題的能力。課堂小結(jié)(5min)框架基本概念二、創(chuàng)建框架及框架集三、創(chuàng)建嵌套框架四、選擇框架和框架集五、刪除框架六、保存框架及框架集文件課后作業(yè)(5min)設(shè)計一系列框架型頁面，然后將之實現(xiàn)。要求結(jié)合超鏈接的相關(guān)知識。

教學(xué)反思本次主要講述框架和框架集布局頁面，運用實例學(xué)生加深了對框架的理解，運用起來得心應(yīng)手。14高31班學(xué)生學(xué)習(xí)氛圍待加強實訓(xùn)課題框架布局實例分析實訓(xùn)課時2課時實訓(xùn)目標(biāo)能掌握布局表格和布局單元格的基本操作。能在布局模式下對頁面進行整體布局。實訓(xùn)重點掌握布局表格和布局單元格的基本操作。實訓(xùn)難點項目的實現(xiàn)實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程操作要求及步驟任務(wù)一利用框架排版步驟1選擇［文件］菜單欄中的［新建］命令，創(chuàng)建一個新的頁面，并將其命名為“個人主頁”。步驟2選擇［插入］工具欄中［布局］任務(wù)欄中的［框架］命令，單擊按鈕，選擇下拉菜單的“頂部和嵌套的左側(cè)框架”命令。步驟3彈出［框架標(biāo)簽輔助功能屬性］對話框，將網(wǎng)頁中框架的各個部分進行命名。步驟4選擇［窗口］菜單欄中［框架］命令。步驟5右側(cè)的面板中就加入了［框架］面板，選中“topFrame”框架進行編輯。步驟6頁面下方出現(xiàn)了“topFrame”框架的［屬性］面板。對“topFrame”框架進行編輯。步驟7選中“mainFrame”框架進行編輯，頁面下方出現(xiàn)了“mainFrame”框架的［屬性］面板，對“mainFrame”框架進行編輯。步驟8選中“l(fā)eftFrame”框架進行編輯，頁面下方出現(xiàn)了“l(fā)eftFrame”框架的［屬性］面板，對“l(fā)eftFrame”框架進行編輯。步驟9選擇［文件］菜單欄中的［保存全部］命令，對文件進行保存。步驟10彈出保存整體文件的對話框，為文件命名為“index.html”。步驟11對各個框架部分進行保存，為各個框架進行命名。步驟12單擊F12，在瀏覽器中預(yù)覽效果。任務(wù)二創(chuàng)建框架集創(chuàng)建框架集，可以自己設(shè)計，也可以從預(yù)定義的框架集中選擇，還可以修改一個已存在的Dreamweaver文件來創(chuàng)建。實驗內(nèi)容：步驟1選擇［修改］菜單欄中的［框架集］命令。步驟2根據(jù)需要在其子菜單中選擇任意一個分割命令。步驟3若要刪除一個子框架，將其邊框拖至頁面或其父框架之外即可。完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實訓(xùn)學(xué)生需要的掌握的內(nèi)容較多，對于框架布局的位置要準(zhǔn)確掌握，難度較大課題3.3添加動畫教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、掌握在網(wǎng)頁中添加各種動態(tài)元素2、掌握Flash屬性設(shè)置能力目標(biāo)1、學(xué)會區(qū)分源文件和影片文件格式2、掌握在網(wǎng)頁中插入各種Flash元素3、能為網(wǎng)頁添加音視頻元素。情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點添加flash的具體操作

教學(xué)難點規(guī)劃一個多媒體網(wǎng)站導(dǎo)航條

教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)試想網(wǎng)頁中只有文字和圖片，則網(wǎng)頁跟雜志報紙還有什么區(qū)別呢？動態(tài)元素能夠更加豐富頁面的效果，是網(wǎng)頁是一大特色。注意：不要把動態(tài)元素和動態(tài)頁面劃上等號。將本次課的作品展示給學(xué)生，學(xué)生在欣賞精美網(wǎng)頁的同時思考如何完成該作品欣賞作品并思考通過作品來展示，引發(fā)學(xué)生思考如何實現(xiàn)，培養(yǎng)學(xué)生積極思考問題的能力任務(wù)一基本知識(35min)一、flash文件基本知識1、Flash源文件：*.fla2、Flash影片文件：*.swf二、添加flash動畫文件Flash動畫是一種基于矢量格式的多媒體動畫元件，它體積小，其擴展名為.swf。Flash動畫被廣泛應(yīng)用于網(wǎng)頁中。操作步驟：1.光標(biāo)定位2.插入flash文件3.保存、預(yù)覽三、添加flash按鈕Dreamweaver中內(nèi)置了一些flash按鈕，用戶可以很方便將他們添加到網(wǎng)頁中。注意：在頁面中添加flash按鈕和flash文本之前必須先保存網(wǎng)頁。操作步驟：1.光標(biāo)定位2.插入flash按鈕3.設(shè)置按鈕屬性4.保存、預(yù)覽四、添加flash文本插入—媒體—Flash文本五、為網(wǎng)頁添加音頻插入—媒體—插件教授新知識，為任務(wù)二的完成做準(zhǔn)備吸收動畫新知識讓學(xué)生吸收新知識，為后面的實例操作打下基礎(chǔ)任務(wù)二拓展訓(xùn)練(40min)要求：制作如下圖所示網(wǎng)頁，插入三行一列表格，插入Flash動畫要求動畫大小寬高為400*300，第二行插入圖片，第三行輸入文字并排版，最后得到的結(jié)果如下圖所示：課堂小結(jié)(5min)添加多媒體元素使頁面具有動態(tài)效果插入Flash按鈕和Flashpaper插入播放器課后作業(yè)(5min)用Flash按鈕或文本制作一個導(dǎo)航條，然后為頁面添加背景音樂。教學(xué)反思學(xué)生對動畫、音視頻有敏銳的觸覺，學(xué)習(xí)起來頗有興致。實訓(xùn)課題添加音頻和視頻實訓(xùn)課時2課時實訓(xùn)目標(biāo)掌握插入表格、圖片、背景圖片設(shè)置掌握插入Flash文本、Flashpaper、Flash視頻、背景音樂等實訓(xùn)重點Flash屬性、Flash元素實訓(xùn)難點Flash元素實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)摗嵱?xùn)過程操作要求及步驟任務(wù)制作Flash網(wǎng)頁要求：（利用DWcs3版本）一、插入swf動畫新建站點和默認(rèn)圖像文件夾新建網(wǎng)頁文件Flash.html，插入1行2列的表格，表格寬度720px，邊框粗細、表格間距、表格邊距都為0.選擇第二個單元格設(shè)置寬度為600px，高度設(shè)置為100px。然后在第一個單元格插入logo.jpeg，并且水平和垂直居中；在第二個單元格里插入背景圖片（選擇單元格——點擊拆分——找到td——在td后空一格——選擇background——選擇bj.jpeg圖片插入），并將圖片設(shè)置為寬高600px，100px。保存在第二個單元格插入005的Flash，并將Flash設(shè)置為寬高600px，100px規(guī)格，并設(shè)置Flash為透明二、插入Flash按鈕：1、利用DWcs3版本插入導(dǎo)航欄：插入一行一列的表格，寬度為720px，邊框粗細、表格間距、表格邊距都為0，居中對齊。然后點擊插入Flash按鈕，選擇下圖所示的按鈕并輸入文字，如圖所示：2、然后在導(dǎo)航欄的下一行插入一行2列的表格，寬度為720px，邊框粗細、表格間距、表格邊距都為0，居中對齊。左邊單元格設(shè)置為寬200px，然后再嵌套一個表格，3行1列寬度為100%，邊框粗細、表格間距、表格邊距都為0，居中對齊。右邊單元格插入一行一列寬度為98%的單元格居中對齊，邊框為1，顏色為#FF00FF，然后在此表格中插入Flash文本，字體為宋體，大小30px，輸入文本：我的個性空間，顏色為#FF0000，滾動顏色設(shè)置為：#00FF00，另存為wen.swf，如下圖所示：插入Flashpaper：首先在電腦上安裝Flashpaper軟件，然后將“Flash.doc”Word文件轉(zhuǎn)換為Flash.swf文件，將文件插入到網(wǎng)頁中，設(shè)置Flashpaper寬高分別為480和400px三、插入播放器1、在左邊的三個單元格范圍中，將光標(biāo)放入第一個單元格，點擊插入媒體中的圖像查看器，將Flash命名為abc，并將播放器設(shè)置為寬高180,1352、點擊右邊的Flash元素，對圖片進行設(shè)置，選擇選項imageURLs（表示圖片的位置），選擇你需要展播的圖片，showControls（顯示控制條）設(shè)置為否，slideAutoPlay（自動播放）設(shè)置為是，slideDelay（每張圖切換停留時間）設(shè)置為2，slideloop（循環(huán)播放）是3、在左邊第二個單元格插入媒體——插件，插入sound聲音，設(shè)置插件高寬分別為180,41，參數(shù)設(shè)置為，autostartfalse4、插入背景音樂完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實訓(xùn)內(nèi)容較多，網(wǎng)頁添加音頻和視頻使得網(wǎng)頁內(nèi)容更加豐富多彩，學(xué)生興趣較濃課題4.1編輯和創(chuàng)建APDIV元素教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、掌握層的概念2、掌握如何編輯APDIV層3、掌握層的嵌套能力目標(biāo)1、掌握層的基本操作。2、能將層和時間軸聯(lián)系起來制作漂浮效果情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點層的基本操作教學(xué)難點層的高級應(yīng)用教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課（5min）層是一種HTML頁面元素，可被放在頁面的任意位置，在網(wǎng)頁排版定位方面具有獨特優(yōu)勢。展示課前準(zhǔn)備的層的疊加，引導(dǎo)學(xué)生思考：如何制作這樣的網(wǎng)頁？欣賞作品并思考通過作品展示，引出本次課的主題任務(wù)一基本知識（20min）任務(wù)二綜合實例（25min）一、創(chuàng)建APDIV元素什么是ApDiv？AP元素（絕對定位元素）,是一種HTML網(wǎng)頁元素，一般稱為“層”。即網(wǎng)頁內(nèi)容的容器，包含文本，圖像或其他任何可以在HTML文檔正文中放入的內(nèi)容。且可以精確定位在網(wǎng)頁中的任何地方。二、編輯APDIV元素1、調(diào)整層的大小2、層的層次關(guān)系3、層的首選設(shè)置4、層的對齊三、制作如圖所示的網(wǎng)頁強調(diào)重點：1、作為容器，可以放置其他網(wǎng)頁元素。2、靈活定位。分組讓學(xué)生討論如何完成左圖所示的任務(wù)：如何制作如圖立體式的疊加圖片如何繪制大小一致且背景顏色為粉色的圖層？理解APDIV元素并做好筆記分組討論教師提出的兩個任務(wù)并提出解決方案主要是以基本知識講解為主，為任務(wù)二的綜合實例打下理論基礎(chǔ)鞏固任務(wù)一所學(xué)的理論知識任務(wù)三（30min）四、層的可見性設(shè)置1、AP面板的使用（選擇、命名、隱藏、次序）2、層的可見性3、簡單的層特效五、實例要求：在上述網(wǎng)頁制作的基礎(chǔ)上，將“網(wǎng)”“制”分別修改成“開”“關(guān)”，并對其隱藏和顯示屬性設(shè)置，點擊控制圖片的顯示和隱藏將做好的效果圖演示給學(xué)生并要求學(xué)生分組討論如何實現(xiàn)該要求討論并嘗試操作鞏固學(xué)生對行為屬性的理解課堂小結(jié)（5min）如何創(chuàng)建APDIV層編輯APDIV層實例操作課后作業(yè)（5min）制作如圖所示的網(wǎng)頁，提示：利用層的布局教學(xué)反思通過編輯和創(chuàng)建APDIV層來實現(xiàn)圖片的立體感，豐富了網(wǎng)頁內(nèi)容，通過實例演示加深了學(xué)生對ap層的認(rèn)識課題4.2層的可見性設(shè)置教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、掌握AP層的創(chuàng)建及屬性2、掌握AP層的可見性操作能力目標(biāo)1、學(xué)會利用AP層制作立體效果網(wǎng)頁2、掌握AP層絕對定位應(yīng)用情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點層的基本操作層的應(yīng)用及嵌套教學(xué)難點AP元素教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)前面所學(xué)的表格和圖片都是二維的，如何我們先建立了三個層，每個層都有一個圖片，他們是層疊的效果，現(xiàn)在要添加兩個按鈕，使得我們點擊一個按鈕可以隱藏層，點擊另一個按鈕可以顯示層，這是怎么做的呢？展示三維圖片效果欣賞作品并思考通過作品來展示，引發(fā)學(xué)生思考如何實現(xiàn)，培養(yǎng)學(xué)生積極思考問題的能力任務(wù)一基本知識(20min)一、AP元素面板1、層的可見性2、防止層重疊演示觀看教師演示讓學(xué)生吸收新知識，為后面的實例操作打下基礎(chǔ)任務(wù)二拓展訓(xùn)練(55min)二、制作如下圖所示的網(wǎng)頁效果：要求點擊“隱藏”時，home隱藏；點擊“顯示”時，home顯示操作步驟如下所示：如圖所示是先建立兩個按鈕，一個是“隱藏”一個是“顯示”鼠標(biāo)點擊想要隱藏的曾，然后我們在屬性欄，將可見性設(shè)置為hidden，也就是隱藏層在窗口菜單中，打開行為窗口選中“顯示”按鈕，在行為窗口，點擊添加按鈕，在打開的菜單中，選擇【顯示--隱藏元素】打開顯示隱藏元素對話框，選擇剛才隱藏了的那個曾apdiv4，點擊下面的顯示按鈕。然后點擊確定接著選中隱藏按鈕在行為窗口點擊添加按鈕，然后選擇【顯示隱藏元素】在打開的對話框中，選中apdiv4，點擊下面的隱藏，然后點擊確定按鈕。預(yù)覽引導(dǎo)學(xué)生運用行為來實現(xiàn)學(xué)生分組討論后得出結(jié)論，并指派一名代表嘗試完成實例，并進行補充分組討論如何實現(xiàn)該功能推薦代表完成實例培養(yǎng)學(xué)生積極創(chuàng)新及小組溝通能力激發(fā)學(xué)生自學(xué)能力課堂小結(jié)(5min)AP元素面板隱藏和顯示行為課后作業(yè)(5min)制作立體三維網(wǎng)頁效果，并添加顯示和隱藏行為教學(xué)反思通過運用層的隱藏/顯示屬性及事件onclick的靈活運用，制作常見特效，學(xué)生較感興趣，較好。實訓(xùn)課題DIV及表格的轉(zhuǎn)換實訓(xùn)課時2課時實訓(xùn)目標(biāo)能掌握布局表格和布局單元格的基本操作。能在布局模式下對頁面進行整體布局。實訓(xùn)重點掌握布局表格和布局單元格的基本操作。實訓(xùn)難點項目的實現(xiàn)實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程操作要求及步驟任務(wù)一利用框架排版步驟1選擇［文件］菜單欄中的［新建］命令，創(chuàng)建一個新的頁面，并將其命名為“個人主頁”。步驟2選擇［插入］工具欄中［布局］任務(wù)欄中的［框架］命令，單擊按鈕，選擇下拉菜單的“頂部和嵌套的左側(cè)框架”命令。步驟3彈出［框架標(biāo)簽輔助功能屬性］對話框，將網(wǎng)頁中框架的各個部分進行命名。步驟4選擇［窗口］菜單欄中［框架］命令。步驟5右側(cè)的面板中就加入了［框架］面板，選中“topFrame”框架進行編輯。步驟6頁面下方出現(xiàn)了“topFrame”框架的［屬性］面板。對“topFrame”框架進行編輯。步驟7選中“mainFrame”框架進行編輯，頁面下方出現(xiàn)了“mainFrame”框架的［屬性］面板，對“mainFrame”框架進行編輯。步驟8選中“l(fā)eftFrame”框架進行編輯，頁面下方出現(xiàn)了“l(fā)eftFrame”框架的［屬性］面板，對“l(fā)eftFrame”框架進行編輯。步驟9選擇［文件］菜單欄中的［保存全部］命令，對文件進行保存。步驟10彈出保存整體文件的對話框，為文件命名為“index.html”。步驟11對各個框架部分進行保存，為各個框架進行命名。步驟12單擊F12，在瀏覽器中預(yù)覽效果。任務(wù)二創(chuàng)建框架集創(chuàng)建框架集，可以自己設(shè)計，也可以從預(yù)定義的框架集中選擇，還可以修改一個已存在的Dreamweaver文件來創(chuàng)建。實驗內(nèi)容：步驟1選擇［修改］菜單欄中的［框架集］命令。步驟2根據(jù)需要在其子菜單中選擇任意一個分割命令。步驟3若要刪除一個子框架，將其邊框拖至頁面或其父框架之外即可。完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實習(xí)內(nèi)容較多，操作性較強，學(xué)生需加強練習(xí)課題4.3晃動的圖片教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、理解行為、事件、動作的概念2、掌握添加行為應(yīng)用實例能力目標(biāo)1、學(xué)會區(qū)分源文件和影片文件格式2、應(yīng)用行為情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點1、行為面板使用2、常見事件OnMouseOver鼠標(biāo)經(jīng)過OnMouseout鼠標(biāo)離開OnLoad打開OnUnload關(guān)閉3、設(shè)置文本教學(xué)難點行為面板使用教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)如何制作彈出信息窗口？如何制作晃動圖片？如何制作彈出窗口？演示彈出信息、晃動圖片、彈出窗口網(wǎng)頁，激發(fā)學(xué)生興趣欣賞教師的展示并分組討論如何實現(xiàn)？通過效果展示激發(fā)學(xué)生興趣任務(wù)一基本知識(20min)一、晃動的圖片1）什么是行為？“行為”可以說是Dreamweaver中最具特色的功能之一，它提供了很多實用的動作，每個動作可以完成特定的任務(wù)，為網(wǎng)頁添加不少特殊效果。二、行為面板的使用1、1、打開行為面板（快捷方式：Shift+F4）2、認(rèn)識行為面板顯示設(shè)置事件顯示所有事件添加行為刪除事件移動事件順序命令控制菜單三、設(shè)置文本行為1、狀態(tài)欄文字2、設(shè)置文本域文字（注意使用動作的對象必須要有個ID）講解基礎(chǔ)知識并強調(diào)重點聽講并做好筆記為任務(wù)二實例制作打下基礎(chǔ)任務(wù)二拓展訓(xùn)練(55min)三、實例制作1、制作晃動圖片，鼠標(biāo)經(jīng)過時（onmouseover）晃動，鼠標(biāo)離開后（onmouseout）不晃動技巧：添加行為的時候一般遵循3個步驟：選擇對象添加動作調(diào)整事件2、制作彈出窗口（利用添加行為里的打開瀏覽器窗口）3、制作彈出信息，彈出信息為“歡迎訪問本站點”，事件為onload4、設(shè)置文本行為課堂小結(jié)(5min)彈出文字信息制作彈出窗口制作晃動圖片設(shè)置文本行為課后作業(yè)(5min)網(wǎng)上搜索彈出信息網(wǎng)頁及廣告窗口，研究如何制作教學(xué)反思本次主要應(yīng)用行為制作晃動的圖片的效果，操作較容易，學(xué)生掌握較好，但是事件onclick和onmouseover及onmouseout的掌握學(xué)生待加強。實訓(xùn)課題交換圖像實訓(xùn)課時2課時實訓(xùn)目標(biāo)掌握AP元素面板的使用理解原始檔圖像和交換圖像概念實訓(xùn)重點表格的布局圖像交換設(shè)置實訓(xùn)難點圖像交換實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)摗嵱?xùn)過程操作要求及步驟任務(wù)交換圖像新建站點和默認(rèn)圖像文件夾交換圖片實訓(xùn)新建網(wǎng)頁“jh.HTML”將頁面背景設(shè)置為黑色插入2行1列寬度為700px的表格，邊框粗細0，邊距10，間距0在第一行插入圖片bj2.jpeg圖片并居中，并將圖片的ID命名為pm在第二行里再嵌套一個一行三列的表格，寬度為100%，邊框粗細0，邊距10，間距0，背景為灰色，然后分別插入教師所給素材1.jpeg、2.jpeg、3.jpeg，并將素材都設(shè)置寬高為200,30選擇1.jpeg并將其添加行為——交換圖像，如下圖所示：同理，將2.jpeg、3.jpeg添加行為，保存預(yù)覽完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實訓(xùn)室交換圖像，主要是一個小項目的制作，通過項目的制作讓學(xué)生深刻理解交換圖像的應(yīng)用，較好。實訓(xùn)課題拼圖游戲?qū)嵱?xùn)課時2課時實訓(xùn)目標(biāo)熟悉AP元素面板掌握添加拖動AP元素實訓(xùn)重點拖動AP元素面板實訓(xùn)難點項目的實現(xiàn)實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程操作要求及步驟任務(wù)一拼圖游戲拼圖游戲?qū)嵱?xùn)新建網(wǎng)頁pt.HTML，將頁面背景設(shè)置為圖片back.jpeg繪制APDIV層，寬高分別為220,220，背景顏色為#FFCCFF另外繪制四個APDIV層，寬高分別為110，110，背景顏色為#FFCCFF，并將教師準(zhǔn)備的素材1.jpeg、2.jpeg、3.jpeg、4jpeg分別插入四個層利用輔助線將層對齊將四個層分別移動到大層里，將花朵拼湊整齊，如圖所示分別將四個小層添加行為——拖動ap元素，設(shè)置如圖所示：7、四個小層都設(shè)置完成后再將小層拖出大層，順序打亂，保存完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次課通過拼圖游戲的制作，讓學(xué)生深刻理解AP層在DW的應(yīng)用，運用AP屬性設(shè)置不同的效果，較好。課題4.4修改屬性特效及動態(tài)菜單制作教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、掌握表格布局頁面2、掌握改變屬性3、掌握行為“顯示-隱藏”的正確操作能力目標(biāo)1、學(xué)會利用不同行為制作網(wǎng)頁效果2、應(yīng)用改變屬性情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點1、常見事件OnMouseOver鼠標(biāo)經(jīng)過OnMouseout鼠標(biāo)離開2、AP元素隱藏顯示教學(xué)難點屬性高height、寬width的設(shè)置教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課(5min)百度搜索圖片時鼠標(biāo)經(jīng)過圖片時圖片經(jīng)常會自動放大，如何實現(xiàn)？導(dǎo)航欄如何制作？演示圖片放大及導(dǎo)航欄效果并引導(dǎo)學(xué)生思考欣賞教師的展示并分組討論如何實現(xiàn)？通過效果展示激發(fā)學(xué)生興趣任務(wù)一修改屬性特效(35min)如何制作如下圖所示效果網(wǎng)頁？（具體要求：當(dāng)鼠標(biāo)經(jīng)過圖片時圖片自動放大；當(dāng)鼠標(biāo)離開圖片時圖片縮小到原來大?。┎僮鞑襟E如下：新建網(wǎng)頁，頁面背景顏色為淺灰色插入3行3列的表格，合并第一行，并將第一行設(shè)置為深灰色，輸入“索尼s630款圖片”，居中對齊，字體大小為24，紫紅色，黑體在第二行第三行分別插入圖片1.jpeg、2.jpeg、3.jpeg、4.jpeg、5.jpeg、6.jpeg，并將圖片設(shè)置為寬高分別為200,120，并將圖片ID分別更改為p1…p6給p1添加行為-修改屬性-，修改的寬高值如下圖所示：5、同理修改p2….p6任務(wù)二動態(tài)菜單制作(40min)動態(tài)菜單制作新建頁面里繪制一個APDIV層，背景顏色為#FF33FF在層里插入一行4列的表格，寬度為100%，邊框，邊距，間距都為0分別在表格里輸入“新聞中心”、“娛樂頻道”、“電腦網(wǎng)絡(luò)”、“技術(shù)支持”，選中行設(shè)置行高25px，居中對齊APDIV層設(shè)置行高為25px，并將層重新命名為dhl在新聞中心下面再繪制一個APDIV層，并將層重命名為menu1，設(shè)置背景顏色為#FCF，在層里插入4行一列的表格，寬度設(shè)置為100%，邊框，邊距都為0，間距為3，輸入文字國際新聞、國內(nèi)新聞、體育新聞、英語新聞將“新聞中心”添加行為顯示-隱藏，事件onmouseover，如下圖所示同理，添加行為顯示-隱藏，事件onmouseout將menu1層跟dhl層靠在一起，給menu1同樣添加顯示-隱藏行為課堂小結(jié)(5min)修改屬性特效（寬width、高height、邊框border等）制作動態(tài)菜單欄（AP元素）課后作業(yè)(5min)搜索百度圖片及觀察網(wǎng)頁導(dǎo)航欄并對照教師上課內(nèi)容教學(xué)反思本次課通過修改屬性特效掌握圖片寬高的設(shè)置，理解圖片大小改變效果。通過動態(tài)菜單欄的制作，靈活運用AP層。計劃課時2課時實用課時2課時所用教材DreamweaverCS5網(wǎng)頁制作課題效果行為應(yīng)用教材處理DreamweaverCS5網(wǎng)頁制作實操性比較強，知識點零散，為將知識點系統(tǒng)化、增強學(xué)生職業(yè)意識及就業(yè)意識，特將教材以時下最火的淘寶為例，聯(lián)系到最近特別火的“雙十一”現(xiàn)象，以學(xué)生為主體，學(xué)生自主性學(xué)習(xí)為主導(dǎo)進行網(wǎng)頁制作。及前后內(nèi)容聯(lián)系第一模塊DW基本操作(學(xué)生已學(xué)習(xí)網(wǎng)頁基礎(chǔ)制作）—DW添加行為效果(部分增加)—DW網(wǎng)頁制作實際問題—網(wǎng)頁實例，學(xué)會綜合應(yīng)用教學(xué)目的知識目標(biāo)1、熟悉行為面板2、掌握添加行為面板中的效果行為3、掌握如何添加增大/收縮、擠壓、顯示/漸隱、晃動、滑動等特效能力目標(biāo)培養(yǎng)學(xué)生對問題進行分析以及解決問題的各種實踐能力，讓學(xué)生在自學(xué)的基礎(chǔ)上掌握更深的知識，能舉一反三，融會貫通。情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，提高學(xué)生的審美情趣，不斷提升學(xué)生的信息化素養(yǎng)。教學(xué)重點行為的應(yīng)用2、常見事件onclick、onmouseover、onmouseout、onload、onunload的靈活運用教學(xué)難點如何運用行為制作常見網(wǎng)頁特效教學(xué)方法任務(wù)驅(qū)動法學(xué)習(xí)方法自主學(xué)習(xí)及小組討論相結(jié)合教學(xué)教具電腦、多媒體教室教學(xué)過程時間分配復(fù)習(xí)舊知導(dǎo)入新課任務(wù)分析分組討論總結(jié)延伸教學(xué)小結(jié)5分鐘5分鐘15分鐘40分鐘25分鐘5分鐘教學(xué)準(zhǔn)備1.教師準(zhǔn)備:“銳天專營店”網(wǎng)站主頁，視頻及學(xué)生任務(wù)分配2.學(xué)生準(zhǔn)備:“銳天專營店”網(wǎng)站主頁制作，不加任何特效行為，預(yù)習(xí)行為效果教學(xué)環(huán)節(jié)時間安排教師活動學(xué)生活動設(shè)計意圖復(fù)習(xí)舊知（5分鐘）上次課我們通過繪制AP層和插入表格、圖片等操作，制作了淘寶首頁圖?，F(xiàn)在給大家展示優(yōu)秀作品并引導(dǎo)學(xué)生回憶操作步驟欣賞優(yōu)秀作品并思考自己作品的不足復(fù)習(xí)舊知，讓學(xué)生遺忘減少且為新課知識做鋪墊導(dǎo)入新課（5分鐘）1、以快遞圖片引出最近大火的雙十一2、由雙十一提出問題，在網(wǎng)上能買到哪些東西？3、以常見的網(wǎng)上鞋店為例，引出本次課的主題1、觀看圖片之時分組討論想到了什么東西？2、由火爆的雙十一快遞聯(lián)想到網(wǎng)上可以購買哪些物品？3、思考如何完成本次學(xué)習(xí)任務(wù)通過火爆的雙十一快遞圖片以及視頻的視覺沖擊，讓學(xué)生堅信電子商務(wù)發(fā)展的美好前途以及學(xué)習(xí)網(wǎng)頁制作的必要性任務(wù)分析（15分鐘）分組討論（35分鐘）討論問題創(chuàng)設(shè)情境1、展示“銳天專營店”首頁，大致分析如何完成，由于前面學(xué)生已經(jīng)做過類似網(wǎng)頁首頁，只需大體分析如何完成即可2、教師展示“銳天專營店”首頁1和“銳天專營店”首頁2對比，讓學(xué)生去發(fā)現(xiàn)它們之間的不同點3、總結(jié)不同點，提出本次課的任務(wù)4、教師列出任務(wù)點，提問：如何利用DW軟件完成它？1、學(xué)生思考及理解自己提出的相關(guān)討論問題。2、小組討論首頁對比不同點3、明確自己本節(jié)課的學(xué)習(xí)任務(wù)。4、積極思考教師提出的問題1、通過“銳天專營店”首頁，復(fù)習(xí)舊知2、通過兩個首頁對比，提出本次課任務(wù)，激發(fā)學(xué)生自主學(xué)習(xí)能力小組協(xié)作師生共探1、經(jīng)過小組討論得出任務(wù)后，小組之間相互協(xié)作總結(jié)任務(wù)：（1）廣告條制作（2）下拉式菜單制作（3）圖片屬性的更改及鏈接的操作2、教師要積極鼓勵學(xué)生，對問題進行思考，互相探討，觀察各組學(xué)生的制作過程以及學(xué)生活躍程度，記錄學(xué)生的學(xué)習(xí)進展，指正容易出錯的操作，對各組的作品作出適時的點評，對于大多數(shù)學(xué)生遇到的常見性問題，教師要及時統(tǒng)一提出并給予指導(dǎo)（包括幫助學(xué)生樹立正確的網(wǎng)絡(luò)學(xué)習(xí)意識）。3、完成后請制作優(yōu)秀的組員上臺演示1、在小組中積極思考，主動探究，互相交流意見，分工合作2、運用課前己掌握知識及教師的步驟提醒可自主嘗試完成任務(wù)培養(yǎng)學(xué)生協(xié)作交流能力，加深師生、生生之間的感情，拉近距離，形成輕松融洽的課堂學(xué)習(xí)氣氛，同時能及時發(fā)現(xiàn)學(xué)生操作中的失誤，以便及時給予糾正。解決問題成果交流老師給予適當(dāng)?shù)狞c撥和講解，并組織2名優(yōu)秀代表來演示作品各小組成員集思廣益，根據(jù)提出的方案每組派代表展示匯報自己的作品，互相交流學(xué)習(xí)。培養(yǎng)學(xué)生解決問題的能力、個人責(zé)任以及集體榮譽感。師生小結(jié)反饋評價1、展示學(xué)生自評表及互評表，組織學(xué)生在平臺上進行自評、互評及常用工具熟練投票，每組派代表上臺講解本組互評整體數(shù)據(jù)。2、最后教師進行總結(jié)性評價和對優(yōu)秀作品進行獎勵各組運用事先準(zhǔn)備好的自評及互評表，派代表上臺講解評價結(jié)果。各組根據(jù)收集網(wǎng)絡(luò)評價結(jié)果，反思自己的不足，并撰寫學(xué)習(xí)小結(jié)。培養(yǎng)學(xué)生互評和自評能力，激發(fā)學(xué)生的競爭意識。總結(jié)延伸（25分鐘）1、對學(xué)生作品進行收集整理2、對學(xué)生在嘗試制作任務(wù)所遇到的問題給予總結(jié)及對每個同學(xué)的作品給出點評3、針對學(xué)生對操作工具難易程度投票情況，在進行知識點在線題庫測試鞏固4、拓展練習(xí)：根據(jù)今天所學(xué)行為應(yīng)用，每位同學(xué)課后瀏覽不同網(wǎng)頁，收集不同廣告條、下拉式菜單及不同鏈接的形式，并總結(jié)。1、作品完成后反思繼續(xù)學(xué)習(xí)自己還沒掌握的知識，欣賞優(yōu)秀的作品并給及評價，思考自己的不足。2、完成課后的拓展練習(xí)1、對學(xué)生作品給及反饋，糾正或表揚，強調(diào)易錯點，鞏固知識。2、培養(yǎng)學(xué)生創(chuàng)新能力和創(chuàng)造性思維教學(xué)小結(jié)(5分鐘)通過本次課的學(xué)習(xí)，同學(xué)們需要掌握常見行為應(yīng)用：1、隱藏/顯示；2、效果。理解常見事件onmouseover、onmouseout、onclick、onload、onunload含義并靈活運用；3、完成教師發(fā)放的HYPERLINK課堂自測及自我評價表，嚴(yán)格按照上面的評分評價（表格見附件）課后作業(yè)網(wǎng)上搜索不同下拉菜單及廣告條，動手嘗試以“時尚資訊”為主題制作首頁并添加廣告條和菜單及鏈接等板書效果行為應(yīng)用廣告條制作繪制父層繪制子層插入圖片添加行為下拉式菜單制作繪制AP層插入圖像和輸入文字添加行為屬性更改制作寬高增大寬高還原添加行為添加超鏈接教學(xué)反思本次授課我主要采用任務(wù)驅(qū)動法，以任務(wù)的形式激發(fā)學(xué)生學(xué)習(xí)興趣。學(xué)生主要以小組討論法進行自主學(xué)習(xí)，把學(xué)生當(dāng)作學(xué)習(xí)的主體。充分調(diào)動了學(xué)生學(xué)習(xí)的自主性和積極性。但是本次課也存在不足，比如在復(fù)習(xí)以前常見事件onclick、onmouseover應(yīng)該再加以強調(diào)，讓學(xué)生在學(xué)習(xí)新知識的同時也復(fù)習(xí)舊知。附件：課堂自測及自我評價表（每人一份）課堂自測及自我評價表知識測評自我評價打開（10）關(guān)閉（10）是否提前預(yù)習(xí)（10）鼠標(biāo)經(jīng)過（10）鼠標(biāo)離開（10）是否積極參及討論（10）點擊（10）本次課學(xué)習(xí)的行為有：（10）是否參加上臺演示（10）我在學(xué)習(xí)中感到快樂（10）本節(jié)課知識都掌握了嗎（10）知識測評：將常見事件對應(yīng)的英文寫在后面的空格里，共50分；自我評價：每個自我評價都是10分，可根據(jù)自己的實際情況，在后面的空格給自己打分實訓(xùn)課題實訓(xùn)圖片展播實例實訓(xùn)課時2課時實訓(xùn)目標(biāo)掌握顯示/隱藏行為應(yīng)用掌握APDIV層的繪制掌握圖像的插入和屬性設(shè)置實訓(xùn)重點表格的拆分和合并APDIV層的繪制實訓(xùn)難點行為的綜合運用實訓(xùn)方法上機實訓(xùn)實訓(xùn)準(zhǔn)備教案、素材、案例、教材、計算機機房實訓(xùn)要求對照實習(xí)報告的要求，完成上機任務(wù)；任務(wù)完成后及時要求教師考評；完善實習(xí)報告，填寫實訓(xùn)總結(jié)；4、遵守實訓(xùn)紀(jì)律，不游戲，不睡覺，不高聲談?wù)?。實?xùn)過程操作要求及步驟任務(wù)圖片展播首先用ps或者其他軟件將幾張圖片的大小p成一樣的。比如筆者把三張圖片都p成了200x268的大小打開Dreamweaver，新建一個網(wǎng)頁（筆者這里建立一個html類型的網(wǎng)頁）點擊菜單欄：插入-->表格。插入一個1行1列的表格把鼠標(biāo)放到剛剛新建的APDiv里邊，點擊菜單欄的：插入-->圖像，選擇一張需要插入的圖片按上面的方法依次添加其他幾個APDiv，并在里邊插入圖片接下來插入一個APDiv，然后再里邊添加一個1行3列的表格鼠標(biāo)指針放到表格第一個方框中，單擊菜單欄：插入-->表單-->按鈕。操作如圖鼠標(biāo)點中添加的按鈕，然后再下方屬性面板中，把值修改為1按照上述步驟依次為表格的第二個框、第三個框添加一個按鈕，并把屬性值改成2和3。如圖把幾個APDiv移動到同一個區(qū)域。鼠標(biāo)點擊第一個方框的按鈕，點擊標(biāo)簽檢查器行為面板下方的“+”號，彈出的菜單中選擇“顯示-隱藏元素”預(yù)覽完善報告填寫實訓(xùn)總結(jié)，并上交實習(xí)報告。自主練習(xí)剩余時間，可進行自主練習(xí)，內(nèi)容不限，但不可違反上機紀(jì)律實訓(xùn)總結(jié)本次實訓(xùn)內(nèi)容較充實，學(xué)生操作較好。課題5.1認(rèn)識和編輯CSS教學(xué)課時2課時教學(xué)目標(biāo)知識目標(biāo)1、了解CSS樣式表2、掌握新建CSS樣式表及從外部導(dǎo)入樣式表能力目標(biāo)1、能掌握CSS的相關(guān)基本操作2、能了解CSS相關(guān)知識點情感目標(biāo)通過自主探究，使學(xué)生掌握軟件的使用規(guī)則，培養(yǎng)學(xué)生自主學(xué)習(xí)的能力。教學(xué)重點1、創(chuàng)建CSS樣式2、設(shè)置CSS樣式的屬性教學(xué)難點設(shè)置CSS濾鏡教學(xué)資源1.教學(xué)場所：多媒體教室2.教學(xué)設(shè)備：安裝有Dreamweavercs5軟件的計算機3.教學(xué)資料：輔助課件、多媒體教學(xué)軟件教法講解法、任務(wù)驅(qū)動教學(xué)法學(xué)法小組討論法教學(xué)過程過程安排教學(xué)內(nèi)容教師活動學(xué)生活動設(shè)計意圖導(dǎo)入新課（5min）網(wǎng)頁制作學(xué)到現(xiàn)在，我們基本上的一些操作都知道了，做一個完整的網(wǎng)站是沒有太大問題了，但是頁面的美觀還有待考究。那如何美化這些頁面呢？通過1.html和1_mh.html進行對比，學(xué)生分組討論并找出他們的差別討論兩套網(wǎng)頁的差別并標(biāo)注出來通過兩個網(wǎng)頁修改前后的效果，讓學(xué)生自己去發(fā)現(xiàn)它們之間的差別并探討任務(wù)一CSS基礎(chǔ)知識（55min）關(guān)于CSS樣式CSS樣式作為一種格式化網(wǎng)頁的標(biāo)準(zhǔn)方式，主要用來定義網(wǎng)頁內(nèi)容的編排、顯示、格式化及特殊效果，擴展了HTML的功能，使用它可以十分靈活地控制網(wǎng)頁的外觀。1.CSS：CascadingStyleSheets層疊樣式表。2.在Dreamweaver中可定義三種類型的CSS樣式，即自定義CSS樣式、重定義HTML標(biāo)記、CSS選擇器樣式。3.CSS樣式面板二、創(chuàng)建CSS1.新建CSS樣式2.輸入CSS樣式的名稱（.unnamed1）設(shè)置CSS樣式的類型（類）3.設(shè)置將在何處定義這個CSS樣式（僅對該文檔）4.設(shè)置CSS樣式三、設(shè)置CSS樣式的屬性類型、背景、區(qū)塊、方框、邊框、列表、定義、擴展講解CSS和HTML之間的區(qū)別并適當(dāng)舉例說明分組競賽，每個小組完成教學(xué)活動中的任務(wù)分組競賽，以小組為單位競賽CSS屬性里的翻譯適當(dāng)做筆記并理解教師的講解積極參及教師的設(shè)置的競賽活動積極參及競賽理解并掌握必要的基礎(chǔ)知識提高學(xué)生的學(xué)習(xí)積極性及任務(wù)二CSS體驗（20min）實訓(xùn)：1、