戴濤 蔚繼承 梁春泉

摘 要：Web技術(shù)是互聯(lián)網(wǎng)技術(shù)的基礎(chǔ)技術(shù)之一，而對(duì)Web技術(shù)良好的掌握，可使學(xué)生具備較強(qiáng)的就業(yè)競(jìng)爭(zhēng)力。本文從《Web技術(shù)及應(yīng)用》現(xiàn)有的課程內(nèi)容和培養(yǎng)模式出發(fā)，探討了Web課程在教學(xué)過程中的突出問題，探索了案例驅(qū)動(dòng)式的《Web技術(shù)及應(yīng)用》教學(xué)模式，并從案例選擇、教學(xué)組織和考試環(huán)節(jié)三個(gè)方面提出了教學(xué)改革措施，加強(qiáng)了案例和項(xiàng)目在教學(xué)過程中的作用，提升了學(xué)生的思維能力和動(dòng)手能力，從而為學(xué)生在互聯(lián)網(wǎng)方向的后續(xù)發(fā)展打下良好的基礎(chǔ)。

關(guān)鍵詞：Web技術(shù) 案例驅(qū)動(dòng) 教學(xué)改革

中圖分類號(hào)：G642 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1673-9795（2014）03（b）-0139-02

互聯(lián)網(wǎng)的創(chuàng)新應(yīng)用，是當(dāng)前各行業(yè)進(jìn)一步發(fā)展的關(guān)鍵問題。在眾多的互聯(lián)網(wǎng)技術(shù)中，Web技術(shù)是最重要的基礎(chǔ)技術(shù)之一。學(xué)生通過Web相關(guān)技術(shù)的學(xué)習(xí)，能夠打下互聯(lián)網(wǎng)技術(shù)的學(xué)習(xí)基礎(chǔ)，從而具備互聯(lián)網(wǎng)相關(guān)行業(yè)從業(yè)的基本能力。

《Web技術(shù)及應(yīng)用》課程的授課內(nèi)容涉及Web的前端開發(fā)技術(shù)和后端開發(fā)技術(shù)，主要知識(shí)點(diǎn)包括：HTML、CSS、JavaScript、PHP（或JSP和ASP等后端開發(fā)技術(shù)）和網(wǎng)站開發(fā)工具的使用等等。目前，該課程的教學(xué)主要存在以下問題：首先，與其他的單一編程語言課程相比（如C語言、Java和C++等），本課程具有知識(shí)點(diǎn)零碎、內(nèi)容龐雜和前后關(guān)聯(lián)性較少等特點(diǎn)；其次，隨著各大互聯(lián)網(wǎng)企業(yè)不斷推出新的技術(shù)，Web技術(shù)中的新技術(shù)和新名詞也不斷更新，如Server-side JavaScript、HTML5 drag & drop和CSS animations等等，現(xiàn)有課程體系無法有效加入這些內(nèi)容，而能夠?qū)W習(xí)并掌握這些新知識(shí)卻是這些企業(yè)選擇人才的重要標(biāo)準(zhǔn)；最后，學(xué)生在校期間經(jīng)常會(huì)參與各種項(xiàng)目或競(jìng)賽，而對(duì)于信息科學(xué)的學(xué)生來講，這類活動(dòng)通常需要建立一個(gè)網(wǎng)站，如何能夠充分掌握Web技術(shù)并快速地建立有效的站點(diǎn)是學(xué)生學(xué)習(xí)本門課程的迫切需求。綜上所述，探討和研究《Web技術(shù)及應(yīng)用》課程的案例式教學(xué)改革是十分必要的。

1 案例驅(qū)動(dòng)的《Web技術(shù)及應(yīng)用》教學(xué)改革

針對(duì)《Web技術(shù)及應(yīng)用》的內(nèi)容零散、新內(nèi)容組織和快速應(yīng)用等特點(diǎn)，本文從案例選擇、教學(xué)組織和考試環(huán)節(jié)三個(gè)方面提出了教學(xué)改革建議。

1.1 案例選擇

由于本課程每一章的內(nèi)容關(guān)聯(lián)性不強(qiáng)，本門課程的案例選擇應(yīng)當(dāng)遵循以下幾點(diǎn)：首先，選擇的案例應(yīng)讓學(xué)生充分理解不同技術(shù)的優(yōu)劣。比如本門課程中CSS的布局與定位是重點(diǎn)。所以CSS布局與定位的案例應(yīng)當(dāng)先選取一個(gè)結(jié)構(gòu)較為規(guī)整的頁面，緊接著應(yīng)當(dāng)選取一個(gè)結(jié)構(gòu)不是很規(guī)整的頁面布局，同時(shí)使用HTML Table和CSS來布局，使得學(xué)生充分理解CSS布局技術(shù)的巧妙。其次，案例的選擇中應(yīng)當(dāng)通過剖析舊有技術(shù)的缺陷而引入新的技術(shù)。比如較新的HTML5，

