41《規(guī)劃網(wǎng)站及網(wǎng)站設(shè)計(jì)初步》教師課案

1、4.1網(wǎng)站的規(guī)劃設(shè)計(jì)課標(biāo)（綱要、考綱）要求網(wǎng)站的概念 A級(jí)要求網(wǎng)站的規(guī)劃與設(shè)計(jì) B級(jí)要求教學(xué)目標(biāo)1.知識(shí)與技能 （1）理解網(wǎng)站、網(wǎng)頁(yè)、主頁(yè)的概念及網(wǎng)站的結(jié)構(gòu)（2）了解網(wǎng)站建設(shè)的前期準(zhǔn)備工作，學(xué)會(huì)如何規(guī)劃、設(shè)計(jì)一個(gè)網(wǎng)站2.過(guò)程與方法教師引導(dǎo)與學(xué)生自主探究相結(jié)合，達(dá)到科學(xué)、合理地進(jìn)行網(wǎng)站規(guī)劃、設(shè)計(jì)的目的。3.情感與價(jià)值觀通過(guò)親歷規(guī)劃一個(gè)網(wǎng)站的過(guò)程，培養(yǎng)學(xué)生思考問(wèn)題的縝密性和科學(xué)性。教學(xué)重點(diǎn)、難點(diǎn)重點(diǎn)：規(guī)劃、設(shè)計(jì)一個(gè)網(wǎng)站。難點(diǎn)：科學(xué)、合理地進(jìn)行網(wǎng)站的規(guī)劃。課時(shí)安排1課時(shí)教學(xué)設(shè)計(jì)打開的“學(xué)生素材”文件夾，打開其中的“班級(jí)主頁(yè)”文件夾，瀏覽網(wǎng)頁(yè)文件index.htm，理解下面的幾個(gè)概念。一、認(rèn)識(shí)網(wǎng)站1.

2、網(wǎng)站：因特網(wǎng)上具有相似性質(zhì)、共同內(nèi)容的一組信息資源。2.網(wǎng)頁(yè)：用HTML語(yǔ)言寫成的文件。3.主頁(yè)：用來(lái)表示訪問(wèn)某個(gè)網(wǎng)站時(shí)出現(xiàn)的第一個(gè)頁(yè)面。文件名通常為index.htm 。思考：網(wǎng)站、網(wǎng)頁(yè)、主頁(yè)之間有什么樣的關(guān)系呢？網(wǎng)站是由若干個(gè)網(wǎng)頁(yè)組成的，網(wǎng)頁(yè)是網(wǎng)站的元素。而主頁(yè)即網(wǎng)站中的第一個(gè)頁(yè)面。4.網(wǎng)站結(jié)構(gòu)包括：樹狀結(jié)構(gòu)(如圖1)、線性結(jié)構(gòu)(如圖2)、網(wǎng)狀結(jié)構(gòu)(如圖3)結(jié)構(gòu)如圖： （1） （2） （3）思考：“網(wǎng)站1”文件夾中的網(wǎng)站屬于哪一種網(wǎng)站結(jié)構(gòu)？（樹形結(jié)構(gòu)）二、規(guī)劃、設(shè)計(jì)網(wǎng)站引入：通過(guò)本章的學(xué)習(xí)我們將一起制作一個(gè)以“宣傳班級(jí)”為主題的網(wǎng)站，本節(jié)課我們先來(lái)規(guī)劃、設(shè)計(jì)一下該網(wǎng)站，希望大家能積極參與討

3、論，多出好點(diǎn)子。在規(guī)劃網(wǎng)站時(shí)我們需要對(duì)網(wǎng)站的主題、名稱、欄目、版面、整體風(fēng)格等做一個(gè)整體的分析。提問(wèn)：那么什么是網(wǎng)站的主題、名稱、欄目、版面結(jié)構(gòu)和整體風(fēng)格呢？我們先一起來(lái)熟悉一下。教師以素材庫(kù)中的一個(gè)網(wǎng)站為例作簡(jiǎn)單演示并介紹。提問(wèn)：我們將要制作的網(wǎng)站的主題已經(jīng)確定了，那么哪位同學(xué)愿意為我們的班級(jí)網(wǎng)站取一個(gè)好聽的名字呢？教師提示：給網(wǎng)站取名時(shí)需要注意： 1.要與主題緊密相關(guān) 2.要有意義 3.要上口、悅耳、易記 4.注意名稱是否合法、合情、合理學(xué)生思考、討論（教師引導(dǎo)）確定網(wǎng)站名稱。（學(xué)生記錄，填寫表格）表格如下：高一年級(jí)網(wǎng)站規(guī)劃表 高一（ ）班 姓名： 小組長(zhǎng)： 網(wǎng)站主題網(wǎng)站名稱網(wǎng)站欄目版面結(jié)

