Dreamweaver網(wǎng)頁設(shè)計教案

1、第1章 網(wǎng)頁設(shè)計基礎(chǔ)教學(xué)目標(biāo)與要求熟記站標(biāo)、導(dǎo)航條、廣告條、按鈕等網(wǎng)頁構(gòu)成要素，以及網(wǎng)頁、網(wǎng)站、IP地址、域名、網(wǎng)址等概念；了解網(wǎng)頁的本質(zhì)和網(wǎng)頁的布局類型和HTML文檔的基本結(jié)構(gòu)，熟練掌握網(wǎng)站建設(shè)的基本流程。教學(xué)重點(diǎn)重點(diǎn)：站標(biāo)、導(dǎo)航條、廣告條、網(wǎng)頁、網(wǎng)站、IP地址、域名、網(wǎng)址等概念，以及網(wǎng)站建設(shè)的流程教學(xué)難點(diǎn)難點(diǎn)： IP地址、域名、網(wǎng)址，HTML文檔的基本結(jié)構(gòu)及其常見標(biāo)簽教學(xué)方法提問、啟發(fā)、圖示、情景教學(xué)、案例、課堂討論教學(xué)課時2課時第1章 網(wǎng)頁設(shè)計基礎(chǔ)教學(xué)提示導(dǎo)入課程：大家會輸入文字、制作和處理圖像、設(shè)計動畫，如何把這些作品放到internet中，讓更多的人去查閱和欣賞呢？-DW就可以制作網(wǎng)

2、頁。1.網(wǎng)頁的構(gòu)成要素和組成元素n 網(wǎng)頁的構(gòu)成要素：站標(biāo)、導(dǎo)航條、廣告條、標(biāo)題欄和按鈕；n 網(wǎng)頁的組成元素：文字、圖片、動畫（gif、flash）、表單（交互功能）、音頻、視頻、超鏈接、表格、框架、導(dǎo)航等。2.網(wǎng)頁相關(guān)知識簡介n 基本概念：Ø 網(wǎng)頁的本質(zhì)Ø 網(wǎng)頁、網(wǎng)站、主頁、互聯(lián)網(wǎng)Ø 動態(tài)網(wǎng)頁、靜態(tài)網(wǎng)頁Ø IP地址、域名、網(wǎng)址（url）、瀏覽器等概念n 網(wǎng)頁布局Ø 網(wǎng)頁布局的相關(guān)概念Ø 常見的布局類型n 網(wǎng)站管理與網(wǎng)頁制作相關(guān)軟件 Ø 制作和管理網(wǎng)頁工具；Ø 制作和優(yōu)化網(wǎng)頁圖像工具；Ø 制作網(wǎng)頁動畫工具；

3、Ø 其中Dreamweaver、 fireworks、 flash這三個軟件合稱為網(wǎng)頁“三劍客”。Ø 其他小工具軟件。n HTML語言Ø HTML的概念Ø HTML文檔的基本結(jié)構(gòu)Ø 幾個常見的html標(biāo)簽： html、head、title、style、script、link、meta、body、img、p、font等。n XHTML語言簡介 n 腳本語言簡介 3.網(wǎng)頁的設(shè)計理念和配色方案n 網(wǎng)頁的設(shè)計理念n 色彩的三要素n 網(wǎng)頁中的色彩心理與網(wǎng)頁表現(xiàn)n 色彩搭配應(yīng)遵循的原則4.網(wǎng)站的開發(fā)流程 網(wǎng)站需求分析 設(shè)計制作網(wǎng)站頁面 空間和域名申請 測試

4、和發(fā)布網(wǎng)站 網(wǎng)站推廣 制作頁面第二階段：創(chuàng)建站點(diǎn)，設(shè)計制作各級頁面規(guī)劃網(wǎng)站準(zhǔn)備素材定義站點(diǎn)設(shè)置頁面屬性第一階段：網(wǎng)站需求分析第三階段：申請空間和域名第四階段：測試和發(fā)布網(wǎng)站第五階段：網(wǎng)站推廣5.典型網(wǎng)站分析n 頁面結(jié)構(gòu)n 色彩運(yùn)用以提問的方式引入課程采用課堂討論教學(xué)法，打開幾個典型的網(wǎng)頁讓同學(xué)們討論總結(jié)構(gòu)成要素和組成元素。打開一個搜狐主頁，保存成不同的類型，讓大家看保存的效果，加深對網(wǎng)頁本質(zhì)的理解；先打開一個網(wǎng)頁的源文件，結(jié)合網(wǎng)絡(luò)常識，詳細(xì)講解網(wǎng)頁的定義，然后略講網(wǎng)站和主頁的概念。并提醒同學(xué)理解并記憶這些概念。以注冊和登錄郵箱為例，對比講解動態(tài)網(wǎng)頁和靜態(tài)網(wǎng)頁的特點(diǎn)和區(qū)別。以平頂山學(xué)院和搜狐網(wǎng)站

5、的IP地址與域名為例，簡要講述這兩個概念。通過查看分析知名網(wǎng)站的網(wǎng)址引入url的定義和組成，其它概念略講。提醒學(xué)生理解并記憶上述概念。打開一網(wǎng)頁（詳細(xì)講解網(wǎng)頁布局效果的教程）讓學(xué)生討論、分析總結(jié)布局類型。根據(jù)學(xué)生特點(diǎn)簡要講解ps、flash、fw等軟件在網(wǎng)頁設(shè)計中的功能。 打開搜狐主頁的源代碼，讓學(xué)生認(rèn)識一下html語言及其結(jié)構(gòu)，然后分別用記事本和dw創(chuàng)建2個最簡單的網(wǎng)頁，讓學(xué)生細(xì)看其源代碼，并詳細(xì)講解8個基本標(biāo)簽及其結(jié)構(gòu)關(guān)系，最后根據(jù)時間酌情講解其它幾個常見標(biāo)簽。簡要講解這兩個概念，然后創(chuàng)建一個網(wǎng)頁，復(fù)制無縫循環(huán)的代碼并粘貼到網(wǎng)頁的body標(biāo)簽，讓學(xué)生了解腳本語言的功能。讓學(xué)生欣賞插入后的效

6、果，吸引學(xué)生dw的相關(guān)代碼。結(jié)合上網(wǎng)的經(jīng)驗(yàn)，讓學(xué)生總結(jié)網(wǎng)頁的設(shè)計理念。色彩的三要素和心理表現(xiàn)學(xué)生在上學(xué)期的ps課程中學(xué)習(xí)過，采用提問法，進(jìn)行復(fù)習(xí)；然后打開幾個典型網(wǎng)站，分析其配色方案，最后總結(jié)網(wǎng)頁中色彩運(yùn)用的原則。根據(jù)設(shè)計的先后順序和學(xué)生一起分析總結(jié)網(wǎng)站的開發(fā)流程，并用圖加以解釋，重點(diǎn)講解網(wǎng)站的需求分析，以加深學(xué)生對重點(diǎn)知識的掌握。采用課堂討論教學(xué)法，打開幾個典型的網(wǎng)頁讓同學(xué)們討論總結(jié)網(wǎng)站的構(gòu)成要素、組成元素、布局結(jié)構(gòu)和配色方案。作業(yè)布置：1.察看并對比分析大型網(wǎng)站（如中國網(wǎng)、著名學(xué)校網(wǎng)、著名醫(yī)院網(wǎng)、官方網(wǎng)、科技網(wǎng)、娛樂休閑運(yùn)動網(wǎng)、兒童網(wǎng)、體育網(wǎng)、著名出版社網(wǎng)、cctv網(wǎng)站、sohu、yaho

