姚 琪

摘要:當(dāng)前精品課程建設(shè)處于高速發(fā)展階段,精品課程的建設(shè)推動了高等教育教學(xué)改革的發(fā)展。精品課程的建設(shè)開發(fā)周期短,高校需要尋找一種高效的課程開發(fā)模式。文章主要研究利用圖像模型開發(fā)課程網(wǎng)站,該方式便于教師自主開發(fā)課程網(wǎng)站,便于學(xué)校大規(guī)模開展課程建設(shè)。

關(guān)鍵詞:圖像模型;精品課程;課程網(wǎng)站;網(wǎng)站制作

精品課程的建設(shè)主要包括兩個方面:一是課程資源建設(shè),二是課程網(wǎng)站建設(shè)。課程資源建設(shè)是精品課程的核心;課程網(wǎng)站建設(shè)是資源的展示平臺,是推進(jìn)器、催化劑。沒有充實的、富有特色的課程資源,精品課程建設(shè)將無從談起,但沒有網(wǎng)站的精美加工,再好的資源也將缺失表現(xiàn)力,無法被瀏覽者所理解。精品課程從立項到建設(shè)完成,時間緊、任務(wù)重,采用快速高效的課程開發(fā)模式建設(shè)課程網(wǎng)站是所有高校追求的目標(biāo)。

一、精品課程網(wǎng)站建設(shè)現(xiàn)狀

精品課程要求具有五個一流,即一流教師隊伍、一流教學(xué)內(nèi)容、一流教學(xué)方法、一流教材、一流教學(xué)管理,這不僅是針對課程資源建設(shè),更是對網(wǎng)站制作者的考驗。經(jīng)歷幾年的發(fā)展,主要有以下幾種開發(fā)形式:

1.采用系統(tǒng)平臺制作課程網(wǎng)站

目前市場有很多精品課程開發(fā)平臺,快速、高效、簡單易用的特點被眾多高校所追捧。但隨著高校課程建設(shè)的深入,缺乏特色、創(chuàng)新成為采用平臺建設(shè)網(wǎng)站的弊病,所有采用同系統(tǒng)制作的網(wǎng)站千篇一律,不同學(xué)科的重點內(nèi)容無法得到有效展示。

2.聘請網(wǎng)絡(luò)公司制作課程網(wǎng)站

課程建設(shè)團(tuán)隊的教師大部分時間需要處理課程資源內(nèi)容,并且對于網(wǎng)站制作也不專業(yè),聘請網(wǎng)絡(luò)公司制作網(wǎng)站逐步取代采用平臺開發(fā)課程。這樣的網(wǎng)站優(yōu)點是制作精美、有特色、技術(shù)含量高。但是缺點也很快暴露,由于公司技術(shù)員不懂得教學(xué)結(jié)構(gòu)的安排,欄目的設(shè)計、后期的維護(hù)修改等成為最大的問題。

3.教育技術(shù)人員制作課程網(wǎng)站

教育技術(shù)人員精通網(wǎng)站技術(shù),又熟悉教學(xué)設(shè)計和教學(xué)方法,關(guān)鍵是對精品課程建設(shè)的要求和指標(biāo)有較為深入的研究,在某些方面可以指導(dǎo)教師如何更為合理地建設(shè)精品課程,因此請教育技術(shù)人員制作課程網(wǎng)站是最佳選擇。但是由于各高校建設(shè)的課程門數(shù)多,人員缺乏、精力不夠、影響其本職工作等都成為最大的障礙。

從以上課程建設(shè)的形式可以看出各有利弊,高校需要尋找一種更為便捷、有效、適合教師自主開發(fā)課程網(wǎng)站的方式,也便于高校今后開展大規(guī)模的課程建設(shè)。經(jīng)過多年的實踐探索,發(fā)現(xiàn)利用圖像模型建設(shè)課程網(wǎng)站是一種行之有效的方式。

二、基于圖像模型建設(shè)課程網(wǎng)站優(yōu)點

1.網(wǎng)站整體設(shè)計統(tǒng)一

采用該技術(shù)開發(fā)網(wǎng)站是基于圖形的,圖片樣式即是網(wǎng)站的雛形。課程網(wǎng)站主次頁面的外觀效果可直觀顯現(xiàn),便于將頁面風(fēng)格統(tǒng)一,尤其是色彩色調(diào)和布局的統(tǒng)一。從歷年國家精品課程建設(shè)過程看,發(fā)現(xiàn)很多網(wǎng)站的頁面樣式不統(tǒng)一,缺乏整體感,極大影響了精品課程的展示效果。

2.網(wǎng)站精美,不變形

