乒乓球俱樂部信息化教學(xué)平臺(tái)的實(shí)現(xiàn)與實(shí)施

【摘 要】本文對(duì)某一化工類職業(yè)技術(shù)學(xué)院乒乓球俱樂部的信息化教學(xué)平臺(tái)進(jìn)行了具體的實(shí)現(xiàn)與實(shí)施。實(shí)現(xiàn)包括美工部分和代碼部分，實(shí)施則有測(cè)試和運(yùn)行兩過程。

【關(guān)鍵詞】乒乓球俱樂部；信息化；教學(xué)平臺(tái)；實(shí)現(xiàn)；實(shí)施

1.平臺(tái)的功能概述

乒乓球俱樂部信息化教學(xué)平臺(tái)，本文簡(jiǎn)稱平臺(tái)，是為了解決諸如會(huì)員信息統(tǒng)計(jì)、教學(xué)中不定期的測(cè)試與成績(jī)公布、會(huì)員課外活動(dòng)統(tǒng)計(jì)、期末論文的批量批閱、新聞公告的發(fā)布與訂閱等等需求而設(shè)計(jì)的，是為了滿足信息化時(shí)代乒乓球運(yùn)動(dòng)的教與學(xué)而開發(fā)的。[1]

整個(gè)平臺(tái)分為前臺(tái)瀏覽網(wǎng)頁(yè)與后臺(tái)管理系統(tǒng)兩部分——前臺(tái)以界面方式提供瀏覽功能，而后臺(tái)則以菜單方式提供具體操作。其中，前臺(tái)瀏覽網(wǎng)頁(yè)的部分具體項(xiàng)目如圖1，后臺(tái)管理系統(tǒng)的部分具體操作菜單見圖2。[2]

圖1 前臺(tái)瀏覽界面圖

圖2 后臺(tái)管理系統(tǒng)圖

從兩圖中可以看出，前臺(tái)主要是實(shí)現(xiàn)網(wǎng)頁(yè)瀏覽功能，因而，對(duì)它的實(shí)現(xiàn)與實(shí)施較為簡(jiǎn)單，只需要靜態(tài)網(wǎng)頁(yè)就可以辦到，所要考慮的主要問題可能是它的頁(yè)面的美觀與否以及瀏覽時(shí)候的方便與否，也就是主要要考慮前臺(tái)瀏覽頁(yè)面的網(wǎng)頁(yè)設(shè)計(jì)問題。但即便如此，所瀏覽網(wǎng)頁(yè)的內(nèi)容，是需要從后臺(tái)中自動(dòng)產(chǎn)生的。因此，后臺(tái)的實(shí)現(xiàn)與實(shí)施至關(guān)重要，而且，不是簡(jiǎn)單的靜態(tài)網(wǎng)頁(yè)就可以辦到的。而通過分析，我們可以看到，后臺(tái)不管功能多少，主要用到的，還是數(shù)據(jù)的添加、刪除、修改與查詢這四大基本操作。比如，添加考試、錄入成績(jī)、添加留言等屬于數(shù)據(jù)的添加功能，修改信息、管理考試、管理成績(jī)、管理留言等則用到數(shù)據(jù)的修改功能，而查看分組則屬于數(shù)據(jù)的查詢功能，此外，管理考試、管理成績(jī)、管理留言等也必然包含數(shù)據(jù)的刪除功能。

2.平臺(tái)的實(shí)現(xiàn)

在整個(gè)平臺(tái)中，前臺(tái)網(wǎng)頁(yè)瀏覽部分幾乎完全不需要?jiǎng)討B(tài)功能，而只需要進(jìn)行美工設(shè)計(jì)，而后臺(tái)管理系統(tǒng)則完全相反，只需要?jiǎng)討B(tài)功能的實(shí)現(xiàn)，而幾乎不需要考慮美觀的需求。因此，我們將整個(gè)平臺(tái)的實(shí)現(xiàn)，分為（前臺(tái)瀏覽網(wǎng)頁(yè)的）美工實(shí)現(xiàn)和（后臺(tái)管理系統(tǒng)的）代碼實(shí)現(xiàn)兩部分。

