校園生活類網(wǎng)站設(shè)計與開發(fā)

王遠(yuǎn)　梁美平　吳娜娜　楊肖娜　張丹　余建安

摘 要 以校園生活網(wǎng)站為主，總結(jié)出在其設(shè)計與開發(fā)過程中的一般步驟，并針對建設(shè)網(wǎng)站過程中可能存在的問題，提出幾點有效建議。

關(guān)鍵詞 校園生活網(wǎng)站；網(wǎng)頁設(shè)計；頁面元素

中圖分類號：TP393 文獻(xiàn)標(biāo)識碼：B

文章編號：1671-489X（2016）06-0157-02

1 前言

隨著計算機(jī)互聯(lián)網(wǎng)技術(shù)的不斷普及和發(fā)展，人們可以更方便快捷地瀏覽各種各樣的網(wǎng)站，從中獲得自己需要的信息。在計算機(jī)網(wǎng)絡(luò)不斷應(yīng)用于教育的今天，校園生活網(wǎng)站的設(shè)計以校園生活為題材，提供豐富的信息資源，不僅面向廣大在校師生，也面向社會。它利用網(wǎng)頁的形式，展現(xiàn)出學(xué)校師生的學(xué)習(xí)生活環(huán)境和娛樂活動等，有利于宣揚學(xué)校的文化精神。隨著校園生活網(wǎng)站建設(shè)的重要性越來越突出，對它的設(shè)計與開發(fā)不容忽視。制作出令人賞心悅目、方便獲取信息的校園生活網(wǎng)站，已成為一種追求。

2 校園生活網(wǎng)站設(shè)計與開發(fā)步驟

網(wǎng)站定位 首先要對建設(shè)的網(wǎng)站進(jìn)行精確定位，需要明確網(wǎng)站建設(shè)的目的和面向的對象，增強(qiáng)其實用性。在明確校園生活網(wǎng)站建設(shè)的方向后，進(jìn)行整體構(gòu)思與規(guī)劃，定位出校園生活網(wǎng)站的特色和風(fēng)格，如青春類。

素材搜集 圍繞校園生活，收集與網(wǎng)站主題相關(guān)素材資料。以校園生活中的娛樂生活為例，在確定主要內(nèi)容后，還需搜集諸如校外旅行的景點、社團(tuán)活動的相關(guān)事宜、圖片以及音視頻等大量資料，并對資料進(jìn)行整理，合理分類，便于后期合理安排制作。

頁面制作 首先，確定好網(wǎng)站的整體色調(diào)，由于展現(xiàn)的是校園生活，所以可采用綠色、暖黃色和紅色等可以烘托青春氣息的色彩。其次，設(shè)計簡潔大方的界面，不拘泥于傳統(tǒng)的校園網(wǎng)站，勇于打破呆板的風(fēng)格進(jìn)行創(chuàng)新。第三，在Logo的設(shè)計中，可以將簡筆畫的圖像與變化了的文字相結(jié)合，既宣揚活力，又能突出學(xué)校生活的特色；導(dǎo)航條要讓人一目了然，概括定義好主要關(guān)鍵詞；內(nèi)容板塊的設(shè)計是最為自由的，可以根據(jù)校園生活的素材，設(shè)計出圖文并茂的頁面，給人耳目一新的感覺；版權(quán)信息也必不可少。第四，合理規(guī)劃好各個板塊，將其組合成最優(yōu)的整體頁面，能讓人一目了然又富有創(chuàng)意，以吸引更多的瀏覽者，提高網(wǎng)站關(guān)注度。

完成發(fā)布 校園生活網(wǎng)頁制作完成后，需要在瀏覽器中進(jìn)行測試，看其能否正確顯示，觀察效果，如果沒有問題，則可以上傳發(fā)布于Internet上，并定期進(jìn)行維護(hù)更新。

3 校園生活網(wǎng)站設(shè)計與開發(fā)的建議