7、o、IBM、微軟等）的風(fēng)格、色彩搭配與布局。2 .察看的同時下載自己需要的文章、圖片、軟件等資源。.課后習(xí)題。提問小結(jié)：通過提問、啟發(fā)、圖示、情景教學(xué)、課堂討論等教學(xué)方法的綜合運(yùn)用，提高了學(xué)生的學(xué)習(xí)興趣，從學(xué)生的反應(yīng)看，授課效果很好。第2章 Dreamweaver基礎(chǔ)知識教學(xué)目標(biāo)與要求熟悉Dreamweaver 8工作界面 ，熟記幾個常用的工具按鈕和菜單命令；熟練掌握站點(diǎn)的創(chuàng)建步驟，能快速規(guī)范地創(chuàng)建站點(diǎn)；能夠快速創(chuàng)建、打開、保存網(wǎng)頁文檔；能熟練設(shè)置頁面的屬性。教學(xué)重點(diǎn)1.創(chuàng)建站點(diǎn)并組織站點(diǎn)的結(jié)構(gòu);2. 在站點(diǎn)中創(chuàng)建網(wǎng)頁3.頁面的屬性設(shè)置教學(xué)難點(diǎn)HTML基礎(chǔ)教學(xué)方法舉例為主，適當(dāng)講授操作要領(lǐng)，提

8、問以測試課題效果。教學(xué)課時2課時第2章 Dreamweaver基礎(chǔ)知識教學(xué) 提示我們一貫都是瀏覽網(wǎng)頁，想自己動手做網(wǎng)站嗎？用什么工具做網(wǎng)站？怎樣做呢？- Dreamweaver網(wǎng)頁制作工具。2.1 熟悉Dreamweaver 8工作界面 2.2 網(wǎng)站創(chuàng)建與管理 站點(diǎn)的定義、組成和結(jié)構(gòu) 網(wǎng)頁文檔與文件夾命名規(guī)則 創(chuàng)建本地站點(diǎn)的步驟組織站點(diǎn)結(jié)構(gòu)2.3 網(wǎng)頁文檔基本操作 新建、保存、預(yù)覽、打開、關(guān)閉2.4 基本頁面屬性設(shè)置 制定文檔標(biāo)題和邊距、網(wǎng)頁背景顏色和背景圖像，為網(wǎng)頁設(shè)置文本屬性、鏈接屬性和跟蹤圖像的屬性，總結(jié)頁面的使用的技巧：拋出問題，引入新課啟動dw，詳細(xì)講解插入欄、文檔標(biāo)簽與“文檔”工具

9、欄、狀態(tài)欄的作用，區(qū)分標(biāo)簽檢查器、標(biāo)簽選擇器、標(biāo)記選擇符3個概念及其作用 詳細(xì)講解站點(diǎn)的定義、組成、結(jié)構(gòu)，以及文件和文件夾的命名規(guī)則。演示站點(diǎn)的創(chuàng)建過程和步驟，著重提出保存和站點(diǎn)文件夾的命名。詳細(xì)講解站點(diǎn)結(jié)構(gòu)的組織方法和原則。分別演示這幾個操作通過dw設(shè)計視圖分別創(chuàng)建1個網(wǎng)頁，分別演示文檔標(biāo)題和邊距、背景顏色和背景圖像、文本和鏈接屬性，以及跟蹤圖像的屬性的設(shè)置方法和步驟，幫助學(xué)生掌握頁面的設(shè)置過程。并總結(jié)頁面設(shè)置和創(chuàng)建過程中的一些使用技巧。作業(yè)：習(xí)題一第1，2, 3 題小結(jié)：本次課內(nèi)容操作性很強(qiáng)，經(jīng)過學(xué)生自己上臺操作，發(fā)現(xiàn)大多數(shù)學(xué)生都能創(chuàng)建并組織好一個站點(diǎn)，還能快速地設(shè)置網(wǎng)頁的屬性，達(dá)到了教學(xué)

10、目標(biāo)的要求。第3章 網(wǎng)頁中的基本元素教學(xué)目標(biāo)與要求1.熟練操作網(wǎng)頁中的文本；2.熟練插入各種格式的圖像并設(shè)置其屬性；3.了解圖像切片的作用；4.熟練制作圖像切片，并插入到dw中教學(xué)重點(diǎn)1.文本對象的插入和格式設(shè)置；2.GIF、PNG和JPEG三種圖像格式 的異同點(diǎn)和使用環(huán)境；3.用fireworks制作網(wǎng)頁切片的方法； 教學(xué)難點(diǎn)1.設(shè)置文本標(biāo)題；段落的設(shè)置效果；2.GIF、PNG和JPEG三種圖像格式的異同點(diǎn)和使用環(huán)境；3.Dreamweaver 8.0中使用圖像的一些基本方法和技巧；4. 在dreamweaver中插入用fireworks制作的切片教學(xué)方法課堂講授為輔，多媒體演示為主，適當(dāng)舉

11、例，提問以測試課題效果，實(shí)驗(yàn)式教學(xué)。教學(xué)課時4課時第3章網(wǎng)頁中的基本元素教學(xué)提示復(fù)習(xí)上節(jié)內(nèi)容：1 如何創(chuàng)建站點(diǎn)？2 如何站點(diǎn)結(jié)構(gòu)的組織3.1網(wǎng)頁中文本的操作. 認(rèn)識文本按鈕及屬性面板 思考題：根據(jù)以前所學(xué)知識說出文本的編輯和設(shè)置屬性各包括幾個方面？. 插入文本和對象n 將文本（英文、中文、數(shù)字）添加到文檔中的3種方法。n 插入特殊字符n 水平線 n 插入日期：菜單法；插入欄按鈕法n 對插入的文本也可以執(zhí)行刪除、搜索、替換、檢查拼寫（文本檢查拼寫shift+f7）等操作。. 設(shè)置文本格式 字符的樣式包括的方面及其設(shè)置方法. 設(shè)置文本標(biāo)題 標(biāo)題的含義與作用3. 設(shè)置段落效果 1 . 設(shè)置段落格式

12、.縮進(jìn)段落對齊段落 （4種對齊方式）.分段與換行的相關(guān)操作和區(qū)別：.創(chuàng)建項(xiàng)目列表.網(wǎng)頁圖像的運(yùn)用.網(wǎng)頁中圖像格式簡介 1. 圖像在網(wǎng)頁中的作用和網(wǎng)頁中常用圖像格式有：GIF 、JPEG 、PNG。2.三種圖像格式的特點(diǎn)和在網(wǎng)頁中的使用場合。 在Web頁上顯示圖片之前，通常需要考慮下列三個問題：.在網(wǎng)頁中使用圖像1.插入圖像：2.插入圖像占位符：注意圖像占位符的命名規(guī)則和作用3.創(chuàng)建鼠標(biāo)經(jīng)過圖象（輪換圖像）4. 在dw中圖像的編輯功能僅適用于GIF 和JPEG 圖像格式。Ø 在屬性檢面板中編輯圖像，上述設(shè)置也可通過菜單實(shí)現(xiàn)：修改-圖像Ø 用fireworks優(yōu)化圖像。熱點(diǎn)工具