4、構(gòu)班級(jí)主題網(wǎng)站提問(wèn)：接下來(lái)，你們覺得我們這個(gè)網(wǎng)站需要開設(shè)哪些欄目呢？教師提示：欄目設(shè)計(jì)時(shí)需要注意：1.要緊扣主題，盡可能刪除與主題無(wú)關(guān)的欄目2.盡可能將網(wǎng)站最有吸引力的內(nèi)容列在欄目上3.盡可能方便訪問(wèn)者的瀏覽和查詢。學(xué)生分組交流討論，提出較多可選用的網(wǎng)站欄目的名稱，請(qǐng)各小組選擇其中的至少六個(gè)欄目作為我們后續(xù)網(wǎng)站制作的欄目。（學(xué)生記錄，填寫表格）引導(dǎo)：我們平時(shí)瀏覽的網(wǎng)頁(yè)版面非常豐富，大家一起閱讀課本P83頁(yè)，了解幾種常見網(wǎng)頁(yè)的版面結(jié)構(gòu)（“廠”字型、“口”字型、自由式）學(xué)生分組交流討論，確定本小組網(wǎng)站的版面結(jié)構(gòu)。（學(xué)生記錄，填寫表格）引導(dǎo)并提問(wèn)：網(wǎng)站能不能從一開始就吸引住訪問(wèn)者跟網(wǎng)站的整體風(fēng)格關(guān)系

5、非常大，請(qǐng)大家閱讀教材84-87頁(yè)，思考一下網(wǎng)站的整體風(fēng)格與哪些因素有關(guān)呢？網(wǎng)站的整體風(fēng)格與網(wǎng)站標(biāo)志、標(biāo)準(zhǔn)色彩、標(biāo)準(zhǔn)字體密切相關(guān)。請(qǐng)學(xué)生瀏覽素材中“網(wǎng)站風(fēng)格對(duì)比”文件中的三類網(wǎng)站的主頁(yè)面（政府、學(xué)校、個(gè)人），并填寫下表：網(wǎng)站名稱網(wǎng)站標(biāo)志網(wǎng)站類型頁(yè)面主色調(diào)主要字體清華大學(xué)學(xué)校網(wǎng)站藍(lán)色、白色、灰色宋體江蘇省人大網(wǎng)政府網(wǎng)站紅色、白色、黑色宋體個(gè)人網(wǎng)站個(gè)人網(wǎng)站白色、黑色、紅色宋體小結(jié)：樹立網(wǎng)站整體風(fēng)格的具體要求（設(shè)計(jì)網(wǎng)站標(biāo)志的方法、網(wǎng)站色彩的采用原則、網(wǎng)站常用的字體）課堂任務(wù)：請(qǐng)大家繼續(xù)完善表格，收集網(wǎng)站素材（文字、圖片、音頻、視頻等信息）并分類存放到相應(yīng)文件夾中，請(qǐng)小組長(zhǎng)合理進(jìn)行組員間的分工。提示：

6、收集素材時(shí)注意的原則：1.要注意對(duì)收集來(lái)的素材分類2.文件名要易懂易記，便于調(diào)用3.注意保護(hù)知識(shí)產(chǎn)權(quán)，避免侵犯別人的版權(quán)教師展示部分學(xué)生收集的素材并稍作評(píng)價(jià)。鞏固練習(xí)：1.用來(lái)對(duì)整個(gè)網(wǎng)站進(jìn)行概括性介紹的網(wǎng)頁(yè)稱為該網(wǎng)站的【 B 】 。A.封面 B.主頁(yè) C.歡迎頁(yè) D.目錄頁(yè)2.網(wǎng)站首頁(yè)默認(rèn)的文件名一般為【 B 】 。A.Logo.gif B.index.htm C.E-mail D.ad.htm3.網(wǎng)站樹立整體形象的關(guān)鍵是【 A 】 。A.標(biāo)志、色彩和字體 B.表格、圖片和文字C.音頻、視頻和文字 D.計(jì)劃、欄目和版面4下列哪一個(gè)不屬于常見的網(wǎng)站結(jié)構(gòu)【 C 】 。A.線性結(jié)構(gòu) B.樹狀結(jié)構(gòu) C.星形結(jié)構(gòu) D.網(wǎng)狀結(jié)構(gòu)總結(jié)：通過(guò)本節(jié)課的學(xué)習(xí)，我們了解了什