應(yīng)當(dāng)引入使用舊HTML標(biāo)簽一個(gè)網(wǎng)頁網(wǎng)頁案例，再使用新的HTML5標(biāo)簽制作該網(wǎng)頁，說明新標(biāo)簽的優(yōu)勢(shì)。最后，應(yīng)當(dāng)在每一個(gè)主要技術(shù)學(xué)習(xí)之后提供一個(gè)較為完整的案例，這個(gè)案例不要求很復(fù)雜，但應(yīng)當(dāng)盡量包含該技術(shù)的主要內(nèi)容。

1.2 教學(xué)組織

當(dāng)選擇好相應(yīng)的案例之后，就要針對(duì)如何講好案例進(jìn)行相應(yīng)的教學(xué)組織。

首先，應(yīng)重視Web技術(shù)的角色劃分。網(wǎng)站的制作一般都需要經(jīng)過需求分析、內(nèi)容設(shè)計(jì)、美工設(shè)計(jì)和頁面制作等多個(gè)步驟，步驟與步驟之間具有較強(qiáng)的聯(lián)系，且一般由多人合作完成。以往的教學(xué)強(qiáng)調(diào)頁面制作，而忽略其他步驟，往往導(dǎo)致學(xué)生在面對(duì)制作整個(gè)網(wǎng)站時(shí)沒有頭緒。因此在案例中應(yīng)按照網(wǎng)站的制作流程設(shè)計(jì)案例，在案例的展開中引入角色劃分教學(xué)法。學(xué)生扮演在網(wǎng)站制作過程中的不同角色，每個(gè)人從自身的視點(diǎn)和需求出發(fā)，體驗(yàn)制作網(wǎng)站的完整從無到有的過程，理清概念和技術(shù)自身所處的位置。

其次，本門課程的目的不僅僅是教會(huì)學(xué)生做網(wǎng)頁，而應(yīng)當(dāng)更進(jìn)一步教會(huì)學(xué)生做網(wǎng)頁時(shí)的思維方式。通過課后對(duì)學(xué)生的調(diào)查，筆者發(fā)現(xiàn)很多學(xué)生在學(xué)習(xí)本門課程時(shí)由這樣的現(xiàn)象，即課堂上看老師做的時(shí)候明白，但自己動(dòng)手去做卻無從下手。其主要原因是老師僅僅教會(huì)了做網(wǎng)頁的步驟和方法，卻沒有交給學(xué)生遇到不同場(chǎng)景、不同風(fēng)格和不同格局時(shí)需要考慮問題的思維方式。比如在選擇使用何種HTML標(biāo)簽來表達(dá)所需內(nèi)容時(shí)，有時(shí)可以使用超鏈接來表達(dá)，也可以用段落和列表等其他標(biāo)簽來表達(dá)，這時(shí)教師最好將多種標(biāo)簽的使用各自展開講述，使得學(xué)生明白做網(wǎng)頁并不是只有一種方法，其制作過程也并不是一蹴而就。

再次，在教學(xué)的過程應(yīng)當(dāng)采用引導(dǎo)教學(xué)法。比如針對(duì)HTTP協(xié)議部分的授課，部分教師僅僅給出了協(xié)議的內(nèi)容，而沒有告訴學(xué)生協(xié)議各部分的作用。此時(shí)可以利用火狐提供的firebugs或IE提供的HTTP Watch或等工具抓取瀏覽器發(fā)送的HTTP協(xié)議數(shù)據(jù)包，通過對(duì)包頭的解析形象地說明HTTP協(xié)議核心數(shù)據(jù)的作用。再比如限于授課內(nèi)容和課時(shí)，后臺(tái)編程部分一般只能提一下，無法深入下去，導(dǎo)致學(xué)生對(duì)技術(shù)的理解出現(xiàn)偏差。這時(shí)可引入一節(jié)技術(shù)路線專題課，闡明任何技術(shù)的出現(xiàn)和使用都有其特殊的背景，引導(dǎo)學(xué)生進(jìn)入技術(shù)的應(yīng)用場(chǎng)景，真正理解技術(shù)的精髓。其組織方式可結(jié)合實(shí)際，采用對(duì)騰訊、淘寶和百度等互聯(lián)網(wǎng)公司的主要產(chǎn)品進(jìn)行分析，說明他們的業(yè)務(wù)需求和設(shè)計(jì)理念，進(jìn)而引導(dǎo)學(xué)生探討在產(chǎn)品發(fā)展各個(gè)不同階段遇到的問題，并讓學(xué)生自行選擇技術(shù)和發(fā)展路線解決這些問題，最后對(duì)其效果進(jìn)行評(píng)價(jià)，從而加深對(duì)不同后端開發(fā)技術(shù)的理解。

