《網(wǎng)頁(yè)設(shè)計(jì)》教學(xué)大綱.doc

網(wǎng)頁(yè)設(shè)計(jì)教學(xué)大綱課程英文名： Webpage Design課程代碼：15450030學(xué) 分：2總學(xué)時(shí)：36課程性質(zhì)：專(zhuān)業(yè)課考核方式：機(jī)試課程類(lèi)別：專(zhuān)業(yè)選修課開(kāi)課單位：計(jì)算機(jī)科學(xué)與技術(shù)系先修課程：大學(xué)計(jì)算機(jī)基礎(chǔ)適用專(zhuān)業(yè)：本科層次市場(chǎng)營(yíng)銷(xiāo)專(zhuān)業(yè)一、教學(xué)目標(biāo)通過(guò)本課程的學(xué)習(xí)，使學(xué)生了解有關(guān)Web網(wǎng)站建設(shè)的基本概念與方法，掌握網(wǎng)頁(yè)設(shè)計(jì)制作的方法，HTML超文本標(biāo)記語(yǔ)言的使用，相關(guān)美學(xué)的知識(shí)與網(wǎng)頁(yè)制作流程。主要掌握HTML語(yǔ)言用，了解Dreamweaver的基本功能和使用方法,以及本課程相關(guān)技術(shù)的發(fā)展趨勢(shì)。二、教學(xué)要求通過(guò)本課程的學(xué)習(xí)要求學(xué)生掌握網(wǎng)頁(yè)設(shè)計(jì)與制作的基本方法與程序，掌握基本的語(yǔ)言和相關(guān)軟件以及設(shè)計(jì)基本技巧。不但能獨(dú)立完成簡(jiǎn)單的網(wǎng)頁(yè)制作方法，還要增強(qiáng)合作精神，實(shí)現(xiàn)多人合作完成較大網(wǎng)站的制作。本課程教學(xué)由簡(jiǎn)入深，主要采用以下教學(xué)方法：（1）指定教材中的經(jīng)典實(shí)例，讓學(xué)生操作實(shí)現(xiàn)。（2）參觀與模仿精彩優(yōu)秀的網(wǎng)站，了解其效果實(shí)現(xiàn)方法，并將其應(yīng)用到實(shí)驗(yàn)中。（3） 綜合運(yùn)用基本知識(shí)點(diǎn)，實(shí)現(xiàn)復(fù)雜綜合功能。（一）要求教學(xué)過(guò)程注意以下幾方面內(nèi)容:1、注意所涉及的網(wǎng)頁(yè)設(shè)計(jì)的基本概念，基本原理的學(xué)習(xí)，每堂課都加有案例講行講解，避免有理論，沒(méi)實(shí)踐。 2、加強(qiáng)實(shí)踐教學(xué)環(huán)節(jié)。依據(jù)本課程的特點(diǎn)，增強(qiáng)學(xué)生的動(dòng)手能力，教師的講解與學(xué)生實(shí)習(xí)相結(jié)合，避免有實(shí)踐，沒(méi)理論。3、充分利用多媒體與講解、演示與講解、網(wǎng)絡(luò)查閱瀏覽等教學(xué)手段，每節(jié)課根據(jù)教學(xué)內(nèi)容的不同運(yùn)用啟發(fā)式、情境式等教學(xué)方法。4、要把當(dāng)前最新的知識(shí)介紹給學(xué)生，使學(xué)生學(xué)以致用，增加就業(yè)機(jī)會(huì)。（二）作業(yè)：重要章節(jié)布置實(shí)習(xí)題目，以鞏固學(xué)生的學(xué)習(xí)效果，促進(jìn)其多思考，培養(yǎng)學(xué)生的創(chuàng)意和設(shè)計(jì)能力。（三）考試：采取上機(jī)考試形式進(jìn)行考核，考試內(nèi)容詳見(jiàn)考試方案，考試最終以作品形式上交。結(jié)合本學(xué)科的特點(diǎn)，注重學(xué)生的實(shí)際動(dòng)手能力、基本知識(shí)和基本技能的程度和運(yùn)動(dòng)用所學(xué)知識(shí)聯(lián)系和解決實(shí)際問(wèn)題的能力。作品內(nèi)容細(xì)致，采分點(diǎn)要覆蓋教材的各章節(jié)。作品按班級(jí)保留，作為原始資料，以備日后教學(xué)評(píng)估使用，期末考試成績(jī)占總成績(jī)的60%，平實(shí)驗(yàn)成績(jī)20分，平時(shí)課堂及出勤情況20分；期末考試中上機(jī)考試30分，綜合實(shí)例制作70分。三、學(xué)時(shí)分配章目教 學(xué) 內(nèi) 容教學(xué)時(shí)數(shù)一二三四五六七八九網(wǎng)頁(yè)的基礎(chǔ)知識(shí)HTML簡(jiǎn)介為網(wǎng)頁(yè)添加圖像和鏈接CSS樣式表在網(wǎng)頁(yè)中應(yīng)用表格在網(wǎng)頁(yè)中應(yīng)用框架在網(wǎng)頁(yè)中應(yīng)用層在網(wǎng)頁(yè)中應(yīng)用表單JavaScript入門(mén)以及Dreamweaver的使用222222222合計(jì)18四、教學(xué)方法1、課程教學(xué)與討論(18課時(shí)): 運(yùn)用啟發(fā)式、討論式、案例驅(qū)動(dòng)等教學(xué)方法闡釋教學(xué)知識(shí)點(diǎn)，通過(guò)對(duì)作業(yè)演示，總結(jié)教學(xué)重點(diǎn)，分析并討論學(xué)生作品的優(yōu)劣之處，激發(fā)學(xué)生學(xué)習(xí)興趣。2、上機(jī)實(shí)驗(yàn)和討論 (18課時(shí)): 采用實(shí)例操作，合理安排實(shí)驗(yàn)題目，分析并討論實(shí)例制作思路，激發(fā)學(xué)生創(chuàng)意思維，提高設(shè)計(jì)技巧。3、讓學(xué)生結(jié)合所學(xué)知識(shí)進(jìn)行設(shè)計(jì)，利用綜合實(shí)例制作，檢驗(yàn)學(xué)生知識(shí)技能的掌握程度，提升學(xué)生的上機(jī)實(shí)驗(yàn)動(dòng)手能力。五、參考書(shū)目1. 劉瑞新，張兵義，趙子江等編著，網(wǎng)頁(yè)設(shè)計(jì)與制作教程（第4版），機(jī)械工業(yè)出版社，2009年2. 吳代文主編，網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)與實(shí)訓(xùn)，清華大學(xué)出版社，2011年3. (美)Elizabeth Castro，HTML XHTML CSS基礎(chǔ)教程(第6版)，人民郵電出版社，2007年六、大綱內(nèi)容第一章 網(wǎng)頁(yè)的基礎(chǔ)知識(shí)（2課時(shí)）【教學(xué)目標(biāo)與要求】了解網(wǎng)頁(yè)設(shè)計(jì)的基本知識(shí)和概念?！局攸c(diǎn)難點(diǎn)】網(wǎng)頁(yè)設(shè)計(jì)基本知識(shí)?！窘虒W(xué)內(nèi)容】第一節(jié) 什么是網(wǎng)頁(yè) 一、網(wǎng)頁(yè)和網(wǎng)站 介紹網(wǎng)站和網(wǎng)頁(yè)的概念與區(qū)別二、網(wǎng)頁(yè)的分類(lèi)根據(jù)不同分類(lèi)方式的分類(lèi)方法三、網(wǎng)頁(yè)設(shè)計(jì)中常用術(shù)語(yǔ)介紹萬(wàn)維網(wǎng)、瀏覽器、URL、FTP、HTTP、IP、域名、超鏈接、HTML、XML和XHTML等。第二節(jié) 開(kāi)發(fā)網(wǎng)頁(yè)的工具一、 靜態(tài)網(wǎng)頁(yè)的開(kāi)發(fā)工具二、 動(dòng)態(tài)網(wǎng)頁(yè)的開(kāi)發(fā)工具第二章 HTML簡(jiǎn)介（2課時(shí)）【教學(xué)目標(biāo)與要求】學(xué)會(huì)利用記事本編寫(xiě)簡(jiǎn)單的網(wǎng)頁(yè)，掌握基本的HTML標(biāo)簽和語(yǔ)法【重點(diǎn)難點(diǎn)】HTML標(biāo)簽的使用?！窘虒W(xué)內(nèi)容】第一節(jié) 初識(shí)HTML 一、HTML語(yǔ)法二、HTML文檔的結(jié)構(gòu)三、HTML基本標(biāo)簽第二節(jié) 使用HTML標(biāo)簽編輯文本一、 文本排版二、 文本的屬性樣式三、 文本列表第三章 為網(wǎng)頁(yè)添加圖像和鏈接（2課時(shí)）【教學(xué)目標(biāo)與要求】為網(wǎng)頁(yè)添加圖像和鏈接，并進(jìn)行修飾?！局攸c(diǎn)難點(diǎn)】利用HTML標(biāo)簽為網(wǎng)頁(yè)添加圖像和鏈接?！窘虒W(xué)內(nèi)容】第一節(jié) 插入圖像 一、圖像的基礎(chǔ)知識(shí)二、在HTML文檔中插入圖像三、在HTML文檔中設(shè)置背景顏色第二節(jié) 設(shè)置網(wǎng)頁(yè)鏈接一、鏈接的基礎(chǔ)知識(shí)二、在HTML文檔中插入超級(jí)鏈接第四章 CSS樣式表（2課時(shí)）【教學(xué)目標(biāo)與要求】學(xué)會(huì)各種CSS的創(chuàng)建、CSS的使用方式、CSS相關(guān)代碼?！局攸c(diǎn)難點(diǎn)】CSS樣式表的創(chuàng)建。【教學(xué)內(nèi)容】第一節(jié) 了解CSS樣式 一、什么是CSS？第二節(jié) CSS基本的規(guī)則和寫(xiě)法 一、使用類(lèi)class和標(biāo)志id鏈接樣式表二、創(chuàng)建選擇器第三節(jié) 用CSS來(lái)修飾頁(yè)面文本一、修飾頁(yè)面文本字體二、修飾文本的字號(hào)三、修飾段落行高第四節(jié) 給頁(yè)面對(duì)象添加顏色 一、設(shè)置對(duì)象的顏色第五章 在網(wǎng)頁(yè)中應(yīng)用表格（2課時(shí)）【教學(xué)目標(biāo)與要求】學(xué)習(xí)網(wǎng)頁(yè)中表格的創(chuàng)建、編輯和使用?！局攸c(diǎn)難點(diǎn)】表格的創(chuàng)建、設(shè)置。【教學(xué)內(nèi)容】第一節(jié) 表格創(chuàng)建和編輯操作 一、表格的創(chuàng)建二、行、列操作三、單元格操作四、設(shè)置表格屬性五、設(shè)置單元格屬性第二節(jié) 修飾單元格一、 通過(guò)CSS修飾單元格的邊框二、 編輯單元格中的內(nèi)容第六章 在網(wǎng)頁(yè)中應(yīng)用框架（2課時(shí)）【教學(xué)目標(biāo)與要求】認(rèn)識(shí)框架集、框架概念，會(huì)使用框架進(jìn)行頁(yè)面布局?！局攸c(diǎn)難點(diǎn)】框架創(chuàng)建?！窘虒W(xué)內(nèi)容】第一節(jié) 框架操作一、 創(chuàng)建各種框架二、 修飾框架三、 框架集中頁(yè)面之間的鏈接第七章 在網(wǎng)頁(yè)中應(yīng)用層（2課時(shí)）【教學(xué)目標(biāo)與要求】認(rèn)識(shí)層，繪制層，利用層排版?！局攸c(diǎn)難點(diǎn)】層的繪制。【教學(xué)內(nèi)容】第一節(jié) 認(rèn)識(shí)和創(chuàng)建層 一、什么是層二、層的作用第二節(jié) 定制層的display屬性第八章 在網(wǎng)頁(yè)中應(yīng)用表單（2課時(shí)）【教學(xué)目標(biāo)與要求】學(xué)習(xí)什么是表單，表單包括哪些元素?！局攸c(diǎn)難點(diǎn)】表單的作用?！窘虒W(xué)內(nèi)容】第一節(jié) 表單的工作原理一、 創(chuàng)建表單二、 表單域第二節(jié) 多種樣式表單Text文本框、復(fù)選框、單選按鈕等第九章 JavaScript入門(mén)以及Dreamweaver的使用（2課時(shí)）【教學(xué)目標(biāo)與要求】了解Javascript，學(xué)會(huì)使用Dreamweaver?！局攸c(diǎn)難點(diǎn)】學(xué)會(huì)使用Dreamweaver?！窘虒W(xué)內(nèi)容】第一節(jié) JavaScript的基本語(yǔ)法 一、Javascript中的標(biāo)識(shí)符和保留關(guān)鍵字二、Javascript語(yǔ)法的特殊規(guī)則。第二節(jié) JavaScript的數(shù)據(jù)類(lèi)型 一、常量二、變量三、數(shù)據(jù)類(lèi)型轉(zhuǎn)