13、的使用和圖像熱區(qū)的添加 .設(shè)置圖文混排的效果：7.制作電子相冊：命令創(chuàng)建網(wǎng)站相冊切片在fw中的創(chuàng)建和在dw使用打開大圖片網(wǎng)頁時，總是等待很長時間，怎樣處理才能減少圖片的下載時間呢？-做成切片。1.切片的定義和作用2.切片在fw中的創(chuàng)建方法和步驟3.在DW中插入Fireworks HTML（切片）的方法和步驟 將Fireworks HTML插入到Dreamweaver中的方法。方法1：將切片從Fireworks復(fù)制到剪貼板上，然后直接粘貼到Dreamweaver文檔代碼視圖中的相應(yīng)位置處。方法2：直接將Fireworks HTML插入到Dw中的操作步驟.網(wǎng)頁多媒體的運(yùn)用在網(wǎng)頁中使用視頻flash

14、1.網(wǎng)頁中常見的視頻文件格式和插入方法；2.常見的flash文件格式和插入方法；flash文件（.fla格式）、flash影片文件（.swf格式）、flash模板文件（swt格式）、flash元素文件（.swc格式）、flash視頻文件（.flv格式）在網(wǎng)頁中使用音頻 添加聲音需要考慮的因素：添加的的、文件大小、聲音品質(zhì)和在不同瀏覽器中的差異。1.音頻文件的格式和相應(yīng)的特點(diǎn)：n 網(wǎng)頁中常見的音頻格式有：u mid/midi格式：。u wav和aif（aiff）文件2.在網(wǎng)頁中插入音頻文件的2種方式：n 鏈接到音頻文件n 嵌入聲音文件3.4dw擴(kuò)展插件1.安裝擴(kuò)展插件2.使用擴(kuò)展插件使用擴(kuò)展插件

15、主要有2個步驟： 先安裝插件 然后啟動dreamweaver，在相應(yīng)的位置找到調(diào)用擴(kuò)展的命令即可。3.在“類型”欄中顯示擴(kuò)展的類型含義：類型含義對象在dw界面的“插入”工具欄調(diào)用該擴(kuò)展插件命令在dw的“命令”菜單中調(diào)用擴(kuò)展行為在dw的“行為”面板中調(diào)用擴(kuò)展4.常用擴(kuò)展插件的安裝和使用Page transitions有超級鏈接時，頁過渡（進(jìn)入/退出）效果命令要選定整個頁面（即body標(biāo)簽），再在命令菜單中找到該命令即可實(shí)現(xiàn)（效果見實(shí)例站點(diǎn)中g(shù)uodong1.html、 guodong2.html 、 guodong3.html ）Typewriter.mxp模擬打字行為先把要添加該效果的對象放入