由于精品課程網(wǎng)站有大量的教學(xué)資源需展示,網(wǎng)站首頁作為第一張畫面更應(yīng)以最好的形象展示給觀眾。對比2003年到2009年的精品課程網(wǎng)站,可以明顯看出網(wǎng)站頁面美化度有了很大的提高。利用傳統(tǒng)的網(wǎng)頁技術(shù),很難實現(xiàn)精美效果。但是利用圖片模型來制作網(wǎng)站,將網(wǎng)站的設(shè)計思路轉(zhuǎn)換為平面設(shè)計。圖片設(shè)計比網(wǎng)站設(shè)計要簡單、效果更好、不易變形、更直觀,理念上的轉(zhuǎn)變、方法上的變革徹底改變了網(wǎng)站內(nèi)容的呈現(xiàn)效果。

3.網(wǎng)站制作更加簡便、快速

圖片模型一旦設(shè)計完成,那么網(wǎng)站制作將變得非常簡單。只需將圖片切割,就可以生成精美的靜態(tài)網(wǎng)頁,而且效果與圖片一致。這時只需填充課程資源即可。

三、基于圖像模型制作網(wǎng)站的流程

1.圖片風(fēng)格設(shè)計

根據(jù)課程特色和學(xué)科類別設(shè)計圖片風(fēng)格,這是網(wǎng)站制作的原則和基礎(chǔ)。網(wǎng)站風(fēng)格是給觀眾的第一印象,主要關(guān)注一下幾個方面:

(1)結(jié)構(gòu)一致性。網(wǎng)站結(jié)構(gòu)是網(wǎng)站風(fēng)格統(tǒng)一的重要手段,包括網(wǎng)站布局、文字排版、導(dǎo)航的統(tǒng)一等。首頁模型設(shè)計結(jié)構(gòu)是否一致,直接影響其他模型的風(fēng)格。

(2)色彩的一致性。保持模型主體色彩的一致,只改變局部色塊。這樣做的優(yōu)點是一個獨特色彩的網(wǎng)站會給人留下深刻的印象,因為人的視覺對色彩要比布局更敏感,更容易在大腦中形成記憶符號。比如可選取一兩種主要色彩,幾種輔助色彩。

(3)導(dǎo)航統(tǒng)一。導(dǎo)航是網(wǎng)站的一項重要組成部分,導(dǎo)航設(shè)計合理對網(wǎng)站布局的影響很大,而且影響瀏覽整個網(wǎng)站的便捷性。

(4)特別元素的一致性。在網(wǎng)站平面設(shè)計中,個別具有特色的元素(如標(biāo)志、象征圖形等)重復(fù)出現(xiàn),會給訪問者留下深刻印象。比如網(wǎng)站結(jié)構(gòu)在某一點上的變化,由直線變?yōu)閳A弧、暗色點綴的亮色、色彩中的補(bǔ)色等等。

2.圖片色彩設(shè)計

(1)色系一致性。采用相同色系設(shè)計圖片模型是保持一致性的關(guān)鍵。所謂相同色系,是指幾種色彩在360°色相環(huán)上位置十分相近,大約在45°左右或同一色彩不同明度的幾種色彩。

(2)局部色調(diào)互補(bǔ)對比。局部運(yùn)用對比色或互補(bǔ)色來增加變化,避免采用相同色系造成頁面的單調(diào)。所謂對比色,是指色相環(huán)相距較遠(yuǎn),大約在100°左右,視覺效果鮮亮、強(qiáng)烈。而互補(bǔ)色則是色相環(huán)上相距最遠(yuǎn)的連種色彩,即相距180°,其對比關(guān)系最強(qiáng)烈、最富有刺激性,往往使畫面十分突出,特別適合突出重點欄目,但在使用中注意使用的度,否則容易造成色彩的花。

(3)過渡色調(diào)和。過渡色包括幾種形式:兩種色彩的中間色調(diào)、單色中混入黑、白、灰進(jìn)行調(diào)和以及單色中混入相同色彩進(jìn)行調(diào)和等等。過渡色能夠神奇地將幾種不協(xié)調(diào)的色彩統(tǒng)一起來。

3.圖片版面設(shè)計

(1)分欄設(shè)計。課程網(wǎng)站的內(nèi)頁布局一般比較簡單,即內(nèi)頁的一欄式、不等分兩欄式、三欄式版面布局,但因為瀏覽器寬幅有限,一般不宜設(shè)計成三欄以上的布局。

(2)導(dǎo)航設(shè)計。版面布局中主要是考慮導(dǎo)航、必要信息和正文的布局關(guān)系。比較多的情況是采用頂部放置必要的信息,如課程名稱、課程特色及導(dǎo)航條,或?qū)?dǎo)航條放在左側(cè)而右側(cè),這樣的布局結(jié)構(gòu)清晰、易于使用。

4.切割圖片,生成網(wǎng)頁

圖像模型設(shè)計完成,即可利用Photoshop切片工具切割頁面,進(jìn)而生成網(wǎng)頁。

(1)切圖。切圖是網(wǎng)頁設(shè)計中非常重要的一環(huán),它是我們標(biāo)明哪些是圖片區(qū)域,哪些是文本區(qū)域的重要步驟。另外,合理的切圖還有利于加快網(wǎng)頁的下載速度。

