《網(wǎng)站與網(wǎng)頁設(shè)計》課程教學(xué)大綱

“網(wǎng)站與網(wǎng)頁設(shè)計”課程教學(xué)大綱課程編號：08072020課程名稱：網(wǎng)站與網(wǎng)頁設(shè)計/Websiteandwebdesign學(xué)時：32 學(xué)分：2適用專業(yè)：計算機(jī)科學(xué)與技術(shù)、軟件工程、網(wǎng)絡(luò)工程開課學(xué)期：5開課部門：數(shù)計學(xué)院先修課程：計算機(jī)文化基礎(chǔ)考核要求：1．平時考勤：30%；2．考試成績：70%使用教材及主要參考書：劉增杰主編，《HTML5+CSS3+JAVASCRIPT網(wǎng)頁設(shè)計》，清華大學(xué)出版社，2014年一、課程的性質(zhì)和任務(wù)當(dāng)我們使用瀏覽器進(jìn)入互聯(lián)網(wǎng)的虛擬世界，首先映入眼前的便是網(wǎng)站的首頁，一個好的首頁能夠帶動瀏覽者的想象情境，增加視覺感官的想象空間，同時也決定了網(wǎng)站是否能夠永續(xù)經(jīng)營，能否帶來無可限量的商機(jī)。如何設(shè)計和制作出一個功能強(qiáng)大并吸引人的網(wǎng)站，是網(wǎng)頁設(shè)計師和制作者的向往。制作一個網(wǎng)站需要很多的技術(shù)，包括圖像設(shè)計和處理、網(wǎng)頁的動畫效果和最終合成網(wǎng)頁等。這門課程開設(shè)的目的就是讓學(xué)生掌握這些技術(shù)?！毒W(wǎng)站與網(wǎng)頁設(shè)計》是一門操作性和實踐性很強(qiáng)的課程。本課程的主要內(nèi)容有網(wǎng)頁編輯與制作軟件FrontPage、DreamweaverMX、HTML基礎(chǔ)知識、CSS樣式表、JavaScript、網(wǎng)頁設(shè)計思想，并簡單介紹了圖像處理軟件FireworksMX和矢量動畫編輯與制作軟件FlashMX。教材體現(xiàn)網(wǎng)頁制作技術(shù)的特點(diǎn)，注重實用性和操作性。全書共分入門篇、提高篇、設(shè)計篇三篇。綜合講述了網(wǎng)頁制作中的網(wǎng)頁編輯工具、HTML、Web圖像制作以及網(wǎng)頁中動畫設(shè)計的基本概念和基本操作技能。書中文字?jǐn)⑹龊唵蚊髁?、通俗易懂。由淺入深、循序漸進(jìn)，符合學(xué)習(xí)者的認(rèn)知規(guī)律。書中列舉了大量的實例，并配套有實驗指導(dǎo)書。利用這些資源可以構(gòu)建全新的教學(xué)模式，最大限度地調(diào)動學(xué)生的興趣和自我能動性，為學(xué)習(xí)者提供理想的學(xué)習(xí)環(huán)境。二、教學(xué)目的與要求《網(wǎng)站與網(wǎng)頁設(shè)計》是計算機(jī)科學(xué)與技術(shù)專業(yè)開設(shè)的一門很重要的實踐環(huán)節(jié)課程。通過本課程學(xué)習(xí)，要求了解當(dāng)今網(wǎng)頁制作的基本風(fēng)格，理解網(wǎng)頁制作的全程步驟。掌握網(wǎng)頁制作和設(shè)計的基礎(chǔ)知識，掌握CSS樣式表和動態(tài)網(wǎng)頁JavaScript等綜合運(yùn)用并學(xué)會網(wǎng)頁三頁個關(guān)鍵軟件工具的使用。課程的教學(xué)要求大體上分為三個層次：了解、理解和掌握。了解：是能正確判別有關(guān)概念和方法；理解：是能正確表達(dá)有關(guān)概念和方法的含義；掌握：是在理解的基礎(chǔ)上加以靈活應(yīng)用。三、學(xué)時分配章節(jié)課程內(nèi)容學(xué)時1網(wǎng)頁設(shè)計的基礎(chǔ)22普通主頁的制作43HTML的認(rèn)識64CSS樣式表65動態(tài)網(wǎng)頁以及JavaScript26網(wǎng)頁構(gòu)圖與色彩27網(wǎng)站設(shè)計思想28網(wǎng)站建設(shè)29Flash與Photoshop的學(xué)習(xí)6四、教學(xué)中應(yīng)注意的問題 注意多使用實例注意培養(yǎng)學(xué)生的實際動手能力五、教學(xué)內(nèi)容