不難發(fā)現(xiàn)，往往在網(wǎng)站設(shè)計與開發(fā)的實踐操作中，還存在許多大大小小的問題。本小組在設(shè)計制作寶雞文理學(xué)院校園生活網(wǎng)站過程中出現(xiàn)一系列問題。如：色彩選用不當(dāng)，各種顏色混在一起，過于花哨，像一塊調(diào)色板；字體過小或過大，設(shè)計過于自由，有的文字顏色搭配不合理，略顯粗俗；使用的圖片模糊且隨性，沒有指向性和內(nèi)涵，缺乏美感；加入大量動畫和視頻，沒有節(jié)制，導(dǎo)致網(wǎng)頁加載速度慢；未能將版面合理布局，圖片、文字只是一味地堆積在一起，缺乏創(chuàng)意；等等。針對出現(xiàn)的問題，總結(jié)提出幾點關(guān)于制作校園生活類網(wǎng)站的建議，目標(biāo)在于制作出人們喜聞樂見的優(yōu)秀網(wǎng)站。

搭配積極、熱情的色彩 用戶打開一個網(wǎng)站，最先感受到的并不是豐富的內(nèi)容，而是它的色彩。不同的色彩有著不同的象征含義和情感態(tài)度，一般來說，紅色象征著火和力量，熱情、奔放；橙色象征著幸福，歡快、生機(jī)；明亮的黃色高貴光明；大自然般的綠色和諧有活力；平靜的藍(lán)色，靈性的紫色；等等。但同時它們也有消極的一面，比如：紅色表示憤怒，黃色代表警告，紫色帶來壓抑。校園生活網(wǎng)頁中色彩的應(yīng)用也應(yīng)遵循色彩的規(guī)律，選擇較為活潑的基調(diào)，如熱情活力的紅色或生機(jī)勃勃的嫩綠色，其他色彩起點綴、襯托、補(bǔ)充的作用，而不能喧賓奪主，使人眼花繚亂。可以利用白色純凈簡單的優(yōu)點，它的加入運用，可以顯露網(wǎng)站的整潔，增加可讀性?？傊谝粋€網(wǎng)頁中不要運用三種以上的色彩，注意色彩的搭配要合理，要給人一種和諧愉快的視覺享受。

利用彰顯個性與主題的文字 網(wǎng)站建設(shè)過程中，在文字的設(shè)計使用時要注意不要使用過大的字體，這樣頁面所包含的內(nèi)容將會減少，除非要突出某一重點或應(yīng)用于標(biāo)題；也不能太小，會使可讀性變差；要適中。可以根據(jù)內(nèi)容所需，運用不同的字體來彰顯個性與主題，充分體現(xiàn)某種情感。如粗體字強(qiáng)健有力，有大氣磅礴之勢；細(xì)體字高雅細(xì)致，有柔美之感。校園生活網(wǎng)站頁面的設(shè)計中也可以運用文字的圖形化，對字體進(jìn)行藝術(shù)化的設(shè)計，能更富有創(chuàng)意地表達(dá)設(shè)計思想，打破網(wǎng)頁的平淡與單調(diào)。要注意文字顏色的使用，要合理使用不同顏色的文字，不要太多，否則整個頁面看起來像是一塊調(diào)色板，凌亂無章。還有運用段落與段落間空行及首行縮排等方式來輔以閱讀；不宜使用過多閃爍的文字；等等。

