網(wǎng)頁制作教學(xué)設(shè)計(jì)(公開課)

/19課后任務(wù)布置1、優(yōu)化網(wǎng)站2、對網(wǎng)站進(jìn)行維護(hù)管理教學(xué)反思創(chuàng)意型網(wǎng)站開發(fā)——主題網(wǎng)站建設(shè)學(xué)習(xí)任務(wù)：建設(shè)主題網(wǎng)站學(xué)習(xí)目標(biāo)通過完成本次任務(wù)，學(xué)生能夠通過多方調(diào)研明確客戶需求，撰寫需求確認(rèn)分析說明書；通過組內(nèi)討論，做好網(wǎng)站開發(fā)詳細(xì)計(jì)劃，撰寫項(xiàng)目工作計(jì)劃表；通過小組分工合作，自主探究學(xué)習(xí)，設(shè)計(jì)有特色的網(wǎng)站；通過測試，發(fā)現(xiàn)存在問題并提出解決方案；能夠展示小組作品的優(yōu)勢和特色，并能客觀評價(jià)他人；通過基于工作情境的角色扮演，熟悉網(wǎng)站開發(fā)的工作流程，并從中獲得溝通表達(dá)，解決問題的經(jīng)驗(yàn)，體驗(yàn)團(tuán)隊(duì)合作與信息共享的樂趣。建議課時(shí)： 16課時(shí)資訊【任務(wù)描述 】小李剛剛通過應(yīng)聘進(jìn)入了一家網(wǎng)頁制作公司，公司規(guī)模不大，主要業(yè)務(wù)是承接各類網(wǎng)站的制作?，F(xiàn)在公司剛接了四個(gè)不同的制作網(wǎng)站業(yè)務(wù)，分別是 花卉、海洋公園、環(huán)保、潮流 ，由于公司人數(shù)不多，所以小李要獨(dú)立負(fù)責(zé)其中一個(gè)網(wǎng)站的建設(shè)，由于時(shí)間緊迫，現(xiàn)要求小李選擇其中一個(gè)網(wǎng)站，并與策劃部進(jìn)行快速溝通和需求分析，完成資料的整理和素材的簡單加工，設(shè)計(jì)出基本框架，再通過網(wǎng)頁編輯工具完成網(wǎng)頁版面的制作和內(nèi)容元素的編輯，最后通過公司服務(wù)器發(fā)布網(wǎng)站到互聯(lián)網(wǎng)上。明確任務(wù)后，教師幫助學(xué)生理解任務(wù)要求、分析任務(wù)，并介紹創(chuàng)建站點(diǎn)、繪制草圖、表格在頁面布局中的作用，同時(shí)提供獲取資訊的方法和途徑等信息。學(xué)生根據(jù)老師的提示及任務(wù)，尋找完成任務(wù)所需要的資料。例如：1、瀏覽相關(guān)主題網(wǎng)站，參考網(wǎng)頁布局結(jié)構(gòu)2、制作網(wǎng)站總體設(shè)計(jì)說明書3.收集網(wǎng)頁素材資源，包括圖片、介紹文字、視頻等。決策在教師協(xié)調(diào)下學(xué)生自愿分組，進(jìn)行探究式學(xué)習(xí)，學(xué)生經(jīng)過討論以小組方式擬定工作過程，確定網(wǎng)頁素材，網(wǎng)頁表格的添加方式，輔助的選用，美化設(shè)計(jì)等，教師聽取學(xué)生的決策意見， 提出可行性方面的質(zhì)疑,提供指導(dǎo)意見，幫助形成方案并指導(dǎo)學(xué)生進(jìn)行方案優(yōu)化，最終做出決策，形成團(tuán)隊(duì)實(shí)施方案。1、用戶訪談，收集需求通過“策劃部門充分溝通，了解專題網(wǎng)站的基本要求，瀏覽策劃部門提供的資料，收集各種需求網(wǎng)站名稱腳本支持純HTML所用域名數(shù)據(jù)庫支持否負(fù)責(zé)部門策劃部聯(lián)系人需求訪談?dòng)涗?、引導(dǎo)需求要點(diǎn).通過與用戶溝通，引導(dǎo)用戶提出具體需求.指導(dǎo)用戶選擇與網(wǎng)站主題相關(guān)的域名，要便于訪問者使用.根據(jù)所能提供的條件，明確網(wǎng)站建設(shè)的規(guī)模.根據(jù)用戶的實(shí)際情況確定主頁要呈現(xiàn)的內(nèi)容和方式.明確網(wǎng)站所采用的語言.明確頁面的寬度和色彩風(fēng)格.明確導(dǎo)航項(xiàng)目和子頁內(nèi)容呈現(xiàn)方式.明確開發(fā)時(shí)間和后期維護(hù)要求3、需求說明確認(rèn)網(wǎng)站名稱腳本支持所用域名數(shù)據(jù)庫支持負(fù)責(zé)部門聯(lián)系人需求要點(diǎn)客戶意見和確認(rèn)簽字 計(jì)劃在需求分析的基礎(chǔ)上，網(wǎng)站建設(shè)負(fù)責(zé)人根據(jù)實(shí)際情況，明確實(shí)施目標(biāo)，確定實(shí)施方案，并將其遞交給客戶，由其負(fù)責(zé)人簽字確認(rèn)XXXXX公司網(wǎng)站建設(shè)方案書一、背景著重陳述建站的意義和目的二、系統(tǒng)分析1、開發(fā)環(huán)境明確所采用的網(wǎng)頁腳本語言，靜態(tài)網(wǎng)頁這一部分要求比較簡單2、版面要求陳述版面的寬度、長度、色彩搭配、總體風(fēng)格等情況3、支持語言明確選擇簡體中文，還是采用多語言二、設(shè)計(jì)萬案1、網(wǎng)站結(jié)構(gòu)建議以列表的方式將網(wǎng)站各欄目分層呈現(xiàn)出來2、分塊說明對每一欄目進(jìn)行詳細(xì)說明，也可以配合簡圖四、網(wǎng)站測試與維護(hù)陳述網(wǎng)站測試驗(yàn)收的環(huán)節(jié)，明確后期的維護(hù)工作如何開展以及雙方的職責(zé)五、進(jìn)度安排陳述網(wǎng)站開發(fā)各階段時(shí)間和總工期六、費(fèi)用說明建議以列表的方式羅列域名、服務(wù)器配置、網(wǎng)站開發(fā)、更新維護(hù)、推廣等各環(huán)節(jié)的費(fèi)用客戶意見：工作計(jì)劃表:計(jì)劃計(jì)劃內(nèi)容計(jì)劃完成時(shí)間負(fù)責(zé)人設(shè)計(jì)網(wǎng)站規(guī)劃書創(chuàng)建網(wǎng)站的站點(diǎn)繪制首頁的頁面布局草圖，規(guī)劃網(wǎng)站貝囿布局結(jié)構(gòu)制作網(wǎng)站首頁制作網(wǎng)站分頁發(fā)布網(wǎng)站實(shí)施學(xué)生根據(jù)計(jì)劃方案完成設(shè)計(jì)和模擬，做好相關(guān)資料的記錄，教師監(jiān)督學(xué)生的學(xué)習(xí)過程，通過【引導(dǎo)問題】和【學(xué)習(xí)思考】培養(yǎng)學(xué)生分析問題、解決問題的能力，糾正學(xué)習(xí)偏差。教師下發(fā)學(xué)習(xí)任務(wù)，學(xué)生根據(jù)學(xué)習(xí)任務(wù)做好完成任務(wù)的計(jì)劃，教師對任務(wù)重點(diǎn)難點(diǎn)進(jìn)行講解和分析，學(xué)生認(rèn)真做好知識(shí)點(diǎn)記錄，并安排好完成計(jì)劃的時(shí)間和步驟，重點(diǎn)掌握重要知識(shí)點(diǎn)，使學(xué)習(xí)計(jì)劃能夠按時(shí)完成，根據(jù)計(jì)劃方案操作完成設(shè)計(jì)任務(wù)，并做好相關(guān)記錄。由于剛開始接觸網(wǎng)頁制作，學(xué)生對軟件的使用都還沒有基礎(chǔ)，因此，本任務(wù)應(yīng)先由教師分模塊演示并講解一些重要操作，學(xué)生同步進(jìn)行模仿訓(xùn)練。而對知識(shí)掌握得相對比較熟練、操作比較快的學(xué)生，在操作過程中如果遇到問題，教師可引導(dǎo)學(xué)生查找相關(guān)的教材、教學(xué)參考書中的相關(guān)內(nèi)容或通過網(wǎng)絡(luò)獲取相關(guān)內(nèi)容，引導(dǎo)他們解決問題。而那些對知識(shí)把握得較慢的學(xué)生，則可詳細(xì)講解或建議學(xué)生反復(fù)學(xué)習(xí)相關(guān)章節(jié)的內(nèi)容。鼓勵(lì)小組成員在工作過程中互相幫助，解決在完成任務(wù)中所遇到的問題。任務(wù)一：準(zhǔn)備工作一、任務(wù)目標(biāo)能夠?yàn)g覽并整理客戶提供的資料和素材。能夠通過網(wǎng)絡(luò)搜索獲得素材。二、任務(wù)實(shí)現(xiàn).小組整理提供的資料和素材，對不足夠的素材通過網(wǎng)絡(luò)查找補(bǔ)充客戶提供的資料和素材往往隨機(jī)存放，顯得比較混亂。為了便于認(rèn)識(shí)需求和后續(xù)的制作，需要將其整理、歸類。在此過程中，利用資源管理器運(yùn)行文件夾整理，熟悉文件夾和文件的建立、復(fù)制、移動(dòng)、刪除等操作，從而增強(qiáng)對客戶業(yè)務(wù)流程的認(rèn)識(shí)，拓展后續(xù)制作的思路。任務(wù)二：站點(diǎn)建立與管理一、任務(wù)目標(biāo)能夠建立站點(diǎn)與主頁，規(guī)劃好站點(diǎn)目錄文件結(jié)構(gòu)，并對站點(diǎn)文件實(shí)施管理，二、任務(wù)實(shí)現(xiàn)站點(diǎn)創(chuàng)建與管理（1）新建站點(diǎn)站點(diǎn)不同于網(wǎng)頁，一個(gè)站點(diǎn)不僅包含大量的網(wǎng)頁文件，還包括圖片、動(dòng)畫。 、視頻、音頻等文件，并且這些文件是相互關(guān)聯(lián)的，需要通過創(chuàng)建一個(gè)站點(diǎn)來對網(wǎng)站各類元素進(jìn)行集中管理。（2）站點(diǎn)管理可以通過在站點(diǎn)中創(chuàng)建、復(fù)制、刪除文件夾和文件對象來構(gòu)建網(wǎng)站文件系統(tǒng)。一個(gè)網(wǎng)站編輯工具可以創(chuàng)建許多站點(diǎn)，可以對它們進(jìn)行統(tǒng)一管理，包括站點(diǎn)信息的修改、站點(diǎn)的復(fù)制與刪除、站點(diǎn)的導(dǎo)出與導(dǎo)入等操作。網(wǎng)站目錄結(jié)構(gòu)規(guī)劃在所創(chuàng)建的站點(diǎn)中規(guī)劃好目標(biāo)結(jié)構(gòu)。多站點(diǎn)管理將站點(diǎn)導(dǎo)出，當(dāng)系統(tǒng)重裝或更換計(jì)算機(jī)后可以重新導(dǎo)入文件，減少重新工作量。任務(wù)三：網(wǎng)頁版面布局一、任務(wù)目標(biāo)認(rèn)識(shí)常見的版面布局，能夠依據(jù)用戶需求，利用布局表格工具設(shè)計(jì)并制作出網(wǎng)頁框架。二、任務(wù)實(shí)現(xiàn)．小組討論制定網(wǎng)站主要布局形式并繪制草圖。2．小組制作版面布局，并定稿任務(wù)四：圖片編輯與修辭一、任務(wù)目標(biāo)能夠運(yùn)用網(wǎng)頁編輯軟件插入圖片對象， 并對圖片進(jìn)行編排能夠運(yùn)用簡單的處理， 使其適合網(wǎng)頁呈現(xiàn)。二、任務(wù)實(shí)現(xiàn)小組成員通過瀏覽整理后的資料包， 找到合適的圖片， 插入網(wǎng)頁相應(yīng)的位置， 如果圖片大小與 頁要求不符，不要在網(wǎng)頁編輯軟件中對圖片進(jìn)行大范圍，拉伸或縮小，要借助其他圖像處理軟件進(jìn)行處理后再插入，圖片插入網(wǎng)頁后會(huì)彈出‘保存’對話框此時(shí)保存的文件名不要使用中文，瀏覽器對中文文件名不能很好的支持。任務(wù)五 :文字編輯與修辭能夠運(yùn)用網(wǎng)頁編輯軟件輸入文字，并對文字、段落進(jìn)行排版，使其適合網(wǎng)頁呈現(xiàn)。二、任務(wù)實(shí)現(xiàn)．小組確定導(dǎo)航和欄目標(biāo)題，使用哪種類型的導(dǎo)航。.文本區(qū)域的排版，在排版中使用 CSS羊式，使網(wǎng)站的風(fēng)格統(tǒng)一。任務(wù)六：內(nèi)容頁制作與超鏈接一、任務(wù)目標(biāo)能夠使用網(wǎng)頁編輯工具，制作出與主頁風(fēng)格一致、圖文并茂的內(nèi)容頁。能夠使用超鏈接技術(shù)，實(shí)現(xiàn)網(wǎng)頁之間的鏈接，建立頁面之間的關(guān)聯(lián)。二、任務(wù)實(shí)現(xiàn)、內(nèi)容頁制作主頁制作完畢后，還有大量的內(nèi)容頁需要制作，一般情況下，主頁與內(nèi)容頁的風(fēng)格應(yīng)保持一致，小組成員各自負(fù)責(zé)一個(gè)分頁面的制作。.超鏈接小組把所有完成任務(wù)好的頁面進(jìn)行超鏈接，并沒測試。填寫主頁尾部電子郵箱 ,并做好電子郵箱的鏈接。填寫主頁尾部QQ,并做好對應(yīng)QQ用戶的應(yīng)用程序的鏈接。任務(wù)七：網(wǎng)站發(fā)布一、任務(wù)目標(biāo)能夠通過常用FTP客戶端工具上傳網(wǎng)站文件，實(shí)時(shí)網(wǎng)站對外發(fā)布，并能進(jìn)行網(wǎng)站文件的維護(hù)管理。二、任務(wù)實(shí)現(xiàn)將制好的網(wǎng)站通過leapFTP工具上傳至指定的FTP服務(wù)器。檢查、小組自我檢查評價(jià)自己的作品。分析不足之處，提出改進(jìn)措施等，完成小組和個(gè)人工作日志填寫。繼續(xù)修改作品。提交作品。展示成果：小組相互展示自己的工作成果，評估作品完成質(zhì)量，關(guān)注團(tuán)隊(duì)合作，敬業(yè)勤業(yè)等職業(yè)素養(yǎng)的評估，并提出修改建議。修改并完善作品。6、教師檢查作品。7、交流并總結(jié)經(jīng)驗(yàn)：教師對網(wǎng)頁進(jìn)行分析測試，重點(diǎn)對做得不理想的地方進(jìn)行分析，針對學(xué)生在完成任務(wù)過程中遇到的普遍問題進(jìn)行點(diǎn)評，并將技術(shù)文件歸檔，提供規(guī)范化技術(shù)文檔供學(xué)生參考。同時(shí)教師指引學(xué)生歸納總結(jié)，引導(dǎo)學(xué)生獨(dú)立構(gòu)建自己的經(jīng)驗(yàn)和知識(shí)體系。評價(jià)1、教師指導(dǎo)學(xué)生對自己的作品進(jìn)行評價(jià)，包括學(xué)生的自評和學(xué)生互評。2、教師指導(dǎo)學(xué)生對其它同學(xué)的作品進(jìn)行評價(jià)。3、教師對學(xué)生的作品進(jìn)行評價(jià)。4、指導(dǎo)學(xué)生填寫作品評價(jià)表和個(gè)人考核評價(jià)表。小組作品檢查表班級(jí)：學(xué)生姓名：學(xué)號(hào)：作品簡述檢查主體檢查內(nèi)容改進(jìn)前改進(jìn)后小組自檢存在問題改進(jìn)意見成績評定小組互檢建議成績評定互評人簽名綜合檢查建議成績評定教師簽名

注:1、學(xué)生互評，可以由學(xué)習(xí)小組長或者其他學(xué)生完成互評。2、綜合評定，可由任課教師、科代表、學(xué)習(xí)委員完成綜合評定。3、成績評定按百分制評定，最終成績的評定以改進(jìn)后的成果為