(2)生成WEB頁面。對已經(jīng)切割完成的圖片進(jìn)行“另存為WEB頁”操作即可生成靜態(tài)課程網(wǎng)站框架,圖片自動會生成一個html頁面和images文件夾。

5.內(nèi)容填充

資源內(nèi)容的填充位置和顯示大小在設(shè)計模型時已經(jīng)設(shè)計完成,因此內(nèi)容的填充樣式要符合網(wǎng)站框架結(jié)構(gòu),否則會直接破壞前期設(shè)計的網(wǎng)站結(jié)構(gòu),影響整體風(fēng)格,對此我們通常采用以下幾種方式:

(1)將文檔轉(zhuǎn)換為swf文件。在精品課程建設(shè)中,大量的文字內(nèi)容放入網(wǎng)頁顯示會出現(xiàn)排版異常、字體混亂情況,并且影響頁面美觀。常用的方法就是將Word、PPT等文檔內(nèi)容轉(zhuǎn)化為swf文檔后,插入課程網(wǎng)站。這樣做的優(yōu)點是字體、排版不變形,節(jié)約版面設(shè)計,保持頁面美觀,并且可對文檔進(jìn)行滾動、放大、縮小操作。這也是在精品課程建設(shè)過程中對大批量網(wǎng)絡(luò)文檔用的最多的方式。

(2)將文檔轉(zhuǎn)化為網(wǎng)頁。將文檔另存為web頁,將此單獨作為課程網(wǎng)站的一個頁面。這對于單個簡單排版的文檔可以這樣處理。如果文檔中有圖表、圖片等復(fù)雜內(nèi)容,則不適合采用此種方式。

(3)復(fù)制文字到網(wǎng)頁。對于只有少量文字且簡單排版文檔的可先復(fù)制到記事本中,然后再復(fù)制到課程網(wǎng)頁中。如果直接從文檔復(fù)制到網(wǎng)頁則也會出現(xiàn)排版異?，F(xiàn)象。

(4)特殊效果文字顯示。對于網(wǎng)站頁面中需有特殊效果的文字插入,可通過互聯(lián)網(wǎng)絡(luò)查找相關(guān)特效代碼,然后將整個特效代碼拷貝到相應(yīng)的網(wǎng)頁代碼位置即可。

6.細(xì)節(jié)調(diào)整

為使課程網(wǎng)站整個風(fēng)格統(tǒng)一,尤其是文本內(nèi)容格式統(tǒng)一,這就要用到CSS樣式表。利用CSS樣式表,可方便對整個網(wǎng)站主體文字的批量修改。因此充分利用CSS樣式表,一方面可實現(xiàn)網(wǎng)站主體文字風(fēng)格的統(tǒng)一,另一方面便于今后快速高效修改文字格式。

四、利用圖像模型開發(fā)網(wǎng)站的注意點

1.模型像素設(shè)計

每個網(wǎng)站的大小(寬*高)都要符合瀏覽器的大小,頁面過大的網(wǎng)頁瀏覽器放不下,不方便瀏覽者觀看內(nèi)容,有時無法凸顯特色欄目。因此頁面大小在設(shè)計模型時就需要注意,通常頁面大小為1024*768像素。

2.切片方式

對模型的切片轉(zhuǎn)換到網(wǎng)頁中是一個個拼接的表格,因此如何切片,先后順序,切片的多少都會直接影響到后面課程資源內(nèi)容的填充,因為表格極易被破壞。建議事先規(guī)劃,保留PSD原圖,多次嘗試。

3.CSS樣式表設(shè)計

利用樣式表便于網(wǎng)站形成統(tǒng)一風(fēng)格,樣式表的設(shè)計可通過Dreamwaver進(jìn)行設(shè)計,形成單獨的文件,分別套用給每個網(wǎng)頁,這樣便于今后統(tǒng)一修改。

4.冗余代碼清除

設(shè)計者在制作頁面完成后,最好執(zhí)行清理冗余代碼操作,這樣可使網(wǎng)頁執(zhí)行效率更高,占用容量更小。

參考文獻(xiàn):

[1] 教育部.關(guān)于啟動高等學(xué)校教學(xué)質(zhì)量和教學(xué)改革工程精品

課程建設(shè)工作的通知(教高[2003]1號)[EB/OL].http://

www.jpkcnet.com/new/zhengce/Announces_detail.asp?Announces_ID=13.

[2] 姚恩全.“三位一體”的精品課程建設(shè)范式研究[J].四川師

范大學(xué)學(xué)報(社會科學(xué)版),2006,(6):56-60.

[3] 楊世勇.對國家精品課程建設(shè)的思考[J].現(xiàn)代教育科學(xué),

2004,(11):19-20.

[4] 王玲華.國家精品課程支持技術(shù)問題分析[J].濟(jì)南職業(yè)學(xué)

院學(xué)報,2006,(3).