選擇積極向上、有含義的圖像 一個好的網(wǎng)頁離不開好的視覺效果、好的視覺元素——圖像的運用，既可以賦予頁面靈氣，又能通過與文字、音頻的相互結(jié)合來吸引人們的注意力，以及幫助其更好地理解文字內(nèi)容。校園生活網(wǎng)站的圖片應(yīng)是積極向上、活潑的；避免使用太過灰白的圖片，容易引起壓抑感；在圖像的運用中，可采用自己拍攝的素材圖片，但要注意其清晰度，主體應(yīng)清晰可見；圖片的含義要簡單明了；圖片中包含的文字應(yīng)容易辨認(rèn)；也不宜使用過多過大的圖片，可應(yīng)用png圖像格式，圖像不容易失真，存貯形式豐富，又能把圖像文件壓縮到極限，利于網(wǎng)絡(luò)傳輸且顯示速度快。對于已獲取的圖形或圖像，可以利用Adobe Photoshop、光影魔術(shù)手等軟件進(jìn)行處理，使之更符合網(wǎng)頁編輯的需要，制作出具有特色和吸引力的網(wǎng)站頁面。

加入有效的音視頻 僅僅有文字和圖片組成的靜態(tài)頁面中，缺乏相應(yīng)的視聽覺感受，難以引起瀏覽者的興趣。添加需要的音視頻來表現(xiàn)內(nèi)容，更富有表現(xiàn)力，能給瀏覽者帶來驚喜，提高點擊量，更具有吸引力。MP3格式的音頻音質(zhì)好，文件體積較小，可以作長時間播放的背景音樂，也適合用作解說和效果聲，便于在網(wǎng)上傳播。數(shù)字視頻能客觀記錄現(xiàn)實，表現(xiàn)事物細(xì)節(jié)，突破時空限制，從而拓寬人的視野?？梢愿鶕?jù)需要，利用數(shù)字視頻后期制作與處理軟件（如會聲會影）對視頻進(jìn)行剪切或組接。加入自己錄制或下載的有關(guān)視頻，比如心理健康訪談類節(jié)目等，能產(chǎn)生文字、圖像等無法代替的視聽覺效果。

適當(dāng)運用動畫資源 動畫利用人類視覺暫留的特性，快速播放一系列動作連貫的靜態(tài)圖像產(chǎn)生視覺上的動態(tài)效果，善于表現(xiàn)抽象事物。利用Flash設(shè)計出有表現(xiàn)力的動畫，彰顯網(wǎng)站主題。它采用矢量技術(shù)，生成的文件容量小，適合網(wǎng)絡(luò)傳輸。但也要注意善用此類輔助型網(wǎng)頁內(nèi)容，過多地、沒有針對性地使用會加重網(wǎng)頁的負(fù)擔(dān)，影響加載速度，容易使網(wǎng)頁瀏覽者心生厭煩，減少瀏覽量。要注意該用則用，不可濫用。

4 結(jié)論

要想制作出成功的諸如校園生活類網(wǎng)站，不僅要注意以上所提到的問題，還需要建設(shè)者提高自身技術(shù)，在制作過程中認(rèn)真仔細(xì)、不可馬虎，發(fā)現(xiàn)問題時能及時有效地解決；增強(qiáng)審美能力，能合理搭配內(nèi)容；具有創(chuàng)新意識，敢于打破傳統(tǒng)網(wǎng)頁布局；將理論知識與實踐操作相聯(lián)系，勤于動手，在實踐中檢驗真理；等等?？傊?，建設(shè)者需要不斷學(xué)習(xí)和思考，不斷進(jìn)步，從而設(shè)計制作出人們喜愛的網(wǎng)站。

參考文獻(xiàn)

[1]宋志新.淺談網(wǎng)站建設(shè)和網(wǎng)頁制作的方法[J].電子技術(shù)與軟件工程，2013（24）：22-22.

[2]周容.網(wǎng)頁頁面技術(shù)剖析[J].四川職業(yè)技術(shù)學(xué)院學(xué)報，2003（1）：72-74.

[3]趙霞，趙國強(qiáng).網(wǎng)頁制作的問題與方法探析[J].科技風(fēng)，2009（16）：1.

[4]葉旭東.Flash動畫在網(wǎng)頁制作中的應(yīng)用[J].信息與電腦：理論版，2012（1）：140-141.