16、AP元素中，然后在行為面板中找到y(tǒng)aromat|typewriter即可實(shí)現(xiàn)，文字的打印效果就顯示在AP元素中。 (guodong1.html中打印文字）Sound.mxp插入背景音樂對象要選定整個頁面（即body標(biāo)簽），再在“常用”插入欄中找到sound按鈕即可實(shí)現(xiàn)Marquee.mxp滾動文字插件對象要選定整個頁面（即body標(biāo)簽），再在“常用”插入欄中找到marquee按鈕即可實(shí)現(xiàn)Insert Greeting.mxp插入問候語對象把光標(biāo)定位在頁面的合適位置，然后選擇“插入”欄中的“CN Insert Greeting”按鈕即可實(shí)現(xiàn)Calander.mxp對象把光標(biāo)定位在頁面的合適位置，

17、然后選擇“插入”欄中的“calander”按鈕即可實(shí)現(xiàn)Persistent layers滾動鏈接的AP元素行為先把要添加該效果的對象放入AP元素中，然后在行為面板中找到ribbers zeewolde| Persistent layers即可實(shí)現(xiàn)，一般用來顯示廣告信息。（ guodong1.html中的”送給你了“）以提問的方式復(fù)習(xí)上次課內(nèi)容結(jié)合WORD，通過復(fù)習(xí)的方式，總結(jié)dw中文本的操作； 先簡要演示一下各種文本符號的插入方法，然后輸入一首小詩，調(diào)整其格式；接著復(fù)制一篇文章粘貼到dw中；最后導(dǎo)入一篇word文檔； 先簡要講述一下文本格式、標(biāo)題、段落的設(shè)置的含義和步驟，然后讓學(xué)生走上講臺對上

18、述插入的文本設(shè)置相應(yīng)的字符格式、標(biāo)題級別、段落效果，并選擇個別段落創(chuàng)建項(xiàng)目列表，以加深印象。通過比較法講解各圖像格式的特點(diǎn)舉例：在文檔中插入各種圖像對象，并設(shè)置其格式屬性。演示制作圖像熱區(qū)和圖文混排的效果；演示制作電子相冊以問題的形式引入切片的定義和作用。本內(nèi)容盡量調(diào)整在機(jī)房講解。詳細(xì)講解并演示切片在fw中制作和在dw中插入的方法與步驟。用比較法總結(jié)網(wǎng)頁中出現(xiàn)的視頻文件的格式及其特點(diǎn)，舉例講解視頻文件的插入方法和屬性設(shè)置；用比較法總結(jié)網(wǎng)頁中出現(xiàn)的flash文件的格式及其特點(diǎn)，重點(diǎn)講解flash按鈕、flash文本和flash視頻的插入方法和屬性設(shè)置；用比較法總結(jié)網(wǎng)頁中常見的音頻文件格式及其特點(diǎn)

19、。舉例演示音頻文件的插入和屬性設(shè)置，重點(diǎn)講解背景音樂的插入和設(shè)置。重點(diǎn)講解頁面過度效果、sound、marquee和滾動鏈接的AP元素4個插件的用法和設(shè)置先演示這幾個常用擴(kuò)展插件的安裝和使用方法，然后讓學(xué)生上臺操作，教師指點(diǎn)操作過程和方法 擴(kuò)展這本分內(nèi)容安排到行為之后講解作業(yè)：1 . 填空題（1）使用屬性檢查器或【文本】菜單中的選項(xiàng)可以設(shè)置或更改所選文本的字體特性。可以設(shè)置字體_ _（如粗體或斜體）和_。（2）若要插入更多的特殊字符，請選擇_ | _ | _或在_欄中選擇_圖標(biāo)，選擇一個字符，然后單擊【確定】。（3）在計算機(jī)領(lǐng)域中，圖像分為_和_2大類。（4）GIF圖像采用的是_壓縮格式。2

20、. 選擇題（1）在網(wǎng)頁中連續(xù)輸入空格的方法是_。 A連續(xù)按空格鍵 B按下Ctrl鍵再連續(xù)按空格鍵 C轉(zhuǎn)換到中文的全角狀態(tài)下連續(xù)按空格鍵 D按下Shift鍵再連續(xù)按空格鍵（2）網(wǎng)頁通常可以支持的圖像格式有_。 AGIF BBMP CAVI DPSD EPNG FJPEG。3.簡答題（1）網(wǎng)頁中常用的圖像格式有哪些？各有什么特點(diǎn)？如果在網(wǎng)頁中添加動畫格式的浮動廣告，采用何種格式？為什么？電子相冊，應(yīng)該用哪種格式最好？ (2)如何創(chuàng)建鼠標(biāo)變換圖像和圖像熱點(diǎn)？4.操作題： 搜集自己的喜愛的圖片，制作一個電子相冊。小結(jié)：本章內(nèi)容較多，但交簡單，需要邊講解邊對比總結(jié)，通過對比總結(jié)和學(xué)生上臺操作演示，從學(xué)生

21、上機(jī)的作業(yè)來看，授課效果很好。第4章 使用表格與布局表格布局網(wǎng)頁教學(xué)目標(biāo)與要求1.了解表格和布局表格在網(wǎng)頁布局中的作用；2.掌握表格和布局表格的插入方法和基本編輯方法；3.掌握表格和布局表格、單元格和布局單元格的屬性設(shè)置；4.通過對表格和布局表格的學(xué)習(xí)，提高學(xué)生學(xué)習(xí)網(wǎng)頁制作的興趣，增強(qiáng)學(xué)生的審美觀教學(xué)重點(diǎn)1 表格的插入方法、基本編輯方法與應(yīng)用；2 布局表格和布局單元格的繪制方法、屬性設(shè)置與應(yīng)用教學(xué)難點(diǎn)1.表格和單元格的屬性設(shè)置與應(yīng)用；2.布局表格和布局單元格的繪制與屬性設(shè)置教學(xué)方法多媒體演示，案例教學(xué)，任務(wù)驅(qū)動，引導(dǎo)教學(xué)；提問式教學(xué)。教學(xué)課時2學(xué)時第4章 使用表格與布局表格布局網(wǎng)頁教學(xué)提示用表

22、格控制文字、圖片、動化等對象的位置，使網(wǎng)頁的布局緊湊又整齊美觀。常用的頁面設(shè)計布局類型有：表格、布局表格和AP元素三種，本章著重講解如何使用表格和布局表格布局頁面。4.1.表格模式1.dw中表格的3種模式 2.模式切換的操作方式：查看-表格模式-標(biāo)準(zhǔn)模式/布局模式/表格擴(kuò)展模式。3.模式的區(qū)別與注意事項(xiàng)：n 只有在“設(shè)計”視圖中才可切換到“布局”模式；n 在不同模式下，工具欄的各個按鈕作用不同；n 在布局模式中不能像布局表格的空白區(qū)域插入內(nèi)容，只能創(chuàng)建布局單元格，布局單元格才是承載具體內(nèi)容的容器。4.2使用表格布局網(wǎng)頁1表格的作用2.表格的組成部分 表格的行、列、單元格、邊距、間距、邊框3.表

23、格的標(biāo)記n <table>標(biāo)記、<tr>標(biāo)記、<td>標(biāo)記n 三者的對應(yīng)位置關(guān)系4.表格的基本操作n 表格的插入、選擇、刪除、大小調(diào)整；n 單元格的選擇、合并、拆分、大小調(diào)整；n 表格在“擴(kuò)展表格”模式和“標(biāo)準(zhǔn)”模式下的應(yīng)用5.嵌套表格 n 表格嵌套的作用n 創(chuàng)建嵌套表格的操作方法。6.導(dǎo)入和導(dǎo)出表格數(shù)據(jù)、7. 表格布局網(wǎng)頁的應(yīng)用實(shí)例8. 表格布局的缺點(diǎn)4.3布局表格布局網(wǎng)頁1.繪制布局表格繪制布局表格的注意事項(xiàng)： 2.繪制布局單元格繪制布局單元格的注意事項(xiàng)：3.設(shè)置布局表格和布局單元格的屬性和參數(shù)4.在布局單元格中添加內(nèi)容 5.課堂實(shí)例用布局表格布局網(wǎng)站主

24、頁展示一個布局合理、美觀的網(wǎng)頁，激起學(xué)生的學(xué)習(xí)興趣。簡要講解并3種表格模式的作用，重點(diǎn)演示不同模式下按鈕的使用回顧word和excel中講過的有關(guān)表格的概念和基本操作，引入dw中表格的概念和基本操作。重點(diǎn)講解表格的屬性設(shè)置含義。插入一個表格，并在每個格中插入不同的內(nèi)容，然后切換到代碼視圖，讓學(xué)生識記三個標(biāo)簽。逐一演示表格的各個基本操作。重點(diǎn)講解創(chuàng)建嵌套表格的原因打開一個示例網(wǎng)頁，讓學(xué)生上講臺比照著制作出相同效果討論總結(jié)表格布局的缺點(diǎn)重點(diǎn)演示并總結(jié)繪制布局表格和布局單元格的注意事項(xiàng)。演示設(shè)置布局表格和單元格的屬性；在設(shè)置好屬性的布局單元格中添加文章、圖像和多媒體。先和學(xué)生一起分析左側(cè)網(wǎng)頁的操作思

25、路和主要步驟，然后讓學(xué)生上臺操作，以加深印象。作業(yè)：課堂作業(yè)：1.敘述3種模式的概念及切換方法。2.說出表格和布局表格的作用3.敘述“表格擴(kuò)展模式”的作用4.什么是間隔圖像？書面作業(yè)：課后習(xí)題。小結(jié)：通過與學(xué)生熟悉的word中表格的操作對照講解，本章的講解顯得較輕松；讓學(xué)生上臺操作，提高了學(xué)生的學(xué)習(xí)積極性和主動性，教學(xué)效果較好。第5章 使用框架布局網(wǎng)頁教學(xué)目標(biāo)與要求了解框架網(wǎng)頁的概念；熟練創(chuàng)建、保存框架網(wǎng)頁，并設(shè)置框架和框架集的屬性；框架中超級鏈接的創(chuàng)建和目標(biāo)屬性設(shè)置教學(xué)重點(diǎn)熟練創(chuàng)建保存框架網(wǎng)頁，并設(shè)置框架和框架集的屬性；框架中超級鏈接的創(chuàng)建和目標(biāo)屬性設(shè)置教學(xué)難點(diǎn)框架網(wǎng)頁的概念和保存；框架中超

26、級鏈接的創(chuàng)建和目標(biāo)屬性設(shè)置教學(xué)方法多媒體演示為主，適當(dāng)舉例，人體媒體結(jié)合式教學(xué)，課堂講授，師生互動，提問式教學(xué)。教學(xué)課時2學(xué)時第5章 框架網(wǎng)頁教學(xué)提示5.1框架和框架集的概念、結(jié)構(gòu)和應(yīng)用1.基本概念l 框架網(wǎng)頁、框架集、框架l 框架和框架集的關(guān)系2框架網(wǎng)頁的結(jié)構(gòu) 3.認(rèn)識框架面板：4.框架網(wǎng)頁的應(yīng)用：通常用于導(dǎo)航。5.框架網(wǎng)頁的優(yōu)缺點(diǎn)5.2 創(chuàng)建和保存框架與框架集5.2.1 使用預(yù)設(shè)的框架集1.創(chuàng)建新的空預(yù)設(shè)框架的具體操作步驟。修改框架名稱必須以字母開頭，可以包含數(shù)字、下劃線（_）；但不允許是javascript中的保留字（如top或navigator）、連字符（-）、句點(diǎn)、空格和；而且區(qū)分大

27、小寫。2.創(chuàng)建預(yù)設(shè)的框架集并在某一框架中顯示現(xiàn)有文檔5.2.2 創(chuàng)建和編輯框架1.創(chuàng)建框架2.刪除框架3.建立嵌套的框架集4.保存框架和框架集5.3設(shè)置框架及框架集的屬性1.選擇框架：通過“框架”面板來選擇框架和子框架。2.設(shè)置框架屬性n 框架的背景顏色可以在頁面屬性中進(jìn)行設(shè)置n 在框架的屬性面板中進(jìn)行設(shè)置框架的的名稱、源文件、鏈接、邊距、滾動、邊框和能否調(diào)整大小等。 3.設(shè)置框架集屬性：邊框、邊框大小和邊框顏色。5.4設(shè)置框架集中的超級鏈接5.4.1在框架網(wǎng)頁中建立超鏈接5.4.2框架網(wǎng)頁中設(shè)置超級鏈接的目標(biāo)打開方式1.相對鏈接目標(biāo)：_blank 、_top 、_parent、_self2.

28、絕對鏈接目標(biāo)：mainframe、Leftframe、Rightframe、Topframe。5.6課堂實(shí)例制作一個框架網(wǎng)頁通過看看和分析知名網(wǎng)站使用框架的布局效果，引入框架和框架集的概念舉例演示框架的創(chuàng)建和保存操作打開框架面板，查看并總結(jié)框架和框架集的屬性設(shè)置及其含義演示框架中的超級鏈接效果舉例演示框架網(wǎng)頁的設(shè)計與制作作業(yè)：1.使用框架的優(yōu)點(diǎn)是什么？ 2.課后習(xí)題小結(jié)：本章介紹了框架網(wǎng)頁的創(chuàng)建、保存和屬性設(shè)置，著重講解了框架網(wǎng)頁的中超級鏈接的創(chuàng)建和目標(biāo)設(shè)置，內(nèi)容較少，授課效果較好。第6章 AP元素的創(chuàng)建和使用教學(xué)目標(biāo)與要求理解AP元素的作用；熟記AP元素的命名原則和特點(diǎn)；掌握繪制AP元素和插

29、入AP元素的方法和區(qū)別；熟練設(shè)置AP元素的屬性；靈活、合理地使AP元素隨心所欲的布局頁面內(nèi)容。教學(xué)重點(diǎn)AP元素的作用；AP元素的插入和繪制；AP元素的屬性設(shè)置；AP元素的特點(diǎn)；AP元素的應(yīng)用教學(xué)難點(diǎn)AP元素的作用；AP元素的屬性設(shè)置；AP元素的應(yīng)用教學(xué)方法多媒體演示為主，適當(dāng)舉例，人體媒體結(jié)合式教學(xué)，課堂講授，師生互動，提問式教學(xué)。教學(xué)課時2課時第6章AP元素的創(chuàng)建和使用教學(xué)提示大家 在瀏覽網(wǎng)頁時，注意到滾動的廣告圖片了嗎？-它是使用AP元素做出來的效果。6.1應(yīng)用AP元素布局網(wǎng)頁6.1.1AP元素的概述1、AP元素的應(yīng)用：布局網(wǎng)頁；制作簡單動畫；設(shè)計特效等。2、AP元素的定義、AP元素的特點(diǎn)

30、、AP元素的分類、AP元素的優(yōu)缺點(diǎn)、AP元素面板。6.1.2創(chuàng)建AP元素1.在首選參數(shù)對話框中設(shè)置AP元素的參數(shù)，可設(shè)置AP元素嵌套和顯示AP元素錨記。2.插入AP元素與繪制AP元素3.繪制AP元素和插入AP元素的差別4.AP元素的html代碼5.AP元素的絕對定位（一般是默認(rèn)設(shè)置）和相對定位6.1.3.AP元素屬性詳解1.單個AP元素的屬性：AP元素編號、左和上、寬和高、Z 軸、背景圖像、背景顏色、剪輯、可見性、溢出：2.多個AP元素的屬性：6.1.4AP元素的基本操作激活A(yù)P元素、選擇AP元素、調(diào)整AP元素大小、移動AP元素、對齊AP元素、吸附AP元素到網(wǎng)格6.1.5嵌套AP元素6.1.6

31、.AP元素和表格的相互轉(zhuǎn)換6.2 課堂實(shí)例用AP元素布局網(wǎng)站首頁拋出問題，引入新課強(qiáng)調(diào)AP元素在頁面布局中的作用演示AP元素的繪制要領(lǐng)；選擇AP元素，讓學(xué)生觀察的屬性，并詳細(xì)講解各屬性的設(shè)置含義。演示AP元素的各種操作綜合舉例作業(yè)：課后習(xí)題上機(jī)作業(yè)：使用AP元素、表格和css排版網(wǎng)站首頁小結(jié)：本章著重講解AP元素的創(chuàng)建、命名和屬性設(shè)置，讓學(xué)生親自上臺制作案例，加深了對新知識的印象。上機(jī)時發(fā)現(xiàn)學(xué)生基本都能完成操作任務(wù)，總體感覺授課效果較好。第7章超級鏈接教學(xué)目標(biāo)與要求了解超級鏈接的路徑和鏈接結(jié)構(gòu)；熟記超級鏈接目標(biāo)打開方式的設(shè)置含義；熟練掌握超級鏈接的4種創(chuàng)建方法；能快速完成5種特殊超級鏈接的創(chuàng)建

32、方法和步驟。教學(xué)重點(diǎn)1.超級鏈接的各種創(chuàng)建步驟2.超級鏈接目標(biāo)打開方式的設(shè)置含義3.超級鏈接的4種創(chuàng)建方法4. 5種特殊超級鏈接的創(chuàng)建方法和步驟教學(xué)難點(diǎn)1.超級鏈接的路徑2.超級鏈接目標(biāo)打開方式的設(shè)置含義教學(xué)方法多媒體演示為主，適當(dāng)舉例，人體媒體結(jié)合式教學(xué)，課堂講授，師生互動，提問式教學(xué)。教學(xué)課時2課時第7章 超級鏈接教學(xué)提示大家已經(jīng)會創(chuàng)建不同內(nèi)容的網(wǎng)頁了，怎樣把這些分散的網(wǎng)頁組合成一個統(tǒng)一的整體，讓瀏覽者只打開主頁就能訪問到其它各個面呢？-需要創(chuàng)建超級鏈接。7.1超級鏈接的定義和目標(biāo)選項(xiàng)的含義1 .超級鏈接的定義2.屬性檢查器的“目標(biāo)”彈出菜單中各個選項(xiàng)的含義：_blank、_parent、

33、_self、_top。3：創(chuàng)建一個完整的超級鏈接必須考慮的4個方面： 鏈接的載體 鏈接的目標(biāo) 鏈接的路徑 鏈接目標(biāo)的打開方式7.2超級鏈接的路徑 在dreamweaver中有三種類型的鏈接路徑： 絕對路徑、文檔相對路徑、站點(diǎn)根目錄相對路徑。7.3超級鏈接的分類按照鏈接路徑的不同，網(wǎng)頁中超鏈接一般分為內(nèi)部鏈接、錨點(diǎn)鏈接、外部鏈接3種類型。 按照使用對象的不同，網(wǎng)頁中的鏈接又可以分為以下幾種：文本超鏈接、圖像超鏈接、電子郵件鏈接、錨點(diǎn)鏈接、軟件下載鏈接、多媒體文件鏈接、空鏈接等。7.4超級鏈接的創(chuàng)建方法1. 使用屬性檢查器中鏈接后的文本框創(chuàng)建各種各樣的超級鏈接；2.使用屬性檢查器中的瀏覽文件圖標(biāo)創(chuàng)

34、建各種各樣的超級鏈接；3.使用“指向文件”圖標(biāo)創(chuàng)建超級鏈接；4.使用菜單中的“超級鏈接”命令創(chuàng)建超級鏈接；7.5幾種特殊的超級鏈接詳解1錨記鏈接2創(chuàng)建腳本鏈接3給圖像熱區(qū)加上超級鏈接 4創(chuàng)建電子郵件超鏈接 5創(chuàng)建空鏈接7.6超級鏈接的基本操作：更新、修改、檢查 7.7超級鏈接的結(jié)構(gòu)7.8總結(jié)創(chuàng)建超級鏈接的5點(diǎn)建議 拋出問題，引入新課。（2分鐘）打開幾個典型網(wǎng)站的主頁，讓大家分析超級鏈接的功能，進(jìn)而引入超級鏈接的定義、分類和目標(biāo)列表的設(shè)置。讓學(xué)生討論總結(jié)創(chuàng)建超級鏈接的注意事項(xiàng)（20分鐘）通過舉例和配圖講解鏈接路徑的類型和在創(chuàng)建超級鏈接時路徑的書寫方法（20分鐘）采用討論法，讓學(xué)生討論總結(jié)超級鏈接

35、的分類。（8分鐘）舉例講解各種方法下超級鏈接的創(chuàng)建方法和創(chuàng)建步驟，并總結(jié)各種方法的使用情況（25分鐘）借助上面講過的創(chuàng)建方法，讓學(xué)生上臺操作實(shí)踐，創(chuàng)建各種類型的超級鏈接。根據(jù)情況不部分內(nèi)容調(diào)整到機(jī)房講解。（30分鐘）簡要講述超級鏈接的修改與更新操作。（15分鐘）結(jié)構(gòu)較為簡單（15分鐘）總結(jié)并提出建議。（10分鐘）作業(yè)：1.敘述超級鏈接的定義 2.說出超級鏈接的路徑3.說出超級鏈接的4種創(chuàng)建方法。小結(jié)：本章內(nèi)容較多，超級鏈接的路徑較難理解；其他內(nèi)容相對容易，且操作性較強(qiáng)，易掌握，學(xué)生基本都能創(chuàng)建各種類型的超級鏈接，總體感覺授課效果還好。第8章交互（行為、圖AP元素和時間軸的綜合運(yùn)用，以及java

36、script）教學(xué)目標(biāo)與要求1. 熟練地應(yīng)用行為，能夠隨心所欲地制作出具交互功能的網(wǎng)頁；2. 掌握時間軸的概念和基本用法；3. 通過對行為的學(xué)習(xí)應(yīng)用，增加網(wǎng)頁設(shè)計的特殊效果，提高學(xué)生對學(xué)習(xí)網(wǎng)頁制作的興趣，培養(yǎng)大家的動手操作能力。4. 了解java腳本的基本用法教學(xué)重點(diǎn)1.行為的概念和創(chuàng)建，2.使用DW內(nèi)置的行為3.AP元素、行為和時間軸的綜合運(yùn)用教學(xué)難點(diǎn)1.使用DW內(nèi)置的行為；2.高級行為的應(yīng)用；3.AP元素、行為和時間軸的綜合運(yùn)用教 學(xué) 方 法多媒體演示為主，適當(dāng)舉例，人體媒體結(jié)合式教學(xué)，課堂講授，師生互動，提問式教學(xué)；任務(wù)驅(qū)動、引導(dǎo)教學(xué)、理論與操作緊密結(jié)合。教 學(xué) 課 時4課時第8章交互（

37、行為、圖AP元素和時間軸的綜合運(yùn)用，以及js）教學(xué)提示問題：大家已經(jīng)會在網(wǎng)頁中的特殊效果如：彈出消息、檢查表單、設(shè)置導(dǎo)航文本、鼠標(biāo)的花瓣、棉花糖、下雪了、禮花綻放等，這樣的動態(tài)網(wǎng)頁是如何制作的呢？使用行為就可以實(shí)現(xiàn)。8.1.1初步認(rèn)識行為1、DW行為的引出 2、行為的概念3、與行為相關(guān)的三個重要部分：對象、事件和動作。4、認(rèn)識行為面板8.1.2行為的創(chuàng)建、修改和更新· 創(chuàng)建行為的三個步驟· 修改行為· 更新行為 8.1.3使用DW內(nèi)置的行為 dw8.0自帶的行為主要有:1.彈出消息 2、“播放聲音”實(shí)例 3、跳轉(zhuǎn)菜單和跳轉(zhuǎn)菜單開始 4、打開瀏覽器窗口5、

38、交換圖象與恢復(fù)交換圖象 6、控制shockshave或flash7、設(shè)置導(dǎo)航欄圖像 8、設(shè)置文本9、顯示彈出菜單（下拉菜單） 10、顯示和隱藏AP元素11、拖動AP元素 12、滾動鏈接的AP元素8.1.4高級行為的應(yīng)用1、插入滾動字幕示例：文本自動向上循環(huán)滾動，鼠標(biāo)放到上面還會暫停2、下載安裝擴(kuò)展插件3、下載網(wǎng)頁特效，適當(dāng)修改相關(guān)代碼，再把代碼放到代碼視圖的具體位置。 舉例：花瓣、棉花糖。8.2AP元素、行為和時間軸的綜合運(yùn)用1.時間軸面板2、時間軸和圖AP元素的綜合運(yùn)用（1）滾動字幕 （2）網(wǎng)頁浮動動畫（3）設(shè)置文字的陰影效果（4）幻燈片效果（5）控制圖像播放動畫 （6）制作滾動的折疊菜單（

39、7）具有預(yù)覽功能的電子相冊效果8.3在網(wǎng)頁中應(yīng)用javascript1.認(rèn)識代碼片段面板2.應(yīng)用代碼片段3.應(yīng)用舉例拋出問題，導(dǎo)入新課舉出幾個典型的帶有行為的網(wǎng)頁顯示行為的應(yīng)用，進(jìn)而引出行為的作用和相關(guān)概念（25分鐘）舉例講解行為的創(chuàng)建步驟。（10分鐘）演示常用的DW內(nèi)置行為的操作步驟和要領(lǐng)，部分調(diào)整在機(jī)房講解；（30分鐘）本部分為選講內(nèi)容。舉例講解高級行為的應(yīng)用；重點(diǎn)講解4種擴(kuò)展插件的安裝和應(yīng)用效果。（30分鐘）舉典型實(shí)例演示AP元素和行為綜合應(yīng)用效果（40分鐘）引入特效代碼，舉例講解js在Dw中的應(yīng)用。（20分鐘）作業(yè)：課后習(xí)題、題小結(jié)：通過舉例，詳細(xì)講解了AP元素、時間軸和行為的綜合運(yùn)用

40、。本節(jié)的內(nèi)容較多，步驟也繁瑣。通過視頻演示和實(shí)際操作演示，加深對行為的理解，加強(qiáng)了學(xué)生的實(shí)際操作能力。希望同學(xué)們下去自己多多練習(xí)。學(xué)完本章，大家應(yīng)該能靈活的制作出較為簡單的具有特殊效果的動態(tài)網(wǎng)頁。第9章cssAP元素疊樣式表教學(xué)目標(biāo)與要求1.了解css的概念及樣式類型2.熟練掌握css的屬性設(shè)置、能熟練操作（創(chuàng)建、導(dǎo)入、導(dǎo)出）cssAP元素疊樣式表；3.css和表格、css和div的綜合運(yùn)用教學(xué)重點(diǎn)css的概念及樣式類型；Css的創(chuàng)建及屬性設(shè)置；css和表格的綜合運(yùn)用教學(xué)難點(diǎn)Css的創(chuàng)建及屬性設(shè)置；css和表格、css和div的綜合運(yùn)用教學(xué)方法多媒體演示為主，課堂講授，師生互動，案例教學(xué)。教學(xué)

41、課時4課時第9章cssAP元素疊樣式表教學(xué)提示打開一個沒有應(yīng)用樣式設(shè)置的預(yù)先準(zhǔn)備好的網(wǎng)頁，先讓學(xué)生觀察設(shè)計視圖中的效果，然后在IE中預(yù)覽，讓學(xué)生總結(jié)顯示效果的變化，這是怎么回事呢？-沒有使用樣式。9.1css基礎(chǔ)1. css樣式表的基本概念n 樣式、cascading和cssn Css可能改變的性質(zhì)n 外部css樣式表的擴(kuò)展名是.css。2.css的5個優(yōu)點(diǎn)：3. css面板v 打開css面板的3種方法v css面板中的按鈕和功能 adobe建議用css面板作為創(chuàng)建和編輯css的主要工具。用戶可以自己創(chuàng)建AP元素疊樣式表，還可以dw附帶的AP元素疊樣式表 4.樣式表類型（理解即可）選擇器有三種

42、（常見）類型，可以創(chuàng)建4種不同選擇器類型的樣式：（1）自定義css規(guī)則（類樣式），命名規(guī)則（2）html標(biāo)簽樣式表（3）對于高級樣式（也稱ID、偽類選擇器）9.2 CSS規(guī)則詳解在“規(guī)則對話框”中，我們可以通過類型、背景、區(qū)塊、方框、邊框、列表、定位和擴(kuò)展項(xiàng)的設(shè)置，來美化頁面。在定義某個CSS樣式時，不需要對每一個項(xiàng)都進(jìn)行設(shè)置，需要什么效果，就選擇相應(yīng)的項(xiàng)進(jìn)行設(shè)置。9.3創(chuàng)建新的CSS規(guī)則 9.4應(yīng)用CSS樣式9.4.1各種樣式表的應(yīng)用l 應(yīng)用自定義CSS樣式，有下列3種方法l 對于html標(biāo)簽樣式和高級樣式，定義僅對該文檔后，會自動應(yīng)用到相應(yīng)的文檔中。l 對于外部的css樣式表：在

43、樣式面板中選擇附件樣式表按鈕，打開“鏈接外部樣式表”對話框，可以鏈接外部的CSS樣式文件。l 清除樣式:選中要清除樣式的對象,設(shè)置成“無”樣式即可。l 使用范例css樣式表9.4.2應(yīng)用舉例（參看課本p131-139示例）1.課堂實(shí)例用CSS格式化文本2.課堂實(shí)例用CSS控制表格3.用CSS控制列表4.用CSS控制背景5.用CSS控制區(qū)塊6.CSS樣式濾鏡的應(yīng)用9.5 編輯CSS規(guī)則和CSS樣式編輯CSS規(guī)則：在樣式面板中直接雙擊進(jìn)行修改。編輯CSS樣式：在樣式列表中選中需要編輯的規(guī)則的名稱，直接單擊“編輯樣式”按鈕，在彈出的“CSS規(guī)則定義”對話框中修改相應(yīng)的設(shè)置。9.6 CSS樣式的三種存

44、放方式（1）直接插入 （叫內(nèi)部標(biāo)簽）： <table style=“color:red ; font-size:10pt”>（2）嵌樣式 （ 也叫嵌入式）：位于html文件頭（<head></head>標(biāo)簽）的style標(biāo)簽內(nèi)。（3）鏈接到已創(chuàng)建的外部文件.css （統(tǒng)一風(fēng)格）：這類樣式表要保存在站點(diǎn)的common文件夾，而在html的<head></head>中引用。 <link Rel=“stylesheet” href=“文件名.css”Type =“text/css”>9.7關(guān)于沖突的CSS規(guī)則1、不沖突則共同顯示

45、。2.當(dāng)內(nèi)部的規(guī)則和外部的規(guī)則沖突時，內(nèi)部規(guī)則優(yōu)先顯示。3、如果應(yīng)用于同一文本的兩種規(guī)則的屬性發(fā)生沖突，則按就近原則顯示。4、如果有直接沖突，則自定義 CSS 規(guī)則優(yōu)先顯示。 拋出問題，引入新課打開幾個典型的應(yīng)用css的網(wǎng)頁，讓大家分析css的優(yōu)點(diǎn)，進(jìn)而引入css的定義、類型。 打開樣式面板，演示各按鈕的作用；打開css樣式創(chuàng)建的對話框，通過創(chuàng)建過程的選擇講解css的類型。通過舉例詳細(xì)講解css規(guī)則的各項(xiàng)設(shè)置內(nèi)容。先演示css創(chuàng)建的具體步驟，然后讓學(xué)生上臺操作演練。先講解應(yīng)用的方法，然后通過大量舉例講解各種樣式的創(chuàng)建和應(yīng)用 。舉了4個例子，分別是類樣式、偽類樣式、ID樣式、標(biāo)簽樣式。打開代碼視

46、圖，觀察各種樣式在代碼中的顯示位置和顯示方式。舉特例講解各種沖突解決的規(guī)則。讓學(xué)生學(xué)會在代碼視圖中修改或刪除不需要的樣式。最后總結(jié)本章所學(xué)知識，讓學(xué)生對樣式表靈活運(yùn)用。作業(yè)：1、什么是cssAP元素疊樣式表？簡述使用css樣式的優(yōu)點(diǎn)。2、css的類型、背景、區(qū)塊、方框、邊框、列表、定位、擴(kuò)展分別可以定義什么樣的設(shè)置？3制作實(shí)例.小結(jié)：本章前一部分理論較多，且窗體的節(jié)的相關(guān)概念較難理解；后一部分操作性較強(qiáng)，易掌握，學(xué)生基本都能完成操作任務(wù)，總體感覺授課效果還好。第10章（1）管理和使用站點(diǎn)資源與庫項(xiàng)目教學(xué)目標(biāo)與要求靈活使用和管理站點(diǎn)資源、庫和模板，提高網(wǎng)頁制作的速度和效率。教學(xué)重點(diǎn)資源面板的使用

47、教學(xué)難點(diǎn)庫的管理、創(chuàng)建和編輯教 學(xué) 方 法任務(wù)驅(qū)動、引導(dǎo)教學(xué)，學(xué)生自學(xué)為主，教師講授為輔，簡單演示教 學(xué) 課 時1課時第10章（1）管理和使用站點(diǎn)資源與庫項(xiàng)目教學(xué)提示10(1).1資源和庫的概念和作用10(1).2站點(diǎn)資源面板1.打開資源面板的方式 2. 站點(diǎn)資源的資源分類 3 站點(diǎn)資源的類型 4.查看和選取資源 5.添加資源 6. 刷新資源面板7.資源定位 8.管理資源面板 10(1).3創(chuàng)建、管理和編輯庫項(xiàng)目1. 3種創(chuàng)建庫項(xiàng)目的方法 創(chuàng)建的庫項(xiàng)目自動保存到站點(diǎn)的library文件夾中，若站點(diǎn)中沒有，dreamweaver則會自動創(chuàng)建該文件夾。庫項(xiàng)目的擴(kuò)展名為.lbi。2.應(yīng)用庫項(xiàng)目：在文

48、檔中應(yīng)用庫項(xiàng)目的操作步驟3.管理庫項(xiàng)目：主要有修改、重命名、重建、刪除、從源文件中分離幾個方面隨堂練習(xí)：下列關(guān)于庫的說法中不正確的一項(xiàng)是( )A庫是一種用來存儲想要在整個網(wǎng)站上經(jīng)常被重復(fù)使用或更新的頁面元素 B庫實(shí)際上是一段html源代碼 C在dreamweaver中,只有文字?jǐn)?shù)字可以作為庫項(xiàng)目,而圖片腳本則不可作為庫項(xiàng)目 D庫可以是email地址一個表格或版權(quán)信息等.舉例說明資源和庫項(xiàng)目的意義演示庫項(xiàng)目的創(chuàng)建和應(yīng)用作業(yè)：課后習(xí)題小結(jié)：知識總結(jié)：本章主要介紹了資源面板和庫項(xiàng)目的使用，學(xué)完本章應(yīng)熟練應(yīng)用站點(diǎn)資源和庫項(xiàng)目，提高制作網(wǎng)頁的效率。 第10章（2）利用模板設(shè)計網(wǎng)頁教學(xué)目標(biāo)與要求1、學(xué)會創(chuàng)

