榮姍珊 周　琢

（安徽師范大學(xué)皖江學(xué)院　安徽·蕪湖　241008）

?

基于需求分析的《網(wǎng)頁設(shè)計與制作》課程內(nèi)容模塊化設(shè)計
——以安徽師范大學(xué)皖江學(xué)院數(shù)字媒體技術(shù)專業(yè)為例

榮姍珊 周琢

（安徽師范大學(xué)皖江學(xué)院安徽·蕪湖241008）

摘要：web新技術(shù)的不斷注入，傳統(tǒng)互聯(lián)網(wǎng)的迅速發(fā)展、移動互聯(lián)網(wǎng)的蓄勢待發(fā)都對該課程的內(nèi)容結(jié)構(gòu)提出了新的要求。通過對安徽師范大學(xué)皖江學(xué)院數(shù)字媒體技術(shù)專業(yè)的在校生進行調(diào)研及需求分析，并反思了原有《網(wǎng)頁設(shè)計與制作》課程內(nèi)容設(shè)置中存在的問題，提出了建立課程內(nèi)容模塊化的方案設(shè)計。

關(guān)鍵詞：網(wǎng)頁設(shè)計與制作；需求分析；課程內(nèi)容模塊化

周琢，安徽師范大學(xué)皖江學(xué)院，碩士研究生，講師。

一、引言

一份最新的研究報告顯示，截至2014年6月，我國網(wǎng)民規(guī)模達6.32億，半年共計新增網(wǎng)民1442萬人，各類網(wǎng)站273萬個?；ヂ?lián)網(wǎng)行業(yè)需要大量從事網(wǎng)站設(shè)計、開發(fā)與運維的web前端開發(fā)人才。目前，網(wǎng)頁設(shè)計與制作課程是很多高等院校計算機專業(yè)的專業(yè)基礎(chǔ)課、數(shù)字媒體技術(shù)專業(yè)、電子商務(wù)專業(yè)、教育技術(shù)學(xué)專業(yè)、新聞傳播類專業(yè)的專業(yè)課以及一些培訓(xùn)機構(gòu)和高職院校的主干課程之一。這一切都說明了該課程的重要性。web新技術(shù)的不斷注入，傳統(tǒng)互聯(lián)網(wǎng)的迅速發(fā)展、移動互聯(lián)網(wǎng)的蓄勢待發(fā)都對該課程的內(nèi)容結(jié)構(gòu)提出了新的要求。為了滿足學(xué)生的學(xué)習(xí)需求和市場的人才需求，對該課程的傳統(tǒng)內(nèi)容進行增刪重構(gòu)已刻不容緩。

二、需求分析內(nèi)涵

需求分析（needs analysis）是指在課程設(shè)計和實施的過程中，設(shè)計人員和教師通過內(nèi)省、訪談、觀察和問卷等對學(xué)生的主觀與客觀需求進行調(diào)查分析，從而確定學(xué)生學(xué)什么和如何學(xué)。Hutchinson和Waters（2002）將需求分為兩大類別：目標需求（target needs）和學(xué)習(xí)需求（learning needs）。目標需求指的是學(xué)習(xí)者在將來目標場景里所需要做的事情。學(xué)習(xí)需求指的是為了達到目標場景的需求，學(xué)習(xí)者所需要具備的知識和能力。由此可見，需求分析的關(guān)鍵是找出學(xué)生現(xiàn)有的網(wǎng)頁設(shè)計能力與預(yù)期應(yīng)達到的能力之間的差距，從而指導(dǎo)教師科學(xué)合理地構(gòu)建課程內(nèi)容。

三、需求調(diào)查分析

課題組通過對前程無憂和智聯(lián)招聘兩個大型招聘網(wǎng)站中對網(wǎng)頁設(shè)計師的崗位要求，整理分析出目標需求，再對我校數(shù)字媒體技術(shù)專業(yè)的學(xué)生就《網(wǎng)頁設(shè)計與制作》課程的學(xué)習(xí)效果和需求展開網(wǎng)絡(luò)問卷調(diào)查，分析學(xué)生的學(xué)習(xí)需求。

（一）市場的人才需求