第1章網(wǎng)頁設(shè)計的基礎(chǔ)1.基本內(nèi)容：

1.1Internet網(wǎng)簡介

1.2網(wǎng)頁的概述

1.3網(wǎng)頁制作工具

1.4制作前的準(zhǔn)備工作2.教學(xué)基本要求：1.1-1.4要求了解3.教學(xué)重點(diǎn)難點(diǎn)：1.1和1.44.教學(xué)建議：通過本章學(xué)習(xí)充分調(diào)動學(xué)生學(xué)習(xí)積極性第2章普通主頁的制作1.基本內(nèi)容：2.1制作時應(yīng)該注意的原則

2.2用FrontPage制作網(wǎng)頁

2.3用DreamWeaver制作網(wǎng)頁2.教學(xué)基本要求：2.1和2.2要求了解2.3要求掌握3.教學(xué)重點(diǎn)難點(diǎn)：2.34.教學(xué)建議：重在比較2.2和2.3之后,選擇使用DreamWeaver軟件的用戶較多的原因第3章HTML的認(rèn)識1.基本內(nèi)容：3.1HTML基本結(jié)構(gòu)

3.2頁面排版的基本元素

3.3清單列表的設(shè)計

3.4表格

3.5圖片與多媒體

3.6在網(wǎng)頁中建立超鏈接

3.7框架網(wǎng)頁的學(xué)習(xí)

3.8交互網(wǎng)頁的制作2.教學(xué)基本要求：所有內(nèi)容要求全部掌握3.教學(xué)重點(diǎn)難點(diǎn)：3.4和3.74.教學(xué)建議：不要求個人寫出完整的HTML代碼,可結(jié)合使用DreamWeaver教學(xué)第4章CSS樣式表1.基本內(nèi)容：

4.1CSS樣式的定義和使用

4.2CSS過濾器效果

4.3CSS樣式在DreamWeaver中的使用2.教學(xué)基本要求：所有內(nèi)容要求全部掌握3.教學(xué)重點(diǎn)難點(diǎn)：4.34.教學(xué)建議：結(jié)合DreamWeaver中CSS的使用

第5章動態(tài)網(wǎng)頁以及JavaScript1.基本內(nèi)容：

5.1動態(tài)網(wǎng)頁的認(rèn)識

5.2使用DreamWeaver制作動態(tài)網(wǎng)頁的幾個特效

5.3JavaScript的使用2.教學(xué)基本要求：學(xué)會在DreamWeaver中行為的應(yīng)用3.教學(xué)重點(diǎn)難點(diǎn)：5.24.教學(xué)建議：通過幾個特效的介紹來認(rèn)識JavaScript的使用

第6章網(wǎng)頁構(gòu)圖與色彩1.基本內(nèi)容：6.1頁面的重心平衡6.2頁面色彩以及圖片的格式6.3圖像的優(yōu)化6.4頁面構(gòu)圖方法6.5文本色彩體系2.教學(xué)基本要求：理解構(gòu)圖和色彩網(wǎng)頁設(shè)計中的作用3.教學(xué)重點(diǎn)難點(diǎn)：6.2和6.34.教學(xué)建議：盡量結(jié)構(gòu)網(wǎng)站實例去比較,建立自己的網(wǎng)頁設(shè)計基礎(chǔ)知識第7章網(wǎng)站設(shè)計思想1.基本內(nèi)容：7.1定位網(wǎng)站主題和名稱7.2定位網(wǎng)上CI形象7.3確定欄目和板塊7.4確定網(wǎng)站的目錄結(jié)構(gòu)和鏈接結(jié)構(gòu)7.5確定網(wǎng)站的整體風(fēng)格和創(chuàng)意設(shè)計7.6首頁設(shè)計7.7版面布局的竅門7.8網(wǎng)頁設(shè)計的通用規(guī)則7.9網(wǎng)頁字體的設(shè)置7.10網(wǎng)頁中表格的應(yīng)用7.11網(wǎng)頁設(shè)計師風(fēng)格的形成2.教學(xué)基本要求：建立起自己的網(wǎng)站設(shè)計風(fēng)格3.教學(xué)重點(diǎn)難點(diǎn)：7.17.27.47.67.77.104.教學(xué)建議：多展示實例來引導(dǎo)學(xué)生建立網(wǎng)站設(shè)計思想

第8章網(wǎng)站建設(shè)1.基本內(nèi)容：8.1網(wǎng)站設(shè)計的原則與頁面風(fēng)格8.2個人網(wǎng)站的結(jié)構(gòu)8.3網(wǎng)站目錄結(jié)構(gòu)組