49、建模板2、巧妙使用模板創(chuàng)建風(fēng)格統(tǒng)一的頁面教學(xué)重點(diǎn)模板的創(chuàng)建、編輯和管理教學(xué)難點(diǎn)模板的創(chuàng)建、編輯和管理教 學(xué) 方 法任務(wù)驅(qū)動、引導(dǎo)教學(xué)，學(xué)生自學(xué)為主，教師講授為輔，簡單演示教 學(xué) 課 時1課時第10（2）章利用模板設(shè)計網(wǎng)頁教學(xué)提示如何提高做網(wǎng)頁的效率呢？-巧用模板。10(2).1利用模板創(chuàng)建網(wǎng)頁模板的定義、使用模板的實(shí)際意義、模板區(qū)域類型、模板的鏈接模板默認(rèn)被保存在templetes文件夾中，模板的擴(kuò)展名為：.dwt。10(2).2 創(chuàng)建模板 1. 將現(xiàn)有的文檔保存為模板2. 通過“資源”面板創(chuàng)建新的空白3.使用新建文檔對話框創(chuàng)建模板 10(2).3使用模板的可編輯區(qū)域 1、插入可編輯區(qū)v 定義

50、可編輯區(qū)域的兩種方法v 可編輯區(qū)域的命名規(guī)則：不可使用單引號、雙引號、尖括號(<>)、和與符號（&）注意：v 可將整個表格或某個單元格定義為可編輯區(qū)域，不可同時指定幾個單格為可編輯區(qū)域；v 將AP元素定義為可編輯區(qū)域時，用戶可以改變AP元素的位置，將AP元素上的內(nèi)容定義為可編輯區(qū)域時，才可以修改AP元素上的內(nèi)容。2. 刪除可編輯區(qū)域10(2).4使用可選區(qū)域1.插入可選區(qū)域2.插入可編輯的可選區(qū)域3.修改可選區(qū)域10(2).5使用重復(fù)區(qū)域10(2).6應(yīng)用模板 1. 創(chuàng)建基于模板新頁面2. 將模板應(yīng)用到現(xiàn)有文檔 （自學(xué)，容易出現(xiàn)不一致區(qū)域，建議不采用）3. 將文檔與模板分離

