【正文】 生系統(tǒng)的掌握站點(diǎn)的創(chuàng)建及管理，了解各類站點(diǎn)的創(chuàng)建過程，并能正確的導(dǎo)出和導(dǎo)入站點(diǎn)文件。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． 站點(diǎn)的創(chuàng)建；2． 站點(diǎn)文件的管理；3． 站點(diǎn)文件的預(yù)覽；4． 站點(diǎn)地圖的生成。理論 R實(shí)踐授課學(xué)時2教學(xué)方法與手段講授法、演示法教學(xué)目的與要求利用Dreamweaver CS3熟練創(chuàng)建本地. 遠(yuǎn)程站點(diǎn)。這其實(shí)就是我們站點(diǎn)創(chuàng)建時應(yīng)該為站點(diǎn)起一個名字，并設(shè)置一個首頁，增加更多的超鏈接。三、 網(wǎng)站文件的管理（20分鐘左右）1． 文件的創(chuàng)建(鼠標(biāo)右擊站點(diǎn)新建文件；文件菜單新建；ctrl+N)；2． 文件的選擇(鼠標(biāo)點(diǎn)擊單選；按ctrl或shift鍵輔助多選)；3． 打開和編輯文件(雙擊)；4． 刪除文件；5． 重命名文件(右擊文件；F2)；6． 保存及另存為文件：ctrl+s/f12；或通過文件菜單；7． 文件的復(fù)制，移動，關(guān)閉：ctrl++x，ctrl+w；8． 消除文件只讀屬性：右擊文件選擇；9． 將文件設(shè)為首頁：和制作站點(diǎn)地圖有關(guān)；10． 給文件添加設(shè)計備注：備注文件的存放位置和文件的擴(kuò)展名。文件夾的名稱最好用顧名思義的英文，方便以后修改維護(hù)。嵌套文件夾的層數(shù)不要太多，最多不超過三層，否則超鏈接時會出錯。建立網(wǎng)站首先要在本地計算機(jī)上構(gòu)建本地站點(diǎn)來管理站點(diǎn)中的文檔，制作網(wǎng)頁，測試完畢后，上傳到Internet服務(wù)器。教學(xué)難點(diǎn)：　　測試?yán)梅?wù)器技術(shù)的站點(diǎn)；站點(diǎn)地圖創(chuàng)建的條件；遠(yuǎn)程站點(diǎn)的創(chuàng)建。站點(diǎn)的發(fā)布及網(wǎng)頁的預(yù)覽。通過兩節(jié)課的講授，感覺到學(xué)生能對本課程產(chǎn)生比較大的興趣！第 109頁課程教案（№:2）授課內(nèi)容站點(diǎn)的創(chuàng)建與管理課 型R理論 163。3． 利用網(wǎng)上資源，在百度中搜索“網(wǎng)頁配色方案”關(guān)鍵詞，下載相關(guān)的“網(wǎng)頁配色方案”文件，指導(dǎo)以后網(wǎng)頁設(shè)計中的配色問題。它們的形式與HTML有些類似，但功能更加強(qiáng)大，能夠?qū)崿F(xiàn)許多功能。主頁：是網(wǎng)站中的一個特殊網(wǎng)頁，它是在WWW上進(jìn)入網(wǎng)站的第一個網(wǎng)頁，其中包含指向其他網(wǎng)頁的超鏈接，通常主頁的名稱是固定的。網(wǎng)站：就是一個相互鏈接的網(wǎng)頁的集合，它們可以共享。教學(xué)過程設(shè)計一、 基礎(chǔ)知識1． 網(wǎng)頁簡介（15分鐘左右）網(wǎng)頁：是組成WWW（World Wide Web：萬維網(wǎng)）的基本元素，也被稱為頁面或Web頁。3． Dreamweaver8功能簡介。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． Internet信息訪問原理。實(shí)踐授課學(xué)時2教學(xué)方法與手段講授法教學(xué)目的與要求本次課程將講授網(wǎng)頁制作的基本知識，使學(xué)生了解到什么是網(wǎng)頁，網(wǎng)頁制作涉及到哪些工具、網(wǎng)頁與網(wǎng)站有什么區(qū)別，網(wǎng)頁與普通的文檔有什么區(qū)別等。它要以計算機(jī)基礎(chǔ)、計算機(jī)網(wǎng)絡(luò)技術(shù)課程的學(xué)習(xí)為基礎(chǔ)，也是進(jìn)一步學(xué)習(xí)網(wǎng)絡(luò)編輯、網(wǎng)站建設(shè)與管理課程的基礎(chǔ)。教案首頁課程名稱網(wǎng)頁設(shè)計與制作課程類型使用教材教材名稱：網(wǎng)頁設(shè)計與制作實(shí)用教程 主編：劉艷麗出版社：高等教育出版社 日期：2011年5月學(xué)時分配共64學(xué)時，其中理論36學(xué)時，實(shí)踐28學(xué)時。課程教學(xué)目的與要求該課程是三年制高職高專電子商務(wù)專業(yè)的職能課程，目標(biāo)是讓學(xué)生掌握網(wǎng)頁設(shè)計的基本概念，學(xué)會使用常用的網(wǎng)頁設(shè)計工具和相關(guān)網(wǎng)頁美工軟件，能夠設(shè)計制作常見的靜態(tài)網(wǎng)頁。主要參考書目趙喜清，崔海濤《網(wǎng)頁設(shè)計與制作》哈爾濱工業(yè)大學(xué)出版社，孫振業(yè)《網(wǎng)頁設(shè)計與制作》高等教育出版社，備注課程教案（№:1）授課內(nèi)容網(wǎng)頁制作基礎(chǔ)知識課 型R理論 163。通過講授也將使學(xué)生了解到網(wǎng)頁的組成，網(wǎng)頁語言的種類及各自特點(diǎn)；動態(tài)網(wǎng)頁與靜態(tài)網(wǎng)頁的定義；Internet信息發(fā)布的原理等等內(nèi)容。2． 什么是網(wǎng)頁？（1） 網(wǎng)頁內(nèi)容組成；（2） 網(wǎng)頁編寫語言種類及特點(diǎn)。教學(xué)難點(diǎn)：　　Internet信息訪問原理；網(wǎng)頁編寫語言種類及特點(diǎn)。不同的網(wǎng)頁通過超鏈接聯(lián)系在一起，構(gòu)成了WWW縱橫交織結(jié)構(gòu)。大的網(wǎng)站頁面數(shù)量多達(dá)幾十萬，甚至上百萬頁，小的個人網(wǎng)站也可以只包含數(shù)個頁面。2． Internet簡介（5分鐘左右）3． 了解常用的網(wǎng)頁制作工具（10分鐘左右） 如：Dreamweaver和FrontPage4． 了解美化網(wǎng)頁的主要工具（10分鐘左右）（1）圖像處理軟件：Photoshop、Fireworks、CorelDRAW等（2）動畫制作工具：Flash5． 了解網(wǎng)頁中的腳本語言（10分鐘左右）如：VBScript、JavaScript6． 了解服務(wù)器端主要技術(shù)（10分鐘左右）服務(wù)器端腳本語言：ASP、JSP、PHP、CGI等。二、了解建立網(wǎng)站的基本流程（10分鐘左右）1． 確定網(wǎng)站主題2． 搜集資料3． 規(guī)劃網(wǎng)站4． 選擇合適的制作工具5． 制作網(wǎng)頁6． 上傳測試7． 推廣宣傳8． 維護(hù)更新三、Dreamweaver CS3基礎(chǔ)（20分鐘左右）1． Dreamweaver的發(fā)展史2． Dreamweaver CS3的新功能3． Dreamweaver CS3工作區(qū)簡介4． 網(wǎng)頁文檔的基本操作作業(yè)/思考題：1． 列舉你所了解的網(wǎng)頁設(shè)計的常用工具和美化網(wǎng)頁的主要工具2． 建立網(wǎng)站的基本流程有哪些步驟？請歸納總結(jié)。教學(xué)后記：第一節(jié)課，應(yīng)首先介紹網(wǎng)站發(fā)展的前景，重點(diǎn)分解Dreamweaver和其他軟件的區(qū)別，提出利用網(wǎng)絡(luò)傳播信息，并由此講述網(wǎng)絡(luò)發(fā)展給網(wǎng)頁帶來的市場。實(shí)踐授課學(xué)時2教學(xué)方法與手段講授法教學(xué)目的與要求本次課程將講授網(wǎng)站站點(diǎn)的創(chuàng)建與管理知識，使學(xué)生了解到什么是站點(diǎn)，站點(diǎn)的種類，站點(diǎn)的作用，站點(diǎn)文件的管理。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． 站點(diǎn)的創(chuàng)建；2． 站點(diǎn)文件的管理；3． 站點(diǎn)文件的預(yù)覽；4． 站點(diǎn)地圖的生成。教學(xué)過程設(shè)計一、 站點(diǎn)（10分鐘左右）也稱“網(wǎng)站”，用來定位網(wǎng)站上的所有文件，是一系列通過超鏈接而相互聯(lián)系的網(wǎng)頁集合。二、 新建本地站點(diǎn)（20分鐘左右）1． 站點(diǎn)菜單新建站點(diǎn)2． 站點(diǎn)菜單管理站點(diǎn)新建3． 建立站點(diǎn)注意問題：（1） 用文件夾進(jìn)行分類存儲：如網(wǎng)頁文件存放在html文件夾中，圖像文件存放在images文件夾中。（2） 文件命名要合理：建議全部使用小寫的文件名稱，不要用中文文件名。文件名也要符合規(guī)范。四、 頁面預(yù)覽(F12鍵)（20分鐘左右）1． 文件菜單在瀏覽器中預(yù)覽選擇瀏覽器2． 工具欄地球土標(biāo)選擇瀏覽器：此時可通過”添加瀏覽器”選項(xiàng)來增加更多的瀏覽器3． 編輯菜單首選參數(shù)在瀏覽器中預(yù)覽不選”使用臨時文件預(yù)覽”五、 站點(diǎn)的編輯和管理（20分鐘左右）1． 站點(diǎn)管理器：文件面板(窗口菜單或F8鍵)2． 打開現(xiàn)有本地站點(diǎn)3． 查看本地和遠(yuǎn)程網(wǎng)站的文件和地圖4． 調(diào)整窗口視圖5． 保存站點(diǎn)地圖6． 重建站點(diǎn)緩存7． 站點(diǎn)編輯，復(fù)制，刪除，導(dǎo)入與導(dǎo)出：站點(diǎn)菜單管理站點(diǎn)作業(yè)/思考題：1． 在制作網(wǎng)頁前為什么要首先建立站點(diǎn)？2． 定義本地站點(diǎn)的含義是什么？3． 建立站點(diǎn)應(yīng)該注意的問題？教學(xué)后記：網(wǎng)站的站點(diǎn)，好似一個班級，應(yīng)該首先為班級起一個名稱，并配備一個班主任，然后再陸續(xù)的加入一些學(xué)生。課程教案（№:3）授課內(nèi)容了解Dreamweaver的界面及站點(diǎn)的建立課 型163。并掌握Dreamweaver的基本操作。教學(xué)難點(diǎn)：　　站點(diǎn)地圖創(chuàng)建的條件；遠(yuǎn)程站點(diǎn)的創(chuàng)建。課程教案（№:4）授課內(nèi)容HTML語言簡介課 型R理論 163。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． HTML文件的基本結(jié)構(gòu)；2． HTML語法格式；教學(xué)難點(diǎn)：　　設(shè)置網(wǎng)頁標(biāo)題；設(shè)置網(wǎng)頁關(guān)鍵字；制作滾動文字。即通過將特定的標(biāo)記放置在文本或圖片或URL前后，來達(dá)到使該段文本或圖片或URL以指定方式顯示的目的。2． HTML語法規(guī)則HTML文件以純文本格式形式存放，擴(kuò)展名為“*. html”或“*. htm”。多數(shù)HTML標(biāo)記可以嵌套，但不可以交叉。只有在設(shè)計視圖中才有用。nbsp。四、 HTML標(biāo)記舉例（55分鐘左右）1． 設(shè)置網(wǎng)頁標(biāo)題：title標(biāo)記2． 元信息標(biāo)記：meta標(biāo)記meta標(biāo)記的信息只顯示在源代碼中，瀏覽器中沒有顯示，通過設(shè)置meta標(biāo)記的不同屬性，可以定義頁面中各種元數(shù)據(jù)，如頁面的名稱、關(guān)鍵詞等多種信息。2　 behavior 表示滾動的方式，值可以是scroll（連續(xù)滾動）、slide（滑動一次）、alternate（來回滾動）。4　 Scrollamount 表示運(yùn)動速度，值是正整數(shù)，默認(rèn)為6。6　 Align表示元素的垂直對齊方式，值可以是top、bottom、middle。事件：onMouseOver=()和onMouseOut=()，表示當(dāng)鼠標(biāo)浮到以上區(qū)域的時候滾動停止和當(dāng)鼠標(biāo)移開的時候又繼續(xù)滾動。關(guān)鍵詞輸入不是越多越好，因?yàn)榇蠖鄶?shù)搜索引擎限制關(guān)鍵字的數(shù)量，所以設(shè)置關(guān)鍵字要精簡才會被搜中率高。課程教案（№:5）授課內(nèi)容網(wǎng)頁文本的使用課 型R理論 163。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． 特殊文本的輸入及使用狀態(tài)；2． 文本屬性；3． 文本列表的使用；4． 在html中的文本代碼。教學(xué)過程設(shè)計一、 文本的輸入（10分鐘左右）1． 換行與換段的輸入2． 空白字符的輸入3． 特殊符號的輸入4． 日期與時間的插入5． 水平線的插入二、 文本的編輯（20分鐘左右）1． 文本的選擇：鼠標(biāo)拖選，按住shift+光標(biāo)鍵選擇2． 文本的刪除，復(fù)制，移動，選擇性粘貼3． 查找與替換：ctrl+fl 文本對文本的替換l 帶格式文本的替換l 源代碼的替換l 文本高級及指定標(biāo)簽的替換4． 拼寫檢查：shift+F7三、 文本的屬性（15分鐘左右）1． 屬性工具欄：窗口菜單2． 設(shè)置文本的格式. 大小. 字體. 顏色（注意樣式的變化）3． 設(shè)置文本對齊方式：注意html代碼中的變化四、 文本列表（30分鐘左右）1． 項(xiàng)目列表的創(chuàng)建2． 編號列表的創(chuàng)建3． 描述性列表的創(chuàng)建五、 HTML中的文本代碼（15分鐘左右）1． 段落和換行代碼段落：p/p換行:br/2． 保留源格式代碼：pre3． 水平線代碼：hr/4． 標(biāo)題代碼：hhhhhh65． 列表代碼：ul ol li dl dt dd作業(yè)/思考題：1． 設(shè)置網(wǎng)頁中文本的字體、顏色時要注意什么問題？2． 如何修改水平線的顏色？教學(xué)后記：本節(jié)課授課前，應(yīng)更多的讓學(xué)生去回憶此前學(xué)習(xí)的word中的文本。課程教案（№:6）授課內(nèi)容建立簡單的網(wǎng)頁制作課 型163。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． 創(chuàng)建本地站點(diǎn)2． 創(chuàng)建首頁3． 在首頁輸入文本內(nèi)容4． 制作文本列表教學(xué)難點(diǎn)：1． 有序列表和無序列表的區(qū)別；2． 描述性列表的制作。發(fā)現(xiàn)網(wǎng)頁文本的特殊性。實(shí)踐授課學(xué)時2教學(xué)方法與手段講授法、演示法教學(xué)目的與要求本次課程將講授網(wǎng)頁制作過程中的圖像的使用，掌握圖像及圖像對象的插入，交互式圖像的使用。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． 圖像占位符. 鼠標(biāo)經(jīng)過圖像；2． 圖像熱區(qū)；3． 制作網(wǎng)站相冊；4． 圖像的優(yōu)化。教學(xué)過程設(shè)計一、圖像格式的介紹（5分鐘左右）1． GIF格式2． JPEG格式3． PNG格式4． 其他格式二、圖像文件的插入及屬性（20分鐘左右）1． 圖像的插入：插入菜單，站點(diǎn)面板，直接拖入到文檔2． 圖像的屬性：名稱，源文件，大小，替代，邊距，邊框3． 圖像的環(huán)繞效果三、圖像對象的插入及屬性（20分鐘左右）1． 圖像占位符2． 鼠標(biāo)經(jīng)過圖像3． 導(dǎo)航條四、圖像熱區(qū)的使用（8分鐘左右）1． 繪制熱區(qū)：矩形. 橢圓形. 多邊形2． 選擇熱區(qū)3． 調(diào)整熱區(qū)位置五、Fireworks切圖及導(dǎo)入Fireworks HTML（10分鐘左右）1． 用Fireworks制作簡單的頁面2． 利用切片工具分隔網(wǎng)頁3． 插入菜單圖像對象Fireworks HTML六、制作web相冊（10分鐘左右）1． 準(zhǔn)備制作相冊的素材圖片2． 命令菜單創(chuàng)建網(wǎng)站相冊七、利用插件制作flash相冊（7分鐘左右）1． 搜索flash相冊插件2． 下載安裝并利用工具欄制作八、圖像的優(yōu)化及格式的轉(zhuǎn)換（10分鐘左右）1． 命令菜單2． 右擊圖像作業(yè)/思考題：1． 圖像地圖的作用是什么？2． 如何插入鼠標(biāo)經(jīng)過圖像？教學(xué)后記：圖像能相對充分的表現(xiàn)頁面的內(nèi)容，適當(dāng)?shù)脑诰W(wǎng)頁中加入圖像可對頁面進(jìn)行點(diǎn)綴。課程教案（№:8）授課內(nèi)容網(wǎng)頁圖像的使用課 型163。教學(xué)重點(diǎn)與難點(diǎn)教學(xué)重點(diǎn)：1． 站點(diǎn)的創(chuàng)建；2． 文本的輸入；3． 網(wǎng)頁圖像的使用。教學(xué)過程設(shè)計實(shí)訓(xùn)內(nèi)容利用提供的素材文件，制作一個“暢想未來”的網(wǎng)站，要求如下：1. 創(chuàng)建本地站點(diǎn)文件夾，