《教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)》課程教學(xué)大綱
一、課程基本信息
(一)課程代碼及課程名稱
1.課程代碼:08193151
2.課程名稱(中/英文): 教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)(Educational web design and website construction)
(二)課程類別及課程性質(zhì)
專業(yè)限選課
(三)學(xué)時及學(xué)分:
總學(xué)時數(shù):48;總學(xué)分?jǐn)?shù):3。
其中,講授學(xué)時:32 ,實踐(實驗)學(xué)時:16。
(四)適用專業(yè)及開設(shè)學(xué)期
適用專業(yè):教育技術(shù)學(xué)(本科)
開設(shè)學(xué)期:第4學(xué)期
(五)先修課程與后續(xù)課程
先修課程:圖像編輯技術(shù)、數(shù)據(jù)庫技術(shù)基礎(chǔ)、網(wǎng)絡(luò)技術(shù)基礎(chǔ)
后續(xù)課程:網(wǎng)站建設(shè)實踐
二、課程簡介
《教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)》是一門講授網(wǎng)頁設(shè)計與開發(fā)相關(guān)知識的入門級課程,也是一門將學(xué)生之前學(xué)習(xí)的大學(xué)計算機基礎(chǔ)、高級程序設(shè)計、網(wǎng)絡(luò)技術(shù)基礎(chǔ)、圖像編輯技術(shù)等課程較好地應(yīng)用于實踐的應(yīng)用性課程,是將學(xué)生的理論性學(xué)習(xí)為主過渡到應(yīng)用性學(xué)習(xí)為主的過渡性課程。
三、教學(xué)目的與基本要求
(一)該課程教學(xué)目的與專業(yè)培養(yǎng)要求對應(yīng)關(guān)系矩陣
培養(yǎng)要求
課程名稱 | 培養(yǎng) 要求1 | 培養(yǎng) 要求2 | 培養(yǎng) 要求3 | 培養(yǎng) 要求4 | 培養(yǎng) 要求5 | 培養(yǎng) 要求6 | 培養(yǎng) 要求7 | 培養(yǎng) 要求8 |
教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè) | ● | ● | ○ | ● | ● | ● |
說明:表格要清晰展示該課程與每項培養(yǎng)要求達(dá)成的關(guān)聯(lián)度情況,關(guān)聯(lián)度強的用“●”標(biāo)識,關(guān)聯(lián)度中等的用“◎”標(biāo)識,關(guān)聯(lián)度弱的用“○”標(biāo)識;每門課程與4-8項(底線為總培養(yǎng)要求的50%)培養(yǎng)要求相關(guān)聯(lián)。
(二)教學(xué)目的
通過本課程的學(xué)習(xí),學(xué)生應(yīng)當(dāng)達(dá)到以下四點核心目標(biāo)及一點附加目標(biāo):
核心目標(biāo)一是掌握HTML、CSS及Javascript的基本語法;
核心目標(biāo)二是掌握基本的網(wǎng)頁設(shè)計知識;
核心目標(biāo)三是了解網(wǎng)頁設(shè)計的最新發(fā)展;
核心目標(biāo)四是能夠利用各種設(shè)計軟件制作出較為規(guī)范完整的網(wǎng)頁作品;
附加目標(biāo)是部分學(xué)生晉升為初級網(wǎng)頁設(shè)計師。
(三)教學(xué)要求
通過本課程的學(xué)習(xí),學(xué)生應(yīng)當(dāng)對網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)的整個流程有所了解,并重點掌握網(wǎng)頁前端開發(fā)的三大基本語言HTML、CSS及Javascript,在課程結(jié)束后具備制作較為規(guī)范的教育網(wǎng)站的能力。
四、教學(xué)內(nèi)容
第一章 網(wǎng)頁設(shè)計基礎(chǔ)(共4學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握超文本標(biāo)記語言、層疊樣式表、網(wǎng)頁腳本語言及動態(tài)網(wǎng)頁等基本概念,了解常用的網(wǎng)頁設(shè)計軟件,熟悉網(wǎng)頁設(shè)計的基本流程。
(二)本章教學(xué)重點與難點
重點:
1. 超文本標(biāo)記語言、層疊樣式表、網(wǎng)頁腳本語言及動態(tài)網(wǎng)頁等基本概念
2. 網(wǎng)頁設(shè)計的基本流程
難點:超文本標(biāo)記語言、層疊樣式表、網(wǎng)頁腳本語言及動態(tài)網(wǎng)頁等基本概念
(三)教學(xué)內(nèi)容
1.超文本標(biāo)記語言、層疊樣式表、網(wǎng)頁腳本語言及動態(tài)網(wǎng)頁等基本概念。
2.常用的網(wǎng)頁設(shè)計軟件。
3.網(wǎng)頁設(shè)計的基本流程。
第二章 HTML入門(共4學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握HTML的基本語法,掌握HTML中與頁面布局和文字相關(guān)的標(biāo)簽,掌握表格標(biāo)簽及超鏈接標(biāo)簽,了解框架標(biāo)簽及表單標(biāo)簽。
(二)本章教學(xué)重點與難點
重點:
1.HTML的基本語法
2.HTML中與頁面布局和文字相關(guān)的標(biāo)簽
3.表格標(biāo)簽及超鏈接標(biāo)簽
難點:表格標(biāo)簽及超鏈接標(biāo)簽
(三)教學(xué)內(nèi)容
1.HTML的基本語法。
2.HTML中與頁面布局和文字相關(guān)的標(biāo)簽。
3.表格標(biāo)簽及超鏈接標(biāo)簽。
4.框架標(biāo)簽及表單標(biāo)簽。
第三章 網(wǎng)站建設(shè)基礎(chǔ)與網(wǎng)頁中的色彩知識(共2學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握網(wǎng)站建設(shè)中涉及到的基本概念(WWW、域名、URL),了解網(wǎng)頁建設(shè)的一般流程,熟悉網(wǎng)頁色彩搭配的原理。
(二)本章教學(xué)重點與難點
重點:
1.網(wǎng)站建設(shè)中涉及到的基本概念(WWW、域名、URL)
2.網(wǎng)頁色彩搭配的原理
難點:網(wǎng)頁色彩搭配的原理
(三)教學(xué)內(nèi)容
1.網(wǎng)站建設(shè)中涉及到的基本概念(WWW、域名、URL)。
2.網(wǎng)頁建設(shè)的一般流程。
3.網(wǎng)頁色彩搭配的原理。
第四章 使用表格排列網(wǎng)頁數(shù)據(jù)(共4學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握網(wǎng)站的基本結(jié)構(gòu)與網(wǎng)頁的基本構(gòu)成,了解常見的網(wǎng)頁布局方法,掌握常見的網(wǎng)頁布局,掌握常見的網(wǎng)頁圖像格式,熟悉如何利用切片優(yōu)化網(wǎng)頁圖片。
(二)本章教學(xué)重點與難點
重點:
1. 網(wǎng)站的基本結(jié)構(gòu)與網(wǎng)頁的基本構(gòu)成
2. 常見的網(wǎng)頁布局
3. 常見的網(wǎng)頁圖像格式
4. 利用切片優(yōu)化網(wǎng)頁圖片
難點:利用切片優(yōu)化網(wǎng)頁圖片
(三)教學(xué)內(nèi)容
1.網(wǎng)站的基本結(jié)構(gòu)與網(wǎng)頁的基本構(gòu)成。
2.常見的網(wǎng)頁布局。
3.常見的網(wǎng)頁圖像格式。
4. 利用切片優(yōu)化網(wǎng)頁圖片。
第五章 CSS專題(共2學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握CSS的基本語法。
(二)本章教學(xué)重點與難點
重點:CSS的基本語法
難點:CSS的基本語法
(三)教學(xué)內(nèi)容
CSS的基本語法。
第六章 利用CSS+Div布局網(wǎng)頁(共2學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握CSS布局基礎(chǔ)知識,掌握CSS布局方法。
(二)本章教學(xué)重點與難點
重點:
1. CSS布局基礎(chǔ)知識
2. CSS布局方法
難點:CSS布局方法
(三)教學(xué)內(nèi)容
1.CSS布局基礎(chǔ)知識。
2. CSS布局方法。
第七章 Javascript專題(共6學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握J(rèn)avascript的基本語法,理解Javascript中的DOM模型,熟悉Javascript的高級語法。
(二)本章教學(xué)重點與難點
重點:
1. Javascript的基本語法
2. Javascript中的DOM模型
3.Javascript的高級語法
難點:Javascript中的DOM模型
(三)教學(xué)內(nèi)容
1.Javascript的基本語法。
2. Javascript中的DOM模型。
3. Javascript的高級語法
第八章 動態(tài)網(wǎng)頁開發(fā)入門篇(共2學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),掌握動態(tài)網(wǎng)頁與靜態(tài)網(wǎng)頁的概念,熟悉動態(tài)網(wǎng)頁開發(fā)語言。
(二)本章教學(xué)重點與難點
重點:
1. 動態(tài)網(wǎng)頁與靜態(tài)網(wǎng)頁的概念
2. 動態(tài)網(wǎng)頁開發(fā)語言
難點:動態(tài)網(wǎng)頁開發(fā)語言
(三)教學(xué)內(nèi)容
1.動態(tài)網(wǎng)頁與靜態(tài)網(wǎng)頁的概念。
2. 動態(tài)網(wǎng)頁開發(fā)語言。
第九章 網(wǎng)站發(fā)布入門篇(共2學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),熟悉網(wǎng)頁設(shè)計與網(wǎng)站開發(fā)流程,熟悉網(wǎng)站發(fā)布的幾種常見方式。
(二)本章教學(xué)重點與難點
重點:
1. 網(wǎng)頁設(shè)計與網(wǎng)站開發(fā)流程
2. 網(wǎng)站發(fā)布的幾種常見方式
難點:網(wǎng)站發(fā)布的幾種常見方式
(三)教學(xué)內(nèi)容
1.網(wǎng)頁設(shè)計與網(wǎng)站開發(fā)流程。
2. 網(wǎng)站發(fā)布的幾種常見方式。
第十章 網(wǎng)頁與網(wǎng)站終結(jié)篇(共2學(xué)時)
(一)本章教學(xué)目的和要求
通過本章學(xué)習(xí),了解網(wǎng)頁設(shè)計的未來。
(二)本章教學(xué)重點與難點
重點:網(wǎng)頁設(shè)計的未來
難點:網(wǎng)頁設(shè)計的未來
(三)教學(xué)內(nèi)容
1.網(wǎng)頁設(shè)計的未來。
2. 已學(xué)知識點回顧。
五、教學(xué)時數(shù)分配
《教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)》課程教學(xué)時數(shù)分配表
總學(xué)時:48 學(xué)分:3
章次 | 章標(biāo)題名稱 | 學(xué)時小計 | 講授 學(xué)時 | 實驗 學(xué)時 | 實踐 學(xué)時 | 討論、習(xí)題課等學(xué)時 |
第一章 | 網(wǎng)頁設(shè)計基礎(chǔ) | 4 | ||||
第二章 | HTML入門 | 4 | 2 | |||
第三章 | 網(wǎng)站建設(shè)基礎(chǔ)與網(wǎng)頁中的色彩知識 | 2 | 2 | |||
第四章 | 使用表格排列網(wǎng)頁數(shù)據(jù) | 4 | 2 | |||
第五章 | CSS專題 | 2 | 2 | |||
第六章 | 利用CSS+Div布局網(wǎng)頁 | 2 | 2 | |||
第七章 | Javascript專題 | 6 | 4 | |||
第八章 | 動態(tài)網(wǎng)頁開發(fā)入門篇 | 2 | 2 | |||
第九章 | 網(wǎng)站發(fā)布入門篇 | 2 | ||||
第十章 | 網(wǎng)頁與網(wǎng)站終結(jié)篇 | 2 |
六、實驗內(nèi)容與學(xué)時分配
《教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè)》課程實驗教學(xué)一覽表
序號 | 項目名稱 | 內(nèi)容提要 | 學(xué)時 | 實驗類型(演示、驗證、綜合、設(shè)計等) | 是否為 開放實驗 |
1 | 實驗1:HTML入門 | 認(rèn)識Notepad++、制作簡單的網(wǎng)頁 | 2 | 綜合 | |
2 | 實驗2:熟悉Dreamweaver的工作環(huán)境 | Dreamweaver的安裝破解、熟悉Dreamweaver CS6的工作環(huán)境 | 2 | 綜合 | |
3 | 實驗3:使用表格排列網(wǎng)頁數(shù)據(jù) | “廠”型布局、表格排版 | 2 | 綜合 | |
4 | 實驗4:CSS專題 | 掌握基本的CSS語法、在DW中編輯CSS | 2 | 綜合 | |
5 | 實驗5:CSS + Div布局網(wǎng)頁 | 理解CSS中的box model、掌握基本的CSS布局方法 | 2 | 綜合 | |
6 | 實驗6:Javascript專題(上) | Javascript基本語法、學(xué)會在HTML中使用Javascript | 2 | 綜合 | |
7 | 實驗7:Javascript專題(下) | 掌握J(rèn)avascript的高級語法、學(xué)會利用Javascript實現(xiàn)交互 | 2 | 綜合 | |
實驗8:網(wǎng)頁前端專題 | 掌握網(wǎng)頁前端設(shè)計的基本流程 | 2 | 綜合 |
七、本課程的實踐環(huán)節(jié)
項目實踐環(huán)節(jié)共32學(xué)時,以項目驅(qū)動的方式通過小組合作完成一個完整的網(wǎng)站作品。
序號 | 時數(shù) | 實 驗 名 稱 | 實驗內(nèi)容 |
1 | 4 | Part 1:網(wǎng)頁設(shè)計優(yōu)秀作品點評 | 網(wǎng)頁設(shè)計優(yōu)秀作品展示與點評 |
2 | 4 | Part 2:網(wǎng)站設(shè)計與建設(shè)團隊項目立項 | 分組進(jìn)行網(wǎng)站設(shè)計與建設(shè)開題匯報 |
3 | 4 | Part 3:階段性成果匯報(網(wǎng)站框架與設(shè)計方案) | 分組進(jìn)行網(wǎng)站設(shè)計方案匯報 |
4 | 16 | Part 4:網(wǎng)站建設(shè)階段 | 分組依照網(wǎng)站設(shè)計方案構(gòu)建網(wǎng)站 |
5 | 4 | Part 5:網(wǎng)站建設(shè)成果匯報 | 分組進(jìn)行網(wǎng)站建設(shè)成果匯報 |
八、主要的教學(xué)方法與教學(xué)手段
1.課程與教學(xué)方法、教學(xué)手段對應(yīng)關(guān)系矩陣
課程名稱 | 對應(yīng)的教學(xué)方式方法 | ||||||||||||
講授法 | 啟發(fā)式 | 討論法 | 案例法 | 項目教學(xué) | 實驗室 實驗 | 技能訓(xùn)練 | 研究與設(shè)計 | 小組教學(xué) | 個別教學(xué) | 課程作業(yè) | 課外閱讀及自學(xué)鍛煉 | ||
教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè) | ? | ? | ? | ? | ? | ? | ? | ? |
說明:每門課程應(yīng)使用多種教學(xué)方式方法,在相應(yīng)的教學(xué)方式方法中打“√”。
2.主要采用的幾種教學(xué)方法和手段
課堂講授,課堂討論
九、考核與成績評定
1. 該課程與評價方法對應(yīng)關(guān)系矩陣
課程名稱 | 對應(yīng)的評價方法 | |||||||||
課堂表現(xiàn) | 實驗報告 | 項目作業(yè)或報告 | 課程作業(yè)或報告 | 口試 | 口頭報告 | 上機操作 | 實踐操作 | 期中考核 | 期末考核 | |
教育網(wǎng)頁設(shè)計與網(wǎng)站建設(shè) | ? | ? | ? | ? |
說明:每門課程應(yīng)使用多種評價方式,注重過程評價,實現(xiàn)平時成績、期中成績與期末成績相結(jié)合,在相應(yīng)的評價方法中打“√”。
2.具體考核與成績評定辦法
課程總評成績=平時作業(yè)*0.25+平時表現(xiàn)*0.15 +期末作品*0.6
十、推薦教材及參考書
(一)推薦教材
《HTML CSS Javascript 網(wǎng)頁制作從入門到精通》,劉西杰,張婷 著,人民郵電出版社
(二)參考書
無
十一、其他需要說明的問題
無