最后，信息科學(xué)的學(xué)生在學(xué)習(xí)中一般保持著較強(qiáng)的邏輯連貫性，并且課堂的參與性較高，這就要求改變傳統(tǒng)的以教師為中心、學(xué)生被動(dòng)接收的教學(xué)過程。還要注意的是，在《Web技術(shù)及應(yīng)用》課程開設(shè)的同時(shí)，一般會(huì)并行開設(shè)信息科學(xué)的一些基礎(chǔ)課程，如C語言、數(shù)據(jù)結(jié)構(gòu)和計(jì)算機(jī)體系結(jié)構(gòu)等等，因此還應(yīng)結(jié)合這些課程豐富實(shí)踐環(huán)節(jié)，使學(xué)生能夠充分理解Web技術(shù)的優(yōu)點(diǎn)，及其相比其他技術(shù)的缺點(diǎn)。從而將學(xué)生已學(xué)的知識(shí)融入Web課程中，增加授課效果。

1.3 考試環(huán)節(jié)

以往課程的考試形式是教師出卷，學(xué)生答卷，這種考試形式拘泥于書本知識(shí)，無法了解學(xué)生真正的能力?！禬eb技術(shù)及應(yīng)用》作為理論與實(shí)踐相結(jié)合的課程，除了要求學(xué)生了解基本概念，還應(yīng)當(dāng)具備一定的知識(shí)運(yùn)用、動(dòng)手制作和協(xié)調(diào)能力。因此除了一般的筆試環(huán)節(jié)，還可以增加項(xiàng)目開發(fā)環(huán)節(jié)。學(xué)生以3～5人為一個(gè)小組，經(jīng)過教師推薦和學(xué)生自選，確定項(xiàng)目題目。項(xiàng)目的運(yùn)行時(shí)間貫穿整個(gè)授課環(huán)節(jié)。學(xué)生通過對(duì)所學(xué)知識(shí)的掌握，完成規(guī)定的項(xiàng)目?jī)?nèi)容和相關(guān)文檔。主要內(nèi)容應(yīng)包含網(wǎng)站開發(fā)的主要的幾個(gè)步驟，包括：需求分析、網(wǎng)站規(guī)劃、美工設(shè)計(jì)和網(wǎng)站制作等環(huán)節(jié)。最后通過答辯、互評(píng)和自評(píng)等考評(píng)項(xiàng)目得分。項(xiàng)目成績(jī)比重應(yīng)不少于的整體課程成績(jī)20%，同時(shí)建議和鼓勵(lì)學(xué)生以這些項(xiàng)目為基礎(chǔ)參加學(xué)校和社會(huì)組織的各種競(jìng)賽，對(duì)于獲獎(jiǎng)項(xiàng)目給予額外加分。

2 結(jié)語

通過對(duì)案例選擇、教學(xué)組織和考核環(huán)節(jié)三個(gè)方面的改革措施，使得學(xué)生對(duì)《Web技術(shù)及應(yīng)用》的知識(shí)理解更加深入和透徹，提升項(xiàng)目和競(jìng)賽能力，從而為為培養(yǎng)知識(shí)與技能雙優(yōu)秀的互聯(lián)網(wǎng)高端人才奠定良好的基礎(chǔ)。

參考文獻(xiàn)

[1] 王媛媛，李翔.基于項(xiàng)目驅(qū)動(dòng)的“WEB開發(fā)技術(shù)”課程教學(xué)研究[J].長(zhǎng)沙大學(xué)學(xué)報(bào)，2012（5）：124-125.

[2] 劉宇超.探究網(wǎng)絡(luò)電子技術(shù)教學(xué)模式[J].知識(shí)經(jīng)濟(jì)，2013.

[3] 李長(zhǎng)鵬，孫麗麗，程濤.“任務(wù)驅(qū)動(dòng)”在“網(wǎng)頁設(shè)計(jì)與制作”教學(xué)中的探索實(shí)踐[J].科技信息，2010（22）：604.