51、 10(2).7編輯模板10(2).8管理模板重命名模板、刪除模板、重命名可編輯區(qū)域、選擇可編輯區(qū)域舉例說明模版的作用，演示操作模板的創(chuàng)建，重點(diǎn)講解可編輯區(qū)域的插入根據(jù)已創(chuàng)建的模板創(chuàng)建新的網(wǎng)頁，體會模板的作用注意模板使用的注意事項(xiàng)作業(yè)：1、說出使用模板的使用意義。2、模板默認(rèn)被保存在哪個文件夾中，模板的擴(kuò)展名是什么？3、模板共有幾種模板區(qū)域類型？4、課后習(xí)題的頁面。小結(jié)：本章講了模板的意義、創(chuàng)建、編輯和應(yīng)用幾個問題，學(xué)完本章應(yīng)創(chuàng)建出風(fēng)格一致 第12章DW 8 站點(diǎn)的創(chuàng)建、設(shè)置與管理教學(xué)目標(biāo)與要求1.學(xué)會編輯設(shè)置和管理站點(diǎn)2.理解站點(diǎn)面板的設(shè)置使用3.能打開、編輯、刪除、上傳站點(diǎn)。教學(xué)重點(diǎn)創(chuàng)建和管理站點(diǎn)與站點(diǎn)文件教學(xué)難點(diǎn)編輯、設(shè)置和管理站點(diǎn)教學(xué)方法任務(wù)驅(qū)動、引導(dǎo)教學(xué)，學(xué)生自學(xué)為主，教師講授為輔，簡單演示教學(xué)課時1課時第12章DW 8 站點(diǎn)的創(chuàng)建、設(shè)置與管理教學(xué)提示12.1安裝和配置web服務(wù)器12.2創(chuàng)建和設(shè)置站點(diǎn)一、創(chuàng)建和設(shè)置本地站點(diǎn)：二、設(shè)置遠(yuǎn)端站點(diǎn)以下是幾種連接服務(wù)器的方式方式1.通過ftp訪問遠(yuǎn)端