課題組分別以“web前端開發(fā)”、“網(wǎng)頁設(shè)計師”、“網(wǎng)頁制作”為職位關(guān)鍵字，篩選出對無經(jīng)驗“應(yīng)屆畢業(yè)生”的崗位要求，分析后發(fā)現(xiàn)，這些職位需求普遍涵蓋以下技術(shù)：①運用Photoshop設(shè)計網(wǎng)頁；②利用HTML+CSS布局頁面；③掌握Javascript技術(shù)；④HTML5+CSS3技術(shù)。不同的關(guān)鍵字對崗位要求的側(cè)重又有所不同，比如“web前端開發(fā)“對②③的要求都是”精通“的級別，不僅要掌握Javascript技術(shù)，而且必須至少會熟練使用一種框架?！本W(wǎng)頁設(shè)計師“則側(cè)重對①的要求。隨著移動互聯(lián)網(wǎng)的不斷滲透，對④的要求也被提上日程。因此，本課程的內(nèi)容應(yīng)該針對以上4種技術(shù)進行設(shè)置，不同的專業(yè)，課程核心內(nèi)容的設(shè)置應(yīng)該略有不同。

（二）學(xué)生的學(xué)習(xí)需求

課題組就我校數(shù)字媒體技術(shù)專業(yè)的學(xué)生對《網(wǎng)頁設(shè)計與制作》課程的教學(xué)效果和學(xué)習(xí)需求開展了調(diào)查。本次調(diào)查受訪人數(shù)為86人，回收有效問卷86份。調(diào)查結(jié)果統(tǒng)計如下表1：

表1　調(diào)查結(jié)果統(tǒng)計表

課題組進一步對Q3和Q4兩個問題進行了交叉分析（見表2），結(jié)果顯示對Photoshop感興趣的學(xué)生完成本課程希望能夠精通Photoshop設(shè)計網(wǎng)頁這項技能的高達61.9％，對HTML+ CSS感興趣的學(xué)生完成本課程希望能夠精通頁面布局技術(shù)的高達70.21％，而對Javascript感興趣的學(xué)生完成本課程希望能夠精通Javascript腳本的卻只有56％，希望能夠精通頁面布局技術(shù)的卻高達72％，對HTML5+CSS3感興趣的學(xué)生完成本課程希望能夠精通HTML5+CSS3的只有54.17％，希望能夠精通頁面布局技術(shù)的卻高達62.5％。通過對學(xué)生的訪談了解到，感興趣卻不給自己定高目標的原因是：怕自己底子薄，學(xué)不好。

表2 Q3與Q4的交叉表

綜上需求分析的調(diào)查結(jié)果說明以下幾點：

1.課程內(nèi)容的設(shè)置應(yīng)以崗位需求為導(dǎo)向，涵蓋Photoshop、頁面布局、Javascript和HTML5+CSS3技術(shù)。

2.結(jié)合專業(yè)特點和學(xué)生的學(xué)習(xí)需求將Photoshop和頁面布局技術(shù)作為核心模塊，Javascript技術(shù)和HTML5+CSS3則注重基礎(chǔ)，消除學(xué)生的學(xué)習(xí)顧慮，真正實現(xiàn)藝術(shù)與技術(shù)這兩個要素的結(jié)合。

四、原有課程內(nèi)容存在的問題

（一）結(jié)構(gòu)不合理、內(nèi)容陳舊。

原來的課程內(nèi)容僅包含Photoshop和HTML+CSS這兩塊教學(xué)內(nèi)容，忽略了Javascript技術(shù)。沒有及時在陳舊的、目前使用較少的內(nèi)容上縮減課時，突出重點，提高授課效率，比如表格布局、框架等。只有將陳舊的知識縮減剔除，才能將Javascript技術(shù)、移動互聯(lián)網(wǎng)時代的技術(shù)熱點HTML5+CSS3引入進課程，以確保課程內(nèi)容與市場需求、學(xué)生需求保持匹配。

（二）偏代碼輕設(shè)計

課題組在與學(xué)生的訪談中發(fā)現(xiàn)，我校數(shù)字媒體技術(shù)專業(yè)的學(xué)生有扎實的Photoshop軟件使用基礎(chǔ)，因此他們在之前的調(diào)查中希望能夠精通Photoshop設(shè)計網(wǎng)頁這項技能的高達61.9％。相反，教師正因為考慮到他們有很好的Photoshop使用基礎(chǔ)，原來課程內(nèi)容設(shè)置中雖然包含Photoshop，但并未把如何設(shè)計網(wǎng)頁當(dāng)成核心來處理，沒有把他們的優(yōu)勢當(dāng)成著力點加以訓(xùn)練。鑒于目前響應(yīng)式網(wǎng)頁技術(shù)和HTML5+CSS3等新技術(shù)的引入，可以將Photoshop、網(wǎng)頁藝術(shù)設(shè)計打包成一個模塊作為重點知識。