2.1 平臺(tái)的美工實(shí)現(xiàn)

在首頁(yè)的頁(yè)面設(shè)計(jì)上，我們以簡(jiǎn)潔為主，采用由上到下版面依次增加的三段式——上段為介紹區(qū)，其中左半部分為內(nèi)部設(shè)計(jì)的俱樂部徽標(biāo)和自行書寫的俱樂部名字及網(wǎng)址，右半部分為功能區(qū)，包括登錄功能、密碼恢復(fù)、設(shè)為首頁(yè)和加入收藏功能；整個(gè)上段顏色設(shè)為淡藍(lán)，與徽標(biāo)的主題顏色一致，并且作為功能區(qū)的底色極為映襯，絲毫不影響功能區(qū)的文字識(shí)別。中段為頻道區(qū)，較窄的上面部分為可鏈接的具體頻道，包括首頁(yè)、論壇、動(dòng)態(tài)、教學(xué)、比賽、事記、留言和管理共8個(gè)頻道，顏色設(shè)為深灰，以凸顯白色的頻道名文字；更寬的下半部分為圖片區(qū)，也按圖片大小分為窄中寬三段，圖片不可鏈接。下段為通告區(qū)（其實(shí)就是動(dòng)態(tài)部分），包括左片的新聞中心、右片的友情鏈接和中片的教學(xué)公告——整個(gè)區(qū)域?yàn)樯钏{(lán)底色：新聞中心既提供新聞中心四字文字鏈接，也有圖片輪顯功能，還有新聞標(biāo)題鏈接，占了整個(gè)新聞區(qū)面積的3/5強(qiáng)；教學(xué)公告則只提供標(biāo)題鏈接，而友情鏈接部分既有圖片鏈接，也有下拉菜單的選項(xiàng)鏈接。首頁(yè)的最下端按慣例為信息區(qū)，包括版權(quán)與訪問量等具體信息。

至于具體的頻道頁(yè)面和新聞中心與教學(xué)公告兩個(gè)通告頁(yè)面的設(shè)計(jì)，也以簡(jiǎn)潔為主，具體內(nèi)容一概以白色墊底，黑藍(lán)色文字對(duì)襯，最多加上淺藍(lán)底色的介紹欄等。[3]

而不管是首頁(yè)，還是具體的頻道頁(yè)面，或者是兩個(gè)通告頁(yè)面以及子頻道頁(yè)面，都以CSS（層疊樣式表）的模式共享首頁(yè)中的介紹區(qū)和頻道區(qū)的頻道鏈接部分。這樣既簡(jiǎn)化了頁(yè)面的美工設(shè)計(jì)，又達(dá)到頁(yè)面內(nèi)容、顏色、區(qū)劃的統(tǒng)一效果，形成了完整的視覺效果和統(tǒng)一的印象痕跡。

2.2 平臺(tái)的代碼實(shí)現(xiàn)

如前所述，整個(gè)平臺(tái)主要包括8個(gè)部分，即信息操作、考試操作、成績(jī)操作、留言操作、規(guī)則操作、新聞操作、論壇操作、系統(tǒng)操作8個(gè)組成。另外，對(duì)于管理員而言，還有隊(duì)員操作、學(xué)生操作、學(xué)生管理員操作、系統(tǒng)管理員操作、友情鏈接操作和我的課堂等操作部分。此外，比如首頁(yè)等部分的實(shí)現(xiàn)，我們也采取了自己的特殊處理，下面擇重分述如下：

（1）首頁(yè)代碼

首頁(yè)代碼我們并不和整個(gè)網(wǎng)站的代碼放一塊，而是采用引用的方式鏈接到其他網(wǎng)站，這樣雖然首頁(yè)開始打開的速度慢些，但代碼異地也提高了網(wǎng)站的容災(zāi)能力同時(shí)加強(qiáng)了網(wǎng)站的安全系數(shù)。[4]

首頁(yè)本地主要代碼為：

首頁(yè)異地主要代碼為：

（2）各種操作的代碼

各種操作盡管名目不同，但實(shí)質(zhì)相同，都是數(shù)據(jù)的增刪改查4個(gè)操作。下面以信息操作的代碼為例，來說明各種操作的實(shí)現(xiàn)過程。而信息操作包括修改信息和查看分組兩部分，代碼[5]分別如下——

修改信息的主要代碼為：

查看分組的主要代碼為：

從上述代碼可以看出，我們的網(wǎng)站代碼都是通過對(duì)象引用的方式，使用現(xiàn)成代碼，并且全部用JavaScript來實(shí)現(xiàn)，這和一般網(wǎng)站代碼完全不同。

3.平臺(tái)的實(shí)施

在整個(gè)平臺(tái)根據(jù)前期的規(guī)劃、分析和設(shè)計(jì)的結(jié)果，最終完成了代碼的編寫工作，接下來就是整個(gè)平臺(tái)的測(cè)試和運(yùn)行工作。

3.1 平臺(tái)的測(cè)試

盡管整個(gè)平臺(tái)規(guī)模相對(duì)不大，但是我們還是按照軟件工程的流程進(jìn)行了4項(xiàng)測(cè)試工作：在代碼編寫階段進(jìn)行單元測(cè)試，這是無法避免的；按照詳細(xì)設(shè)計(jì)書進(jìn)行了集成測(cè)試，按照概要設(shè)計(jì)書進(jìn)行了系統(tǒng)測(cè)試，按照需求分析說明書進(jìn)行驗(yàn)收測(cè)試，這是我們自己努力完成的。[6]

3.2 平臺(tái)的運(yùn)行

整個(gè)平臺(tái)，從2009年6月運(yùn)行到現(xiàn)在，已整整5年有奇，網(wǎng)站總訪問量已經(jīng)達(dá)到7萬(wàn)余次，日均訪問量為40次，日均在線20人，且運(yùn)行平穩(wěn)。

4.總結(jié)

作為整個(gè)平臺(tái)的后期工作，平臺(tái)的實(shí)現(xiàn)和實(shí)施基本都是技術(shù)性流程，只要按照軟件工程的基本原理和程序語(yǔ)言的結(jié)構(gòu)化編寫要求，即使出現(xiàn)問題，也較容易解決。而我們的創(chuàng)新在于充分利用JavaScript的便利，實(shí)現(xiàn)了整個(gè)網(wǎng)站的快速反應(yīng)。

參考文獻(xiàn)：

[1]畢飛.乒乓球俱樂部信息化教學(xué)平臺(tái)建設(shè)項(xiàng)目申請(qǐng)書，2012.

[2]劉亮，崔健華.乒乓球俱樂部信息化教學(xué)平臺(tái)的建設(shè)[J].南京化工職業(yè)技術(shù)學(xué)院學(xué)報(bào)，2012，4：6-7.

[3]馬偉，華馳.動(dòng)態(tài)網(wǎng)頁(yè)設(shè)計(jì)與制作[M].北京：機(jī)械工業(yè)出版社，2010：16-18.

[4]南京化工職業(yè)技術(shù)學(xué)院乒乓球俱樂部.南京化工職業(yè)技術(shù)學(xué)院乒乓球俱樂部首頁(yè)[EB/OL].http：//www.wushen.biz/projects/njccpp/index.jsp，2009-06-05/2013-07-23.

[5]南京化工職業(yè)技術(shù)學(xué)院乒乓球俱樂部.南京化工職業(yè)技術(shù)學(xué)院乒乓球俱樂部信息操作[EB/OL].http：//www.wushen.bix/projects/njccpp/admin/management.jsp，2009-06-05/2013-07-23.

[6]鄭人杰等.軟件測(cè)試[M].北京：人民郵電出版社，2011：26-33.