五、課程內(nèi)容模塊化方案設(shè)計

通過對安徽師范大學(xué)皖江學(xué)院數(shù)字媒體技術(shù)專業(yè)的在校生進行調(diào)研及需求分析，并反思了原有《網(wǎng)頁設(shè)計與制作》課程內(nèi)容設(shè)置中存在的問題，提出了建立課程內(nèi)容模塊化的方案設(shè)計。如圖1所示，該課程主要包括以下四個模塊，即網(wǎng)頁藝術(shù)設(shè)計模塊、網(wǎng)頁布局技術(shù)模塊、Javascript模塊和響應(yīng)式網(wǎng)頁設(shè)計模塊，下面詳細介紹各模塊。

網(wǎng)頁藝術(shù)設(shè)計模塊包含網(wǎng)頁版式設(shè)計、色彩搭配、文字設(shè)計、Banner設(shè)計、頁面設(shè)計和切圖技術(shù)這幾部分內(nèi)容，詳見圖2。其中網(wǎng)頁版式設(shè)計、色彩搭配、頁面設(shè)計和切圖技術(shù)為必講內(nèi)容，目的是讓學(xué)生了解網(wǎng)頁美工設(shè)計的一般流程，引導(dǎo)學(xué)生如何高效制作專業(yè)美觀的網(wǎng)站界面。

圖1　

圖2　網(wǎng)頁藝術(shù)設(shè)計模塊

圖3　網(wǎng)頁布局技術(shù)模塊

網(wǎng)頁布局技術(shù)模塊包含HTML和CSS兩部分內(nèi)容，基于Dreamweaver軟件展開，詳見圖3。此塊內(nèi)容是本課程的基礎(chǔ)，也是核心。通過實例講解了CSS各個屬性的使用方法和怎樣使用CSS進行頁面布局，從語法到應(yīng)用逐步遞進，強化學(xué)生利用布局技術(shù)解決實際問題的能力。利用表格布局網(wǎng)頁和利用框架制作網(wǎng)頁為選講內(nèi)容，因為在目前網(wǎng)頁設(shè)計領(lǐng)域，CSS作為替代表格布局的方法已經(jīng)廣泛使用。

Javascript技術(shù)模塊包含Javascript語法、AJAX基礎(chǔ)和Jquery應(yīng)用三部分內(nèi)容，詳見圖4。其中Javascript語法為必講內(nèi)容，AJAX基礎(chǔ)和Jquery應(yīng)用為選講內(nèi)容。從初學(xué)者角度出發(fā)，通過豐富多彩的實例，詳細介紹使用JavaScript語言進行程序開發(fā)應(yīng)該掌握的各方面技術(shù)。

響應(yīng)式網(wǎng)頁設(shè)計模塊包含HTML5和CSS3兩個部分的內(nèi)容，詳見圖5。此模塊作為網(wǎng)頁布局技術(shù)模塊的一個延伸，可根據(jù)實際課時決定教學(xué)內(nèi)容。

六、結(jié)語

傳統(tǒng)的網(wǎng)頁設(shè)計與制作課程必須與時俱進。筆者從事本門課程教學(xué)的八年時間里，已有意識地進行過一些教學(xué)內(nèi)容的改革和教學(xué)方法的創(chuàng)新，但一直沒有形成規(guī)范的課程模塊方案，希望本文提到的課程內(nèi)容模塊化設(shè)計可以給從事該課程教學(xué)的教師提供參考。

參考文獻：

［1］符雪青.基于“需求分析”的大學(xué)英語后續(xù)選修課程的調(diào)查研究與思考［J］.外語電化教學(xué)，2014（3）

［2］張偉娜.《網(wǎng)頁設(shè)計與制作》課程教學(xué)的探討與實踐［J］.中國教育信息化，2008（3）

［3］呂英莉，范玲.基于需求分析的商務(wù)英語模塊化課程體系研究［J］.北京城市學(xué)院學(xué)報，2012（6）

中圖分類號：G642

文獻標識碼：A

文章編號：1009-8534（2016）03-155-02

基金項目：本文系安徽省質(zhì)量工程項目（項目批號：2014gxk145）：《網(wǎng)頁設(shè)計與制作》精品資源共享課程的成果之一。

作者簡介：榮姍珊，安徽師范大學(xué)皖江學(xué)院，碩士研究生，講師；