導(dǎo)言：作為寫作愛好者，不可錯(cuò)過為您精心挑選的10篇網(wǎng)頁界面設(shè)計(jì)論文，它們將為您的寫作提供全新的視角，我們衷心期待您的閱讀，并希望這些內(nèi)容能為您提供靈感和參考。

篇1

引言

格式塔一詞來源于德文“Gestalt”的音譯，本意指的是形式、形狀、方式、實(shí)質(zhì)。格式塔心理學(xué)是一種與藝術(shù)有緣的心理學(xué)理論，其主要目標(biāo)是探討視覺感知及其與學(xué)習(xí)、思維的關(guān)系，它所研究的出發(fā)點(diǎn)就是“形”，“形”是經(jīng)由知覺活動(dòng)組織成的經(jīng)驗(yàn)中的整體，與視知覺活動(dòng)密不可分。而網(wǎng)頁界面設(shè)計(jì)是視覺傳達(dá)設(shè)計(jì)向網(wǎng)絡(luò)媒體的延伸，主要是通過瀏覽者的視覺感知來接受網(wǎng)站信息。因此，研究格式塔理論在網(wǎng)頁界面設(shè)計(jì)中的運(yùn)用，無疑對(duì)網(wǎng)頁界面的設(shè)計(jì)具有很大的指導(dǎo)作用。

格式塔理論在網(wǎng)頁界面設(shè)計(jì)中的應(yīng)用

網(wǎng)頁設(shè)計(jì)是將特定的視覺信息要素，根據(jù)主題表達(dá)的需求在特定的頁面上進(jìn)行的一種編輯和安排，其基礎(chǔ)是視覺生理學(xué)和視覺心理學(xué)。格式塔心理學(xué)派通過對(duì)視覺感知的生理研究，提出了一系列視感知規(guī)律，其中包含了“圖底”這個(gè)核心概念，和“簡(jiǎn)明原則”“接近原則”“相似原則”“閉合原則”等視感知特性，將這些規(guī)律引入頁面設(shè)計(jì)，有助于我們優(yōu)化視覺時(shí)代“形象過?！睜顟B(tài)下盲目的網(wǎng)頁設(shè)計(jì)，提高信息傳達(dá)的速度與準(zhǔn)確度。

1.圖與底

在人的知覺系統(tǒng)中最基本的一種知覺能力是在圖形與背景間作出區(qū)分?！皥D”是居于前部的區(qū)域，“底”被看成是用來襯托圖的背景。相對(duì)而言，圖比底，輪廓較為完整、封閉，形狀較為規(guī)則，面積比較小，色彩比較鮮艷；此外，更重要的是，能組織成為一定意義的區(qū)域傾向于被感覺成圖。

由于圖與底之間存在的這種相對(duì)性質(zhì)，在網(wǎng)頁設(shè)計(jì)中，應(yīng)當(dāng)明確區(qū)分圖與底，主體與背景。另外,主體自身結(jié)構(gòu)要清晰明了，背景不能過于復(fù)雜，這樣才有利于瀏覽者辨別需要了解的信息。在背景的色彩搭配上應(yīng)盡量選用同一色系的顏色，盡量避免同時(shí)使用色相環(huán)中相對(duì)的顏色，大面積同一顏色宜采用低對(duì)比度，避免用強(qiáng)烈刺激的顏色引起瀏覽者的視覺疲勞與厭煩情緒。格式塔理論的圖－底規(guī)則不僅說明了主體從背景中分離出來的條件,而且指出了背景在一個(gè)格式塔中的重要作用。因此在網(wǎng)頁設(shè)計(jì)中我們同樣不能忽視背景的作用，圖形是依賴于背景而存在的，要使主體感到存在，必然要有底將它襯托出來。因此無論在文字、色彩、圖像，還是動(dòng)畫和視頻方面都要堅(jiān)持圖底原則。

2.簡(jiǎn)明原則

格式塔心理學(xué)家認(rèn)為，人們的知覺有一種“簡(jiǎn)化”傾向，所謂簡(jiǎn)化并非僅指一般意義上的“簡(jiǎn)單”，即物體中包含的成分少或成分之間的關(guān)系簡(jiǎn)單，而是一種將任何刺激以盡可能簡(jiǎn)單的機(jī)構(gòu)組織起來的傾向。我們的眼睛只能接受少數(shù)幾個(gè)不相關(guān)聯(lián)的整體單位，如果一個(gè)格式塔中包括太多不相關(guān)的單位，眼睛就會(huì)試圖將其簡(jiǎn)化，把各個(gè)單位加以組合，使之成為一個(gè)知覺上易于處理的整體，否則，整體形象將無法被正確感知，這種形象勢(shì)必會(huì)被人們忽視，以至拒絕接受。

我們可以將這一觀點(diǎn)延伸到網(wǎng)頁界面設(shè)計(jì)中。首先，在網(wǎng)頁界面結(jié)構(gòu)的設(shè)計(jì)上，應(yīng)避免使用過于復(fù)雜的網(wǎng)格結(jié)構(gòu)，結(jié)構(gòu)的設(shè)置應(yīng)盡量簡(jiǎn)單明了，符合人的視覺流程，也符合人們對(duì)規(guī)則形的喜好，利于瀏覽者以最短的時(shí)間找到最需要的信息。

其次，在圖像的選擇上，應(yīng)避免使用過于繁復(fù)雜亂的、容易分散瀏覽者注意力的圖像，這樣會(huì)增加瀏覽者找尋信息的難度。

再次，在進(jìn)行文字編輯時(shí)，應(yīng)該考慮編輯的最終效果。文字應(yīng)給人以清晰的視覺印象，避免頁面繁雜凌亂，減少不必要的裝飾變化，使人易認(rèn)、易懂、易讀，不能為造型而編輯，忘記了文字本身是傳達(dá)內(nèi)容和表達(dá)信息的主體。在字體的選擇上，雖然可供選擇的字體很多，但同一頁面上的字體種類最多只能有三四種，這樣才不會(huì)顯得花哨。字體的選擇應(yīng)依據(jù)段落大小和內(nèi)容層次,由重到輕、由粗到細(xì)。字號(hào)的選擇也應(yīng)該依據(jù)內(nèi)容層次由大到小，但到了節(jié)以下的層面，可以選用同一字號(hào)但用不同的字體加以區(qū)分。在文本密度方面，文本應(yīng)該以短小的組塊形式出現(xiàn)，并且應(yīng)該經(jīng)過編輯，以簡(jiǎn)化內(nèi)容。3.接近原則和相似原則

接近原則和相似原則的本質(zhì)上都是簡(jiǎn)化和整體化知覺對(duì)象的組織原則，與前面的簡(jiǎn)明原則類似，人們?cè)趦A向于簡(jiǎn)化認(rèn)識(shí)對(duì)象的同時(shí)，也傾向于將近似、接近的元素組合起來作為一個(gè)整體加以認(rèn)知。也就是說如果不同的文字或圖形組成部分位置靠近，瀏覽者就比較容易看出它們是一起的。根據(jù)這一原理，對(duì)于頁面上的任何元素，如果在功能或內(nèi)容上是相同或相近的，就應(yīng)在一定程度上保持相對(duì)較小的空間距離，做到“物以類聚”。比如，頁面中用以解釋圖形或用以表明某一部分圖形的文字就應(yīng)當(dāng)緊挨其所指的圖形或部分圖形。

相似的物體也很容易被認(rèn)為是從屬于一個(gè)系統(tǒng)，具有相似的功能。因而，需要通過將瀏覽者注意力集中于視覺范圍內(nèi)的關(guān)鍵概念，幫助他們獲得信息。在網(wǎng)頁界面設(shè)計(jì)中，可以通過強(qiáng)調(diào)、動(dòng)畫、對(duì)比色的使用或其他手段達(dá)到這一目的。假如一個(gè)圖形中的組成部分都屬于同一風(fēng)格，這個(gè)圖形就被視為一個(gè)整體。為了使瀏覽者重點(diǎn)關(guān)注圖形中的特定部分，對(duì)這一部分可采用不同的顏色、動(dòng)畫、閃爍或其他區(qū)分方式。但是，如果一幅畫面中區(qū)別過多，也會(huì)使瀏覽者難以注意需要獲得的信息。因此，這些方法應(yīng)該用于強(qiáng)調(diào)關(guān)鍵信息或圖形的關(guān)鍵部分，而不宜用于大片信息。

4.閉合原則與網(wǎng)頁界面設(shè)計(jì)

閉合原則是指一種完成某種完形的行動(dòng)。這一規(guī)則表明，每一種視覺樣式都可以被看成是一種陳述，對(duì)于模棱兩可的視覺樣式，人們會(huì)根據(jù)以往的經(jīng)驗(yàn)按照不同的樣式加以組織，這時(shí)不同的人會(huì)看到不同的東西。因此，在網(wǎng)頁界面設(shè)計(jì)時(shí),應(yīng)當(dāng)避免出現(xiàn)不完整的圖形，以免使瀏覽者花費(fèi)過多的時(shí)間去琢磨圖形的含義，而不是從網(wǎng)頁上獲取信息。

閉合規(guī)則還表明,視覺形象被知覺的形式是首先作為一個(gè)統(tǒng)一的整體被知覺，然后再以部分的形式被知覺。因此，在進(jìn)行網(wǎng)頁界面設(shè)計(jì)時(shí)，要強(qiáng)調(diào)整體風(fēng)格的統(tǒng)一，內(nèi)容與形式的統(tǒng)一。

結(jié)語

將格式塔心理學(xué)引入網(wǎng)頁界面設(shè)計(jì)，目的是希望網(wǎng)頁設(shè)計(jì)向理性化的方向發(fā)展。隨著網(wǎng)絡(luò)的不斷發(fā)展，瀏覽者對(duì)頁面的要求也越來越高，但現(xiàn)在的頁面設(shè)計(jì)大多還是從直覺出發(fā)，離科學(xué)的頁面設(shè)計(jì)還有相當(dāng)大的距離，因此要想達(dá)到科學(xué)的頁面設(shè)計(jì)，就要在設(shè)計(jì)時(shí)遵照人類的認(rèn)知規(guī)律，并且將這些規(guī)律正確地應(yīng)用到設(shè)計(jì)實(shí)踐中。而如何將格式塔理論與設(shè)計(jì)結(jié)合起來,仍是我們需要投入大量精力去研究與探討的問題。

參考文獻(xiàn)：

[1]曹方著.視覺傳達(dá)設(shè)計(jì)原理，江蘇美術(shù)出版社

篇2

隨著科技的發(fā)展、電腦及網(wǎng)絡(luò)的興起，網(wǎng)絡(luò)界面的出現(xiàn)使得人們的閱讀方式乃至生活方式發(fā)生著改變，直接影響著人們生活的方方面面。網(wǎng)絡(luò)界面設(shè)計(jì)作為平面設(shè)計(jì)陣營中的新生代，展現(xiàn)出數(shù)字信息時(shí)代下嶄新的藝術(shù)設(shè)計(jì)語言。當(dāng)今是書籍設(shè)計(jì)與網(wǎng)絡(luò)設(shè)計(jì)共存的時(shí)代，實(shí)體與虛擬的并存，呈現(xiàn)出各自設(shè)計(jì)特征與發(fā)展方向。網(wǎng)頁界面設(shè)計(jì)中的視聽要素與所展現(xiàn)出的設(shè)計(jì)語言的新面貌，為已有的信息傳播方式帶來了新的展現(xiàn)平臺(tái)。網(wǎng)絡(luò)界面設(shè)計(jì)除了運(yùn)用印制媒體設(shè)計(jì)的構(gòu)成原理與視覺要素，還具備了其特有的鮮明特征。網(wǎng)絡(luò)界面設(shè)計(jì)的新特征展現(xiàn)在視覺藝術(shù)與網(wǎng)絡(luò)技術(shù)的不斷變革中。作為新生代的網(wǎng)絡(luò)界面設(shè)計(jì)是對(duì)印制媒體設(shè)計(jì)的繼承和發(fā)展，其與書籍設(shè)計(jì)相比有著其鮮明的特征。

一、新特征

（一）互動(dòng)的距離。書籍設(shè)計(jì)呈現(xiàn)出一種“只讀藝術(shù)”，閱讀者在品讀過程中往往是被動(dòng)的。而網(wǎng)絡(luò)媒體藝術(shù)是一種“可讀寫藝術(shù)”，瀏覽者可在登陸后實(shí)時(shí)關(guān)注，并在相關(guān)內(nèi)容上進(jìn)行瀏覽、反饋和答復(fù)等等，實(shí)現(xiàn)“零距離”交流互動(dòng)。設(shè)計(jì)師將設(shè)計(jì)良好的界面、網(wǎng)絡(luò)技術(shù)開發(fā)和網(wǎng)絡(luò)交互性進(jìn)行結(jié)合，將使網(wǎng)頁瀏覽者實(shí)現(xiàn)自由的、主動(dòng)交互的選擇，這些對(duì)于書籍閱讀來說基本無法實(shí)現(xiàn)。

（二）線性與非線性。從書籍所呈現(xiàn)的內(nèi)容文字來看，其呈現(xiàn)出“線性”排列，受其印制品的物理結(jié)構(gòu)與相關(guān)內(nèi)容空間編排的制約，這種由頭到尾線性文本的編排，使讀者產(chǎn)生單一方向的內(nèi)容認(rèn)知的過程。讀者在篩選內(nèi)容后，在閱讀中是遵循一行一行的由前向后的讀覽方式，這就體現(xiàn)出“線性”閱讀的特色。網(wǎng)絡(luò)界面設(shè)計(jì)打破了傳統(tǒng)文本排列的架構(gòu)。鏈接實(shí)現(xiàn)了文本闡述、拓展、補(bǔ)充等若干部分的內(nèi)容。讀者根據(jù)需要將排列的文檔一部分一部分的劃分開，確定自己的閱讀中心，在屏幕上將閱讀空間內(nèi)容重組，從而實(shí)現(xiàn)自主的個(gè)性化的文本閱讀意義。

（三）單一媒體與多媒體。多媒體的發(fā)展成為網(wǎng)頁界面設(shè)計(jì)的流行趨勢(shì)，與書籍設(shè)計(jì)這種單向媒體相比較而言，其優(yōu)勢(shì)是集成圖形圖像、音效音樂、以及視頻動(dòng)畫于一體，促使視覺觸覺聽覺等等全方位多角度多視點(diǎn)的傳達(dá)信息，吸引觀者。這種多表征的信息集合表現(xiàn)產(chǎn)生了“1+1＞2”的效果。網(wǎng)頁模擬出真實(shí)的場(chǎng)景這是書籍設(shè)計(jì)無法體現(xiàn)出的效果。這種多感設(shè)計(jì)已成為網(wǎng)頁設(shè)計(jì)中爭(zhēng)相展現(xiàn)的面貌。

（四）空間擴(kuò)展。書籍版面展現(xiàn)出來的是平面二維空間，而網(wǎng)絡(luò)界面往往是二維和三維的共同體。三維空間具有更大的信息量，增添了新的維度，從而滿足人對(duì)空間心里真實(shí)的需要。同時(shí)，界面的層層串接使瀏覽者在網(wǎng)頁內(nèi)容之間循序往復(fù)的互相套接，架構(gòu)出層層深度的脈絡(luò)，吸引人們深入認(rèn)知。

（五）即時(shí)性。信息的時(shí)效性是信息社會(huì)的基本特征。書籍編輯印制的時(shí)間過程往往比網(wǎng)絡(luò)編輯的過程要緩慢。由于網(wǎng)絡(luò)技術(shù)和網(wǎng)絡(luò)界面的設(shè)計(jì)特點(diǎn)，設(shè)計(jì)人員將編輯完整的網(wǎng)站或網(wǎng)頁于網(wǎng)絡(luò)，那么即可完成。這樣往往節(jié)省了書籍印制過程中所需的時(shí)間段，從而在第一時(shí)間將鮮活準(zhǔn)確的信息廣泛的傳播，網(wǎng)絡(luò)信息的即時(shí)性特點(diǎn)也就體現(xiàn)了出來。另外在網(wǎng)絡(luò)中互動(dòng)的平臺(tái)中，往往也體現(xiàn)出信息的時(shí)效性。例如：論壇中的相關(guān)討論和問題的回復(fù)，都體現(xiàn)出此特點(diǎn)。

（六）廣告的靈活性。作為互聯(lián)網(wǎng)上新興的一種廣告形式——以網(wǎng)絡(luò)為平臺(tái)的網(wǎng)絡(luò)廣告也就應(yīng)運(yùn)而生了。網(wǎng)絡(luò)廣告是一種結(jié)合傳統(tǒng)的廣告形式與網(wǎng)絡(luò)應(yīng)用技術(shù)的一種全新形式。網(wǎng)絡(luò)廣告與書籍廣告相比而言，主要可以從溝通性、信息性和效果性幾個(gè)方面加以比較。

書籍廣告中，由于書的特質(zhì)致使其溝通受眾面有限，書中的廣告信息內(nèi)容往往和書籍相關(guān)，效果大多傾向靜態(tài)的圖文信息，這樣的信息在傳播的過程中給人的感官刺激較單一。當(dāng)然隨著科技的發(fā)展，也出現(xiàn)一些新的廣告方式，如：書簽廣告，隨書附贈(zèng)品中加入廣告等，但與網(wǎng)絡(luò)廣告相比而言單一化的特征明顯。反觀網(wǎng)絡(luò)廣告的特質(zhì)，其信息溝通模式是多樣性、實(shí)時(shí)交互性流通，避免了書籍廣告那種將信息灌輸式的，用印象去勸誘目標(biāo)受眾成為消費(fèi)者。同時(shí)其信息覆蓋面更廣泛、信息容量更大，信息綜合表現(xiàn)效果更強(qiáng)。

二、差異的表現(xiàn)

（一）書籍封面與網(wǎng)站首頁

就書籍封面而言，其間的圖形和文字等元素編排相對(duì)固定，效果方面也是據(jù)其內(nèi)容設(shè)計(jì)出靜止且有內(nèi)涵的風(fēng)貌。而網(wǎng)站首頁表現(xiàn)手法靈活度大，往往會(huì)結(jié)合動(dòng)態(tài)與音效等手段來一一呈現(xiàn)。引入式和主題式是網(wǎng)站首頁展現(xiàn)的兩種主要手法。引入式往往使用動(dòng)畫或圖形圖像在首頁，主要是利用少量的文字和氛圍去制造出一個(gè)對(duì)網(wǎng)站總體的展現(xiàn)和引入。而主題式主要指首頁上方以導(dǎo)航條為主，下面出現(xiàn)若干分類信息。此類首頁以文字居多，分欄表現(xiàn)便于檢索。由于這樣的網(wǎng)站信息量較大，因此在查閱期間往往需要滾屏瀏覽。

（二）版面與界面

1、書的目錄與網(wǎng)頁導(dǎo)航。翻開一本書，想了解本書的內(nèi)容，往往會(huì)先瀏覽目錄。目錄是本書的提綱挈領(lǐng)，呈現(xiàn)的方式主要是各章節(jié)標(biāo)題與頁碼組成，靜態(tài)的組織加入紙張的質(zhì)感無不顯現(xiàn)出書卷之氣。網(wǎng)頁中起到“目錄”功能的位置是導(dǎo)航條。其間只強(qiáng)調(diào)標(biāo)題而略去頁碼，靜態(tài)與動(dòng)態(tài)的緊密結(jié)合，聲效與變幻色彩的加入無不展現(xiàn)出導(dǎo)航條的特色。2、版心與分欄。書籍版面中的版心一般相對(duì)比較大、內(nèi)容集中在版心內(nèi)部，尺幅變化相對(duì)不大，整本書的分欄比較規(guī)范統(tǒng)一化，如：?jiǎn)螜诨騼蓹诘鹊?。留白率是指版面與空白之比，留白率的恰當(dāng)使用會(huì)提升視覺效果和信息的認(rèn)知度。與書籍版面相比，網(wǎng)頁界面的版心和分欄相對(duì)更靈活，留白率更大。版面色彩之間的運(yùn)用與銜接變化更豐富。3、文字與圖底。網(wǎng)頁界面不像書籍版面那樣分出左右兩頁，并按前后注明頁碼。網(wǎng)頁間鏈接靠的是層層的鏈接，編排中的文字和圖形靈活多變，往往出現(xiàn)加底色或底圖的形式。從字體角度來看，書籍設(shè)計(jì)時(shí)軟件中可選用的字體種類較多，作為網(wǎng)絡(luò)界面上顯現(xiàn)的字體是由瀏覽者所使用的機(jī)器內(nèi)部的字體數(shù)量決定的。一般用戶所使用的電腦中的字體是隨系統(tǒng)安裝的，字體數(shù)量是很有限的。因此網(wǎng)絡(luò)界面的字體與書籍上的字體相比而言展現(xiàn)出較固定化的特點(diǎn)。4、順序的呈現(xiàn)。書籍由印制裝訂在一起，內(nèi)容在安排上順序感強(qiáng)，由前至后的段落排列引導(dǎo)讀者的閱讀。網(wǎng)頁界面因其互動(dòng)性的特點(diǎn)，設(shè)計(jì)的過程中在主頁的超鏈接上可以按照不同人群需要設(shè)計(jì)出各種人性化連接界面，在設(shè)計(jì)環(huán)節(jié)中展現(xiàn)出脈絡(luò)狀的連接。

（三）形態(tài)表現(xiàn)

1、虛擬與實(shí)物。當(dāng)今書籍設(shè)計(jì)師打破了傳統(tǒng)六面體的造型，創(chuàng)新出多面體的異型開本，使書籍從外觀造型上就獲取了更豐富的實(shí)物面貌。網(wǎng)絡(luò)界面二維、多維造型以數(shù)字化模擬體現(xiàn)，形態(tài)多變且靜動(dòng)結(jié)合，多變的虛擬形態(tài)吸引著瀏覽者的關(guān)注和探求。2、材料質(zhì)感的真實(shí)性與模擬性。特種紙的選用在如今的書籍設(shè)計(jì)中被普遍使用，各種真實(shí)的紙張質(zhì)感易于彰顯出書籍的品質(zhì)與內(nèi)涵。而網(wǎng)絡(luò)界面中質(zhì)感的體驗(yàn)由數(shù)字化模擬表現(xiàn)來實(shí)現(xiàn)，網(wǎng)間質(zhì)感呈現(xiàn)的樣式與書籍質(zhì)感相比更多樣，實(shí)現(xiàn)起來更直接迅速。

三、融合

以上通過書籍設(shè)計(jì)與網(wǎng)絡(luò)界面設(shè)計(jì)的比較，更明確地辨清兩者之間的設(shè)計(jì)特征。如今兩者在平面設(shè)計(jì)領(lǐng)域中也不斷呈現(xiàn)出互相影響，適度融合的特征。書籍設(shè)計(jì)中適度加入互動(dòng)環(huán)節(jié)已成為不少設(shè)計(jì)師的青睞。隨著“電子書”、“網(wǎng)上書城”作為新生力量不斷與線下的實(shí)體書店進(jìn)行多角度的組合，“線上虛擬、線下實(shí)物”統(tǒng)一的內(nèi)容不同的場(chǎng)合彼此融會(huì)貫通，共同開發(fā)拓展銷售渠道。

篇3

一、人性化游戲界面設(shè)計(jì)理論基礎(chǔ)

良好的用戶體驗(yàn)是人性化有些界面設(shè)計(jì)的基礎(chǔ)。用戶體驗(yàn)發(fā)生在生活的每個(gè)瞬間，比如當(dāng)你用水杯喝水時(shí)，會(huì)隨手將杯蓋放在任何你隨手可以放置的地方，當(dāng)你在不注意的情況下會(huì)將杯蓋隨手放在任何地方，隨后因?yàn)闆]有印象而忘記杯蓋放在了哪里。現(xiàn)在很多的水杯都將杯蓋設(shè)計(jì)成連接在杯子上的，這樣就不容易忘記放在哪里了。這樣的例子不計(jì)其數(shù)。用戶體驗(yàn)在開發(fā)數(shù)字產(chǎn)品、系統(tǒng)及服務(wù)的不同設(shè)計(jì)與可用性學(xué)科，并通過界面的交互設(shè)計(jì)來影響人們的體驗(yàn)。數(shù)字產(chǎn)品的用戶體驗(yàn)設(shè)計(jì)包括三方面，即形式，行為和內(nèi)容。操作是游戲體驗(yàn)的必要行為，交互設(shè)計(jì)關(guān)注行為設(shè)計(jì)，也關(guān)注行為如何和形式與內(nèi)容產(chǎn)生聯(lián)系。人性化的游戲界面設(shè)計(jì)就是將交互設(shè)計(jì)理念完美的融入界面設(shè)計(jì)中，將形式和內(nèi)容通過交互設(shè)計(jì)達(dá)到一種自然的狀態(tài)，是玩家才做起來更加順暢而方便，提高游戲的娛樂性。人性化游戲界面設(shè)計(jì)不僅要考慮到玩家大眾的心理，使用習(xí)慣，使用環(huán)境等因素，還要更好的研究大眾的文化，審美等因素對(duì)游戲的影響。只有達(dá)到平衡才能使玩家和游戲之間順暢而自然地進(jìn)行信息交流

游戲界面交互設(shè)計(jì)同一般的WEB設(shè)計(jì)有所區(qū)別。游戲的信息功能復(fù)雜，板塊較多，加上玩法和游戲特定的規(guī)范，在創(chuàng)新設(shè)計(jì)上需要設(shè)計(jì)師全方位的考慮周全，有舍有取。

二、人性化游戲界面設(shè)計(jì)原則

游戲界面就像是一個(gè)自助式的產(chǎn)品，他和很多網(wǎng)絡(luò)產(chǎn)品一樣，沒有像真正產(chǎn)品一樣的說明書，當(dāng)新手引導(dǎo)結(jié)束后，用戶只能憑自己的互聯(lián)網(wǎng)產(chǎn)品使用經(jīng)驗(yàn)操作那些命令。一個(gè)不好的界面，會(huì)使游戲玩家因?yàn)橐粋€(gè)操作的卡住最終放棄游戲，這將造成巨大的損失。游戲界面承擔(dān)著玩家與游戲之間溝通的媒介作用，直接和界面設(shè)計(jì)相關(guān)的除了美術(shù)部分就是交互設(shè)計(jì)。交互設(shè)計(jì)是關(guān)于行為，操作流程的，和外觀相比，更難于觀察和理解。作為游戲界面的交互，保證玩家使用界面順利成功的進(jìn)行游戲，界面設(shè)計(jì)需要以為人本，并且必須遵循一些游戲界面特定的設(shè)計(jì)原則。

1.簡(jiǎn)潔易用

Less is more的設(shè)計(jì)思想不管設(shè)計(jì)任何事物都有很好的指導(dǎo)意義。游戲的界面需要設(shè)計(jì)師盡量做到精簡(jiǎn)，以免太多的按鈕和菜單出現(xiàn)在畫面上，并且過于華麗的修飾也會(huì)干擾到玩家的注意力，很可能分散玩家的注意力，是玩家不能集中精力于游戲世界。操作界面應(yīng)該盡量做到簡(jiǎn)單明確，并且盡量少占用屏幕空間。而有的游戲因?yàn)樾畔?shù)據(jù)繁多，做到精簡(jiǎn)的難度很大。但是也有設(shè)計(jì)師挑戰(zhàn)了這種矛盾。例如現(xiàn)在很多網(wǎng)頁游戲都將游戲構(gòu)成單元和主要場(chǎng)景結(jié)合起來。例如圖一，將主要場(chǎng)景中的建筑和組成這個(gè)游戲的各個(gè)玩法單元結(jié)合起來。這樣不僅僅減少了界面上菜單按鈕的數(shù)量，也更好的將玩家吸引到游戲情境當(dāng)中。不僅是玩家操作更順暢，減少記憶成本，增加了操作上的游戲樂趣。

圖二是《大將軍》網(wǎng)頁游戲中的城外界面的國家查找界面。設(shè)計(jì)者沒有用過多的裝飾，簡(jiǎn)潔的操作界面一目了然，并且雖然是游戲，但是為了方便玩家尋找國家承包，增加了搜索功能，將互聯(lián)網(wǎng)其他產(chǎn)品的功能活用到游戲當(dāng)中也是一個(gè)很巧妙的辦法。

2.遵循游戲習(xí)慣

上面講到了將互聯(lián)網(wǎng)其他的產(chǎn)品的一部分需求功能增加到游戲當(dāng)中，這樣的做法也需要度。因?yàn)橛螒蜃鳛橐粋€(gè)已經(jīng)給玩家固定印象的產(chǎn)品，有他的特征。網(wǎng)頁游戲發(fā)展了許多年，玩家已經(jīng)培養(yǎng)成了固定的使用習(xí)慣，因此不能隨意的改變這些習(xí)慣。例如圖三所示。

圖三為網(wǎng)頁游戲《一代宗師》的英雄界面和主城界面。主城界面可以看出和其他的大部分網(wǎng)頁游戲沒有太多的區(qū)別。左上角為英雄頭像，名稱，等級(jí)和一些屬性。下方一條則為工具欄。左右兩邊為信息欄和任務(wù)欄。玩家已經(jīng)經(jīng)歷了多個(gè)類似設(shè)計(jì)的網(wǎng)頁游戲，已經(jīng)培養(yǎng)起了固定的使用習(xí)慣，因此這樣的設(shè)計(jì)不會(huì)使玩家在尋找操作方式上花費(fèi)太多時(shí)間。英雄界面則改動(dòng)很大。圖四為一款網(wǎng)頁游戲的交互設(shè)計(jì)原型圖。圖四的設(shè)計(jì)是大多數(shù)網(wǎng)頁游戲英雄面板的設(shè)計(jì)方式。從左至右的方式選擇，符合用戶使用習(xí)慣。而圖三則將英雄的選擇方式放到了上方，將玩家關(guān)注的英雄裝備情況的區(qū)域縮小，放到了界面的下方，這樣做模糊了主次關(guān)系，將本該強(qiáng)化注意的裝備情況削弱了。不但視覺上不舒服，而且在操作上也加大了玩家的學(xué)習(xí)成本，很容易造成游戲用戶的流失。

3.可擴(kuò)充原則

網(wǎng)頁游戲和一般的網(wǎng)絡(luò)產(chǎn)品不同的是，它會(huì)不斷地更新新的版本，增加新的功能，這樣才能適應(yīng)不同玩家的不同需求，適應(yīng)市場(chǎng)競(jìng)爭(zhēng)。這樣也要求交互設(shè)計(jì)師再設(shè)計(jì)操作界面的時(shí)候，要給以后的游戲功能開發(fā)流出一定的空間，所謂的動(dòng)態(tài)擴(kuò)展空間。聽起來很困難，但是在工作中需要和游戲策劃者多多溝通，及時(shí)得到最新信息。

篇4

 

想要建立一個(gè)成功的網(wǎng)站，首先就要貫徹“以人為本”的原則，在現(xiàn)今的設(shè)計(jì)過程中能夠體現(xiàn)“以人為本”原則的設(shè)計(jì)就屬用戶體驗(yàn)設(shè)計(jì)了?？萍颊撐?。這就不得不提到兩個(gè)名詞即用戶體驗(yàn)和用戶界面概念的理解。

一、名詞概念

1.什么是用戶體驗(yàn)

用戶體驗(yàn)（user experience）簡(jiǎn)稱UE，是指用戶在接受和使用一個(gè)產(chǎn)品（服務(wù)）的過程中建立起來的心理感受。用戶體驗(yàn)無處不在，在日常生活中人們所接觸到的一切產(chǎn)品，例如，交通工具飛機(jī)、汽車、公交車、自行車，數(shù)碼產(chǎn)品電腦、手機(jī)、相機(jī)、mp3等，人們?cè)谑褂玫倪^程中都會(huì)產(chǎn)生純主觀的心理感受。這些純主觀的感受完全建立于用戶體驗(yàn)產(chǎn)品的過程中，而產(chǎn)品的好壞或虧盈就由這些體驗(yàn)感受所決定，所以產(chǎn)品設(shè)計(jì)中的以用戶為中心的用戶體驗(yàn)設(shè)計(jì)顯得至關(guān)重要。

2．什么叫做用戶界面

用戶界面（User Interface）簡(jiǎn)稱UI，界面（Interface）是人機(jī)互動(dòng)過程中的一個(gè)層面；界面設(shè)計(jì)是一個(gè)復(fù)雜的有不同學(xué)科參與的工程，認(rèn)知心理學(xué)、設(shè)計(jì)學(xué)、語言學(xué)等在此都扮演著重要的角色。比如，制作一個(gè)公司的網(wǎng)站時(shí)，不僅要兼顧用戶的便利，同時(shí)也要把這個(gè)公司引人注目的地方一起展現(xiàn)出來。如果把一個(gè)網(wǎng)站比喻成一棟房子，那么用戶界面則是房子的門面和裝潢，只有首先吸引用戶的眼球才能使用戶留在房子里去體驗(yàn)生活。

二、用戶體驗(yàn)設(shè)計(jì)的分類

在網(wǎng)站建設(shè)過程中如果只了解到用戶體驗(yàn)的概念是不夠的，設(shè)計(jì)者們必須要理論結(jié)合實(shí)踐。因?yàn)橛脩趔w驗(yàn)是一種用戶純主觀性的心理感受，設(shè)計(jì)師們?cè)诤芪⑿〉募?xì)節(jié)進(jìn)行調(diào)整，或許就會(huì)得到用戶的鐘愛。這些細(xì)節(jié)上的精心設(shè)計(jì)必須經(jīng)過設(shè)計(jì)師對(duì)于用戶自身的調(diào)查與用戶反饋的信息才能整出頭緒，進(jìn)行整合設(shè)計(jì)。那么通過調(diào)查與反饋用戶體驗(yàn)的設(shè)計(jì)可以從以下幾個(gè)方面進(jìn)行調(diào)整設(shè)計(jì)。

1.感官體驗(yàn)

想要在網(wǎng)頁中設(shè)計(jì)出好的界面的話，感官效果是必須考慮的一個(gè)方面。要注意網(wǎng)頁的界面應(yīng)該要保持一貫性不能給用戶帶來混亂感；在使用方法方面，設(shè)計(jì)風(fēng)格要符合目標(biāo)客戶的審美習(xí)慣，并具有一定的引導(dǎo)性?？萍颊撐?。界面的構(gòu)成不能太復(fù)雜；主要內(nèi)容應(yīng)設(shè)計(jì)在引人注目的地方。同時(shí)，頁面布局重點(diǎn)突出，主次分明，圖文并茂。與企業(yè)的營銷目標(biāo)相結(jié)合，將目標(biāo)客戶最感興趣的，最具有銷售力的信息放置在最重要的位置。在設(shè)計(jì)頁面色彩時(shí)應(yīng)該與品牌整體形象相統(tǒng)一，主色調(diào)和輔助色不超過三種顏色。以恰當(dāng)?shù)纳拭鞫群土炼?，確保瀏覽者的瀏覽舒適度。

2.瀏覽體驗(yàn)

瀏覽體驗(yàn)顧名思義就是呈現(xiàn)給用戶瀏覽上的體驗(yàn)，更強(qiáng)調(diào)的是吸引性。在一個(gè)網(wǎng)站中一切內(nèi)容和服務(wù)都是從網(wǎng)站的導(dǎo)航延伸出去的，所以導(dǎo)航應(yīng)該要?jiǎng)痈?、?jiǎn)潔、清晰，分類條理最關(guān)鍵。隨著現(xiàn)在網(wǎng)站功能越漸強(qiáng)大，各類型網(wǎng)站中增加了越來越多的視頻、動(dòng)畫元素，對(duì)網(wǎng)站速度的要求也越發(fā)苛刻。所以加快頁面的瀏覽速度選擇一家穩(wěn)定的服務(wù)器托管商也至關(guān)重要。在網(wǎng)站的內(nèi)容上設(shè)計(jì)者應(yīng)該給用戶帶來舒適的文字環(huán)境。如今，網(wǎng)站博客撰寫已成為了一個(gè)很大的話題。我們需要用和朋友對(duì)話的方式來撰寫博客，讓用戶感覺到一種舒適溫馨的氛圍。這樣用戶就會(huì)少一些局促感，即使他們遇到了使用上的問題，也會(huì)心情愉悅的在網(wǎng)站幫助中尋找解決的辦法。

3. 信任體驗(yàn)

4. 　互動(dòng)體驗(yàn)

它呈現(xiàn)給用戶操作上的體驗(yàn)，強(qiáng)調(diào)網(wǎng)站的易用性。網(wǎng)站與用戶必須有高度的互動(dòng)性，網(wǎng)站不是一張死板的宣傳單，要讓瀏覽者通過網(wǎng)站進(jìn)行各種互動(dòng)行為，包括直接聯(lián)系企業(yè)客服中心；在線留言或咨詢；在線訂購物品；發(fā)表評(píng)論等，總之，要讓網(wǎng)站和瀏覽者互動(dòng)起來，通過網(wǎng)站把瀏覽者和企業(yè)連接起來。能互動(dòng)的地方越多，這個(gè)網(wǎng)站的價(jià)值就越大?？萍颊撐?。因?yàn)橹挥泻蜑g覽者產(chǎn)生交流并可幫助瀏覽者解決實(shí)際問題，比如可以回答他的提問或直接購買產(chǎn)品，對(duì)瀏覽者來說你的網(wǎng)站才是有生命的，有價(jià)值的。

三、總結(jié)

網(wǎng)站的用戶體驗(yàn)設(shè)計(jì)是是在互聯(lián)網(wǎng)時(shí)代開放、共享、自由的氛圍中的一種進(jìn)化需要，并且它最終將成為無論是從需求分析、到界面設(shè)計(jì)再到開發(fā)到運(yùn)行維護(hù)至關(guān)重要的一部分，因?yàn)槲覀冸S時(shí)都需要將用戶置入服務(wù)的核心，用我們的愛來澆注產(chǎn)品本身。

參考文獻(xiàn)：

[1] 戴力農(nóng).當(dāng)代設(shè)計(jì)研究理念：用戶體驗(yàn)超人性化設(shè)計(jì)方法.上海交通大學(xué)出版社，2009

[2] 崔武子，齊華山，于寧. 界面設(shè)計(jì)與Visual Basic.清華大學(xué)出版社，2004（7）

[3]（(美) Jason Beaird著 熊平, 宓媛珊譯. 完美網(wǎng)頁設(shè)計(jì). 北京:人民郵電出版社，2008（7）

篇5

現(xiàn)今,網(wǎng)絡(luò)已經(jīng)成為現(xiàn)代社會(huì)不可或缺的好幫手,人們從網(wǎng)絡(luò)中能夠獲得大量的信息,其中網(wǎng)頁對(duì)于人們的幫助是不容忽視的;如果說網(wǎng)址是互聯(lián)網(wǎng)最基本的組成部分,那么網(wǎng)頁就是網(wǎng)址最基本的元素。他們是通過各種鏈接相互關(guān)聯(lián),從而描述相關(guān)的主題或?qū)崿F(xiàn)相同的目的。網(wǎng)頁是由文本、圖象、Flas、聲音、視頻、超級(jí)鏈接、表格、導(dǎo)航欄、交互式表單等基本元素構(gòu)成,而這些元素從構(gòu)成形式上看就是簡(jiǎn)單的點(diǎn)、線、面等基本元素經(jīng)過了藝術(shù)創(chuàng)造,變得更加的有質(zhì)感；就拿文本來說,文本作為網(wǎng)頁中的基本元素，與平面構(gòu)成中的點(diǎn)元素有著相同的作用――點(diǎn)睛之筆。再從構(gòu)成的含義來說，它首先是一種造型的概念。所謂構(gòu)成就是以數(shù)種以上的單元重新組合成為一個(gè)新的單元。然而構(gòu)成它更多的是哲學(xué)和科學(xué)的含義:即“對(duì)象世界諸要素的分解與組合,使新的功能顯現(xiàn)。”構(gòu)成是創(chuàng)造形態(tài)的方法,研究如何創(chuàng)造形象,形與形之間怎樣組合,以及形象排列的方法,可以說是一種研究形象構(gòu)成的科學(xué)。

一、平面構(gòu)成的發(fā)展及其基本特點(diǎn)對(duì)于網(wǎng)頁設(shè)計(jì)而言所代表的意義

平面構(gòu)成是設(shè)計(jì)中最基本的訓(xùn)練,是在平面上按一定的原理設(shè)計(jì)、策劃多種視覺形式。我們學(xué)習(xí)構(gòu)成不是目的,而是形成目的的手段,是一種思維方式的訓(xùn)練、分析和實(shí)驗(yàn),最后通過這種思維方式的開發(fā),培養(yǎng)一種創(chuàng)造觀念,使我們有更多的想象力和創(chuàng)造性,開拓設(shè)計(jì)思路。那么,對(duì)于平面構(gòu)成的發(fā)展,就要從包豪斯及其風(fēng)格對(duì)現(xiàn)代設(shè)計(jì)的影響開始說,1919年,格羅佩斯在德國創(chuàng)辦了一所名叫包豪斯的設(shè)計(jì)學(xué)府,是需要具備充分的能力,運(yùn)用所有科學(xué)、技術(shù)、知識(shí)和美學(xué)的資源,創(chuàng)造一個(gè)能滿足人類精神與物質(zhì)雙重需要的新環(huán)境,以“提倡藝術(shù)與技術(shù)的統(tǒng)一”作為教學(xué)理念。平面構(gòu)成從包豪斯的教學(xué)理念中衍生而來,他不是以表現(xiàn)具體的物象為特征,但是它反映了自然現(xiàn)象運(yùn)動(dòng)變化的規(guī)律性?？梢詮膬蓚€(gè)方面來談它的基本特點(diǎn):第一是它以直覺為基礎(chǔ);用最簡(jiǎn)單的點(diǎn)、線、面進(jìn)行分解、組合、變化,反映出客觀現(xiàn)實(shí)所具有的運(yùn)動(dòng)規(guī)律。第二是它是一種高度強(qiáng)調(diào)理性活動(dòng)的、自覺的、有意識(shí)的再創(chuàng)造過程。

二、平面構(gòu)成的形態(tài)要素在網(wǎng)頁中所起的作用。點(diǎn)、線、面是平面構(gòu)成中的三個(gè)形態(tài)要素

（一）點(diǎn)表示位置,它既無長(zhǎng)度,也無寬度,是最小的單位

它在平面構(gòu)成中的概念只是一個(gè)相對(duì)概念,為什么這么說呢?因?yàn)樗窃诒容^中而存在，通過比較而顯現(xiàn);這樣說吧,同一個(gè)圓,在小的框架里圓顯得很大,在大的框架里圓則顯得很小,這就是點(diǎn)的相對(duì)概念。很多人都認(rèn)為點(diǎn)是小的,而且還是圓,實(shí)際上這種認(rèn)知是錯(cuò)誤的,自然界中的任何形態(tài),只要縮小到了一定的程度,就能夠產(chǎn)生不同的點(diǎn),點(diǎn)是視覺中心,所以說,在網(wǎng)頁中的每個(gè)字都可以看作是點(diǎn),由字排列出的文本就形成了構(gòu)成中所說的線及面了。

（二）線是點(diǎn)移動(dòng)的軌跡

從平面構(gòu)成來講,線是可以看的到的,它既有長(zhǎng)度,也有一定的寬度和厚度,在設(shè)計(jì)中是不可缺少的元素。只要提到線,大家直接就能夠說出線的分類,既直線和曲線。而直線和曲線對(duì)于人們來說，是有很強(qiáng)的心理暗示作用,看到直線,人們就會(huì)想到靜;看到曲線,大家又能聯(lián)想到動(dòng);直線具有男性的特點(diǎn),而曲線具有女性的特征;在很多網(wǎng)頁頁面設(shè)計(jì)上都運(yùn)用到了線的特性。

（三）面是線的連續(xù)移動(dòng)至終結(jié)而形成的

面是有長(zhǎng)度、寬度的,只是沒有厚度而已。比如說直線平行移動(dòng)形成長(zhǎng)方形;直線旋轉(zhuǎn)則移動(dòng)而成圓形;自由弧形移動(dòng)就會(huì)構(gòu)成有機(jī)形;如果直線和弧線結(jié)合就形成了不規(guī)則的形。在網(wǎng)頁設(shè)計(jì)中出現(xiàn)的圖像、動(dòng)畫、交互式表單等都是由不同的點(diǎn)、線連續(xù)移動(dòng)形成的面,給網(wǎng)頁一個(gè)完美的效果。像那些企業(yè)網(wǎng)站、購物網(wǎng)站、音樂網(wǎng)站以及游戲網(wǎng)站等,他們的網(wǎng)頁界面設(shè)計(jì)不僅有豐富的色彩吸引大眾,還有不同設(shè)計(jì)風(fēng)格的構(gòu)成形式更讓大家流連忘返。

三、平面構(gòu)成形式在網(wǎng)頁中的具體運(yùn)用

平面構(gòu)成設(shè)計(jì)是有組織的、有秩序地進(jìn)行排列、組合、分解,因此它也是必須遵循一種原則和設(shè)計(jì)形式。平面構(gòu)成中的形式大量被運(yùn)用到網(wǎng)頁界面中。

（一）重復(fù)構(gòu)成在網(wǎng)頁中的藝術(shù)魅力

重復(fù)在構(gòu)成中的概念被人們理解為”相同或相近的形態(tài)連續(xù)地、有規(guī)律地反復(fù)出現(xiàn)”或者是”把視覺形象秩序化、整齊化,在圖形中可以呈現(xiàn)出和諧統(tǒng)一富有整體感的視覺效果”。其實(shí)就象復(fù)印機(jī)復(fù)印東西一樣,就是我們所理解的重復(fù)。在網(wǎng)頁界面中,重復(fù)其實(shí)是被運(yùn)用的最多的一種形式,比如說像購物網(wǎng)站中的購物、收藏等按鈕,就是運(yùn)用了重復(fù),在購物網(wǎng)站中,不可能只有一種物品,如果要向廣大消費(fèi)者推銷更多商品,那么在網(wǎng)頁中出現(xiàn)”購買”和”收藏”按鈕,就要設(shè)計(jì)更多,讓大眾有更多的選擇機(jī)會(huì),才能提升該網(wǎng)頁的點(diǎn)擊率。

（二）對(duì)比構(gòu)成在網(wǎng)頁中的表現(xiàn)對(duì)瀏覽者的心理帶來的影響

對(duì)比是一種很自由的構(gòu)成形式,它并不是以構(gòu)成中的骨骼線為限制,而是依據(jù)形態(tài)自己本身的大小、疏密、虛實(shí)、現(xiàn)隱及形狀、色彩和肌理等方面的對(duì)比而構(gòu)成的。如果說協(xié)調(diào)求的是近似的話,那么對(duì)比則求的就是差異。在自然界中,白天與黑夜、骯臟與干凈、溫暖與寒冷都是對(duì)立的結(jié)合,當(dāng)圖形處于一種相異的狀況時(shí),就會(huì)發(fā)生對(duì)比,像大小、長(zhǎng)短、黑白等就是明顯的對(duì)比。在有的被文本占去大面積的網(wǎng)頁界面中，為什么會(huì)出現(xiàn)圖片、flas,甚至還會(huì)出現(xiàn)漂浮圖片,除了豐富界面以外,還有一種影響瀏覽者心理的作用,其實(shí)網(wǎng)頁界面中的文本與圖片、動(dòng)畫、漂浮圖片形成一種對(duì)比,這和瀏覽者心理有關(guān)系嗎?當(dāng)然,而且關(guān)聯(lián)很大,如果在一個(gè)網(wǎng)頁界面中,只有文本的話,那么這樣的網(wǎng)頁會(huì)給人一種什么感覺呢?乏味、枯燥、單調(diào),而瀏覽的人可謂是寥寥無幾,加上圖片、動(dòng)畫,甚至?xí)r不時(shí)的冒出漂浮圖片,不僅僅讓網(wǎng)頁界面內(nèi)容顯得豐富多彩,更讓大眾對(duì)網(wǎng)頁的內(nèi)容產(chǎn)生濃厚的興趣。萬事萬物除了遵循他們本應(yīng)該遵循的規(guī)則外,偶爾的對(duì)立也能起到一定的催化劑,就如對(duì)比構(gòu)成在網(wǎng)頁中給大眾心理所帶來的影響作用。

四、結(jié)束語

因?yàn)橛辛司W(wǎng)絡(luò),讓人類能夠更加方便、快捷地查詢信息;因?yàn)橛辛司W(wǎng)站,讓人類能夠更加懂得如何去獲取新的信息;因?yàn)橛辛司W(wǎng)頁,讓人類能夠及時(shí)獲得最新信息。網(wǎng)頁界面設(shè)計(jì)的美觀、新穎、時(shí)尚,讓大眾更愿意了解網(wǎng)頁!如今,網(wǎng)頁已經(jīng)成為廣大消費(fèi)者生活中不可或缺的一部分,網(wǎng)頁能夠?yàn)槿藗冏⑷敫嗟男迈r血液。

參考文獻(xiàn)：

篇6

[1]周峰，王征.FLASHACTIONSCRIPT3.0網(wǎng)絡(luò)動(dòng)畫編程基礎(chǔ)與實(shí)踐教程[M].北京：電子工業(yè)出版社，2008

[2]林紀(jì)河，祁玉芹.FLASHCS4網(wǎng)絡(luò)動(dòng)畫制作簡(jiǎn)明教程[M].北京：電子工業(yè)出版社，2009

[3]童罕，吳慶波，等.一種動(dòng)態(tài)網(wǎng)頁加速技術(shù)中的機(jī)制探討[J].微計(jì)算機(jī)信息，2009(27)

[4]崔俊杰.動(dòng)態(tài)網(wǎng)頁技術(shù)淺析[J].長(zhǎng)沙民政職業(yè)技術(shù)學(xué)院學(xué)報(bào)，2006，13(13)

[5]李志勇，徐長(zhǎng)通.基于ASP的WEB數(shù)據(jù)庫智能查詢[J].河南師范大學(xué)學(xué)報(bào)，2010，38(1)

參考文獻(xiàn)：

[1]雷蕓蕓.網(wǎng)頁設(shè)計(jì)中Flash動(dòng)畫的視覺應(yīng)用[J].新媒體研究，2016（3）.

[2]曹芳，李培培.《FLASH動(dòng)畫制作》課程教學(xué)改革的探索與研究[J].科技視界，2016（2）.

[3]周秀芳.Flash動(dòng)畫制作課程建設(shè)方案探究——以高職計(jì)算機(jī)應(yīng)用專業(yè)為例[J].當(dāng)代職業(yè)教育，2015（12）.

[4]李怡宏，楊薇.從“案例模仿”到“設(shè)計(jì)創(chuàng)作”的《Flash動(dòng)畫設(shè)計(jì)》課程教學(xué)[J].信息與電腦（理論版），2015（24）.

[5]王德敏.微課程的開發(fā)應(yīng)用[J].中國校外教育，2013，（6）.

[6]陳舒心.論“微課”在中職計(jì)算機(jī)專業(yè)課程中應(yīng)用的可行性[J].廣東教育（職教版），2015，（3）.

[7]胡鐵生.微課的內(nèi)涵理解與教學(xué)設(shè)計(jì)方法[J].廣東教育：綜合版，2014，（4）.

參考文獻(xiàn)：

[1]李建華.網(wǎng)頁設(shè)計(jì)的意義與現(xiàn)狀[J].太原城市職業(yè)技術(shù)學(xué)院學(xué)報(bào)，2014（08）.

[2]于紅波.淺議Flash技術(shù)在網(wǎng)站建設(shè)中的應(yīng)用[J].山東紡織經(jīng)濟(jì)，2011（12）.

[3]高華，黃劍鋒.Flash技術(shù)在網(wǎng)站設(shè)計(jì)中的應(yīng)用與研究[J].才智，2012（28）.

[4]劉強(qiáng).FlashCS3網(wǎng)站建設(shè)實(shí)例詳解[M].北京：電子工業(yè)出版社，2008.

參考文獻(xiàn)

[1]范朋.基于Qt的嵌入式Linux系統(tǒng)GUI的研究與實(shí)現(xiàn)[D].北京：北京郵電大學(xué)，2011.

[2]新視角文化行.FlashCS6動(dòng)畫制作實(shí)戰(zhàn)從入門到精通[M].北京：人民郵電出版社，2013.

[3]佚名.MFC與Flash聯(lián)合界面開發(fā)技術(shù)[EB/OL].[2012？06？07].http：//kuantianxia.blog.51cto.com/1041305/891521.

篇7

現(xiàn)國家正加強(qiáng)中職學(xué)校精品課程建設(shè)，精品課程建設(shè)工程的目標(biāo)是實(shí)現(xiàn)全國優(yōu)質(zhì)教學(xué)資源的共享，要求精品課程的相關(guān)內(nèi)容全部通過網(wǎng)站的方式對(duì)外開放。因此，精品課程網(wǎng)站建設(shè)是精品課程建設(shè)中的一個(gè)重要環(huán)節(jié)。

目前很多資料或論文在涉及精品課程網(wǎng)站制作時(shí)，都以站在網(wǎng)站的技術(shù)開發(fā)角度進(jìn)行論述，這些專業(yè)知識(shí)對(duì)于非計(jì)算機(jī)專業(yè)人員是較難透徹理解網(wǎng)站的開發(fā)過程。而且精品課程網(wǎng)站作為一個(gè)共享平臺(tái)，還要把課程的資源放到平臺(tái)上，涉及到平臺(tái)的建設(shè)、各個(gè)資源內(nèi)容制作和整合等工作，更是需要團(tuán)隊(duì)合作。一個(gè)完整的網(wǎng)站開發(fā)不像其它項(xiàng)目或者任務(wù)可以單獨(dú)完成，是需要一個(gè)團(tuán)隊(duì)多個(gè)人分工合作完成。

一、網(wǎng)站項(xiàng)目開發(fā)團(tuán)隊(duì)，包括以下的角色和職責(zé)：

（一）網(wǎng)站項(xiàng)目經(jīng)理

職責(zé)：1.項(xiàng)目執(zhí)行監(jiān)理2.質(zhì)量監(jiān)督員

網(wǎng)站項(xiàng)目經(jīng)理負(fù)責(zé)與用戶進(jìn)行溝通，了解用戶開發(fā)網(wǎng)站的思想、用途和要求。并創(chuàng)建和維護(hù)項(xiàng)目的規(guī)劃和戰(zhàn)略文件，預(yù)算表，項(xiàng)目進(jìn)度和甘特圖表，會(huì)議記錄，費(fèi)用記錄和團(tuán)隊(duì)其他詳細(xì)工作的項(xiàng)目文檔。并協(xié)調(diào)、溝通網(wǎng)站各項(xiàng)目小組的日常工作。

（二）藝術(shù)總監(jiān)

職責(zé)：1.網(wǎng)頁界面設(shè)計(jì)師2.交互式設(shè)計(jì)師

（FLASH，JavaScript，Ajax）3.媒體專家（攝影，插圖，視頻，音效）。藝術(shù)總監(jiān)的主要職責(zé)是設(shè)計(jì)網(wǎng)站的整體外觀和感覺。把網(wǎng)站排版、用戶界面設(shè)計(jì)、顏色標(biāo)準(zhǔn)、頁面布局細(xì)節(jié)、圖片要求、攝影、插畫、網(wǎng)站的視聽媒體等元素匯聚并形成一個(gè)整體。

（三）網(wǎng)站技術(shù)主管

職責(zé)：1.網(wǎng)頁程序設(shè)計(jì)師（.net，Java，PHP/Perl，Ruby）2.網(wǎng)頁工程師（XHTML，CSS，JavaScript，Ajax）3.數(shù)據(jù)庫管理員4.網(wǎng)站管理員網(wǎng)站技術(shù)主管必須掌握有網(wǎng)站的環(huán)境、開發(fā)語言和開發(fā)站點(diǎn)框架、選擇網(wǎng)絡(luò)數(shù)據(jù)庫等廣泛的網(wǎng)絡(luò)技術(shù)。他應(yīng)該在技術(shù)人員、創(chuàng)意人員和項(xiàng)目團(tuán)隊(duì)各主管中充當(dāng)一個(gè)橋梁或者翻譯工作

（四）網(wǎng)站制作主管

在設(shè)計(jì)早期階段，網(wǎng)站制作主管主要負(fù)責(zé)把原始的網(wǎng)站模型、界面和藍(lán)圖轉(zhuǎn)化成HTML頁面。一旦網(wǎng)站規(guī)劃及設(shè)計(jì)完成并且信息架構(gòu)也規(guī)劃好之后，網(wǎng)站制作主管的主要工作就是制作站點(diǎn)頁面，當(dāng)然他可以直接用html編寫，或者使用網(wǎng)站內(nèi)容管理系統(tǒng)（CMS），也可以用一些站點(diǎn)開發(fā)軟件，例如Adobe Dreamweaver。

（五）網(wǎng)站信息架構(gòu)師

網(wǎng)站信息架構(gòu)師主要負(fù)責(zé)網(wǎng)站的結(jié)構(gòu)和內(nèi)容進(jìn)行組織和分類。在整個(gè)項(xiàng)目的設(shè)計(jì)和規(guī)劃早期階段，信息架構(gòu)師是最活躍的。他要制定整個(gè)網(wǎng)站的內(nèi)容結(jié)構(gòu)，網(wǎng)站的框架結(jié)構(gòu)，向客戶和網(wǎng)站開發(fā)團(tuán)隊(duì)介紹網(wǎng)站的整體規(guī)劃。信息架構(gòu)師也要與網(wǎng)站設(shè)計(jì)師緊密合作，制作用于顯示網(wǎng)站各個(gè)頁面的名稱、導(dǎo)航和頁面內(nèi)容的網(wǎng)站藍(lán)圖。

1.文字撰稿人2.站點(diǎn)內(nèi)容專家（內(nèi)容協(xié)調(diào)，制作）。網(wǎng)站編輯負(fù)責(zé)整個(gè)網(wǎng)站的文字內(nèi)容和編輯質(zhì)量。他或她創(chuàng)建的網(wǎng)站編輯的基調(diào)，確定文字風(fēng)格，并與客戶和相關(guān)內(nèi)容的專家收集、整理。以上就是網(wǎng)站開發(fā)時(shí)所需要的六個(gè)基本角色及其職責(zé)，每個(gè)角色都有負(fù)責(zé)的方面。當(dāng)然其中有可能一個(gè)人員充當(dāng)幾個(gè)角色，也有可能一個(gè)角色里面要幾個(gè)人員組成。

二、網(wǎng)站項(xiàng)目開發(fā)過程及團(tuán)隊(duì)各角色相互合作關(guān)系

從圖1-1我們可以把網(wǎng)站作為一個(gè)完整的項(xiàng)目，可以分為“規(guī)劃”和“站點(diǎn)制作”兩個(gè)主要階段。

（一）規(guī)劃階段

這個(gè)階段里要進(jìn)行的工作就是用戶調(diào)查與網(wǎng)站規(guī)劃。網(wǎng)站項(xiàng)目經(jīng)理要與用戶進(jìn)行接觸，全面了解用戶的需求，包括網(wǎng)站的用途和要實(shí)現(xiàn)的功能。用戶也在這個(gè)階段明確要網(wǎng)站能實(shí)現(xiàn)的功能模塊和需要提供的材料。充分了解用戶需求后，藝術(shù)總監(jiān)和網(wǎng)站信息架構(gòu)師就要基于用戶的要求、網(wǎng)站的用途和網(wǎng)站訪問者等各方面的考慮，使用PhotoShop或其它工具繪制出網(wǎng)站首頁、二級(jí)頁面的圖形界面。與用戶確定好界面、功能與內(nèi)容，就開始分兩條線路進(jìn)行開發(fā)。1、技術(shù)路線：網(wǎng)站技術(shù)主管根據(jù)界面并與信息架構(gòu)師一起進(jìn)行技術(shù)規(guī)劃，制作好網(wǎng)站使用的開發(fā)語言、技術(shù)、數(shù)據(jù)結(jié)構(gòu)和數(shù)據(jù)庫等。2、內(nèi)容路線：網(wǎng)站編輯要開始規(guī)劃網(wǎng)站編輯的基調(diào)；內(nèi)容在網(wǎng)頁上的表現(xiàn)形式（文本、圖片、視頻、動(dòng)畫）；確定文字風(fēng)格和網(wǎng)頁顯示的字體的大小與字形；

（二）站點(diǎn)制作階段

站點(diǎn)制作階段是實(shí)際開發(fā)周期，各項(xiàng)目小組根據(jù)前面制定好的規(guī)劃進(jìn)行制作。網(wǎng)站信息架構(gòu)師在各部門之間進(jìn)行項(xiàng)目規(guī)則解釋、協(xié)調(diào)和統(tǒng)籌。1、程序開發(fā)：網(wǎng)站制作小組根據(jù)界面規(guī)劃把圖形界面轉(zhuǎn)換成網(wǎng)頁格式；依據(jù)技術(shù)規(guī)劃，制作網(wǎng)站的各頁面。從圖中的甘特表顯示，程序開發(fā)和網(wǎng)站合成占整個(gè)項(xiàng)目的最大時(shí)間比例。2、內(nèi)容整理：網(wǎng)站編輯要與客戶和相關(guān)內(nèi)容的專家收集、整理放到網(wǎng)站平臺(tái)的資源。網(wǎng)站資源如涉及到圖片、動(dòng)畫和視頻等，網(wǎng)站編輯要與媒體專家合作共同制作。當(dāng)平臺(tái)主要架構(gòu)搭建成形，后臺(tái)數(shù)據(jù)庫建立完畢，網(wǎng)站編輯就可以把網(wǎng)內(nèi)容上傳到網(wǎng)站平臺(tái)內(nèi)，把網(wǎng)站合成。

篇8

【關(guān)鍵詞】

政府網(wǎng)站

網(wǎng)頁制作

ASP 技術(shù)

ACCESS 數(shù)據(jù)庫

【英文對(duì)照】

ABSTRACT

The portal website of government departments is the best candidate and inevitable choice for government affairs opening. Its construction is based on the related policies and regulations on government affairs opening which are enforced by the state. This paper presents the construction of one portal webpage based on ASP and ACCESS database. The design and implementation of webpage mainly consists of three parts: government affair opening， online government office， and online communication. The front-end consists of ten major modules， including leader's speech， government affair opening， government dynamics， policies and regulations etc. The backend is a hybrid of C/S and B/S technologies， HTML and JScript are combined together and session object is used for inter-page data communication and traced the status of user logon， web based lookup and remote administration of webpage are implemented and access control to user of different privileges is achieved. The access to webpage news adapts a three-tier scheme which includes main page， title page and sub-page， the main page provides the overall look-and-feel and orchestrate all the modules so to form a complete webpage.

【KeyWord】

Government website

Webpage Making

ASP

ACCESS database

【目

錄】

前言 2

正文 3

第 一 章 概 述 3

1.1 網(wǎng)頁制作背景 3

1.2 網(wǎng)頁制作的意義 3

1.3 開發(fā)工具簡(jiǎn)介 4

第 二 章 可行性分析 5

2.1 B/S結(jié)構(gòu)介紹 5

2.2 ACCESS 數(shù)據(jù)庫 5

2.3 ASP 技術(shù) 5

第 三 章 網(wǎng)頁需求分析 7

3.1 總體功能需求分析 7

3.1.1. 基本功能需求 7

3.1.2. 功能結(jié)構(gòu)圖 7

3.2 網(wǎng)頁具體功能模塊需求分析 8

3.2.1. 政務(wù)公開功能 8

3.2.2. 網(wǎng)站辦事功能 8

3.2.3. 網(wǎng)上交流功能 8

3.3 網(wǎng)頁結(jié)構(gòu)圖 9

3.4 網(wǎng)頁版面規(guī)劃 10

3.5 網(wǎng)站CI形象設(shè)計(jì) 10

3.6 網(wǎng)頁布局技術(shù) 11

第 四 章 數(shù)據(jù)庫設(shè)計(jì) 12

4.1 數(shù)據(jù)庫概念結(jié)構(gòu)設(shè)計(jì) 12

4.2 數(shù)據(jù)庫邏輯結(jié)構(gòu)設(shè)計(jì) 14

第 五 章 人機(jī)界面設(shè)計(jì) 17

5.1 后臺(tái)登錄界面設(shè)計(jì) 17

5.2 用戶管理頁面設(shè)計(jì) 18

5.3 信息檢索頁面設(shè)計(jì) 18

5.4 后臺(tái)管理頁面設(shè)計(jì) 19

第 六 章 系統(tǒng)程序設(shè)計(jì) 20

6.1 程序設(shè)計(jì)語言 20

6.2 部份源程序?qū)崿F(xiàn)及文件 20

第 七 章 網(wǎng)頁測(cè)試 30

7.1 測(cè)試網(wǎng)站的建立 30

7.1.1. 測(cè)試網(wǎng)站環(huán)境 30

7.1.2. Web服務(wù)器IIS5.1簡(jiǎn)介 30

7.1.3. 網(wǎng)頁測(cè)試 30

7.2 網(wǎng)頁及網(wǎng)站維護(hù) 31

第 八 章 結(jié)論 32

參考文獻(xiàn) 33

致 謝 34

【前言】

在我國，繼黨的十六大提出推行電子政務(wù)、提高行政效率之后，十六屆三中全會(huì)進(jìn)一步強(qiáng)調(diào)要發(fā)展電子政務(wù)，提高政府的服務(wù)和管理水平。政府網(wǎng)站作為電子政務(wù)建設(shè)的龍頭是完善政府公共服務(wù)接入渠道的主要手段，它實(shí)現(xiàn)了按照用戶對(duì)象進(jìn)行信息資源的整合，提供覆蓋用戶全生命周期的各種信息和服務(wù)。同時(shí)，網(wǎng)頁信息傳播的即時(shí)性和全面性確保了政府大量重要信息的廣泛共享，優(yōu)化了社會(huì)資源配置，讓政務(wù)信息更便捷、更低成本地進(jìn)行傳遞。通過訪問政府網(wǎng)頁，企業(yè)和社會(huì)公眾可以24小時(shí)不間斷地，不受任何空間界限影響地與政府進(jìn)行信息交互，在促進(jìn)政務(wù)公開，改進(jìn)公共服務(wù)，提高行政效能，確保公眾知情權(quán)、參與權(quán)和監(jiān)督權(quán)等方面有著顯著成效。

政府網(wǎng)站建設(shè)的含義就是利用Internet/Intranet等計(jì)算機(jī)通信技術(shù)，在Internet上建立正式站點(diǎn)，通過網(wǎng)絡(luò)實(shí)現(xiàn)政府在政治、經(jīng)濟(jì)、社會(huì)、生活等諸多領(lǐng)域中的管理和服務(wù)職能，推動(dòng)政府辦公自動(dòng)化與網(wǎng)上便民服務(wù)，是政府和社會(huì)互動(dòng)的重要窗口。論文就巴中市網(wǎng)頁的設(shè)計(jì)和制作作了詳細(xì)描述，網(wǎng)頁主要功能模塊設(shè)置緊緊圍繞部門職能職責(zé)，密切結(jié)合公眾需求，實(shí)現(xiàn)了預(yù)期設(shè)計(jì)目標(biāo)，網(wǎng)頁經(jīng)本地局域網(wǎng)測(cè)試運(yùn)行正常。

【正文】

網(wǎng)頁制作

第 一 章 概 述

1.1 網(wǎng)頁制作背景

在當(dāng)前這個(gè)網(wǎng)絡(luò)時(shí)代，電子政務(wù)是各國政府倡導(dǎo)和推動(dòng)網(wǎng)絡(luò)化的5個(gè)重要應(yīng)用領(lǐng)域中的首要。美國早在克林頓政府時(shí)期就開始積極倡導(dǎo)和推動(dòng)電子政務(wù)和電子政府的建設(shè)。英國于2005年將所有的政府服務(wù)實(shí)現(xiàn)上網(wǎng)。新加坡更是從1981年就開始發(fā)展電子政務(wù)，目前其電子政務(wù)的發(fā)達(dá)程度已備受世人矚目。在我國，政府信息門戶網(wǎng)站作為展示政府整體形象的窗口和聯(lián)系群眾、服務(wù)群眾的橋梁正日益得到各級(jí)政府的重視。如今，全國各地的電子政務(wù)建設(shè)已進(jìn)入實(shí)質(zhì)階段，全國257個(gè)地市級(jí)城市中已經(jīng)有90%的城市建立了自己的政府網(wǎng)站。在應(yīng)用上，電子政務(wù)建設(shè)已經(jīng)從網(wǎng)絡(luò)基礎(chǔ)建設(shè)向功能應(yīng)用層面和社會(huì)服務(wù)層面轉(zhuǎn)變。隨著我國信息化進(jìn)程的深入推進(jìn)，將極大地調(diào)動(dòng)整個(gè)社會(huì)活力，推動(dòng)中國社會(huì)的飛速發(fā)展，并對(duì)中國未來的發(fā)展產(chǎn)生巨大的影響。

1.2 網(wǎng)頁制作的意義

首先，政府網(wǎng)站關(guān)系到政府的服務(wù)形象，關(guān)系到百姓的切身利益。政府部門通過制作網(wǎng)頁建立網(wǎng)站，是電子政務(wù)的最佳切入點(diǎn)和重要內(nèi)容，政府網(wǎng)頁的發(fā)展水平是衡量一個(gè)地區(qū)電子政務(wù)進(jìn)程的標(biāo)志。在政府網(wǎng)頁上，政務(wù)信息公開程度，有關(guān)為民服務(wù)欄目健全情況，信息反饋情況，在線辦公與網(wǎng)上受理情況等關(guān)系到政府的服務(wù)形象，關(guān)系到百姓的切身利益。其次，政府網(wǎng)頁制作有利于政府各類信息的充分共享，有利于政府決策水平的不斷提高。通過網(wǎng)頁的各類平臺(tái)迅速直接地獲取公眾的反饋信息，準(zhǔn)確掌握外部環(huán)境，大幅提高了正確決策與快速反應(yīng)的能力。隨著政府各類信息的公開化，政民互動(dòng)不斷加強(qiáng)，政府將在公眾面前展現(xiàn)出高效、透明的良好形象，這有利于提高社會(huì)凝聚力，對(duì)于維護(hù)社會(huì)穩(wěn)定、促進(jìn)社會(huì)發(fā)展具有重要意義。

1.3 開發(fā)工具簡(jiǎn)介

在眾多的網(wǎng)頁設(shè)計(jì)與制作工具軟件中，我根據(jù)實(shí)際需求及對(duì)軟件的熟悉程度，主要選取了Photoshop CS3、Fireworks 8.0、Flash MX 2004、Macromedia Dreamweaver8進(jìn)行網(wǎng)頁的開發(fā)和制作，這些軟件的主要特點(diǎn)分述如下。

? 網(wǎng)頁圖像設(shè)計(jì)工具——Photoshop CS3、Fireworks 8.0

在網(wǎng)頁制作過程中，首先要使用Photoshop或Fireworks 設(shè)計(jì)網(wǎng)頁和整體效果圖、處理網(wǎng)頁中的圖像、背景圖及網(wǎng)頁的圖標(biāo)、按鈕等。Photoshop是平面圖像處理業(yè)界霸主Adobe公司推出的跨越PC和MAC兩界首屈一指的大型圖像處理軟件.它功能強(qiáng)大，操作界面友好，得到了廣大第三方開發(fā)廠家的支持，從而也贏得了眾多的用戶的青睞。Fireworks是Adobe公司推出的著名平面圖像設(shè)計(jì)和圖像處理軟件，它具有強(qiáng)大的圖像處理功能和操作易用性，受到廣大平面圖形設(shè)計(jì)人員及專業(yè)廣告設(shè)計(jì)師的青睞。它涉及圖像合成、色彩校正、圖層調(diào)板、通道使用、動(dòng)作調(diào)板、路徑工具、濾鏡等圖像處理功能?？芍谱魅绨粹o制作、文字特效、材質(zhì)紋理、三維物體、影像特效及廣告創(chuàng)意設(shè)計(jì)等多種用途。

? 動(dòng)畫制作工具——Flash MX 2004

Flash MX 2004是Macromedia公司的一個(gè)的網(wǎng)頁交互動(dòng)畫制作工具。用flash制作出來的動(dòng)化是矢量的，不管怎樣放大、縮小，它還是清晰可見。 用flash制作的文件很小，這樣便于在互聯(lián)網(wǎng)上傳輸，它還采用了數(shù)據(jù)流技術(shù)，只要下載一部分，就能欣賞動(dòng)畫，而且能一邊播放一邊傳輸數(shù)據(jù)。 交互性更是flash動(dòng)畫的迷人之處，可以通過點(diǎn)擊按鈕、選擇菜單來控制動(dòng)畫的播放，這些優(yōu)點(diǎn)使flash日益成為網(wǎng)絡(luò)多媒體的主流。

? 網(wǎng)頁排版工具—— Macromedia Dreamweaver 8

Macromedia Dreamweaver 8是由Macromedia公司推出的，用于網(wǎng)頁開發(fā)和網(wǎng)站管理的專業(yè)化設(shè)計(jì)工具。它采用了多種新技術(shù)，具有設(shè)計(jì)和開發(fā)網(wǎng)站過程中需要的網(wǎng)站管理、網(wǎng)站設(shè)計(jì)、頁面制作、多媒體制作和動(dòng)畫制作等豐富實(shí)用的功能；它具有友好的操作界面，在文檔窗口中可以打開各種浮動(dòng)面板，同時(shí)還可以使用系統(tǒng)內(nèi)置的多種對(duì)象進(jìn)行操作。它將可視布局工具、應(yīng)用程序開發(fā)功能和代碼編輯支持組合在一起，其功能強(qiáng)大，使得各個(gè)層次的開發(fā)人員和設(shè)計(jì)人員都能夠快速創(chuàng)建界面吸引人的基于標(biāo)準(zhǔn)的網(wǎng)站和應(yīng)用程序。開發(fā)人員可以使用 Dreamweaver 及所選擇的服務(wù)器技術(shù)來創(chuàng)建功能強(qiáng)大的 Internet 應(yīng)用程序，從而使用戶能連接到數(shù)據(jù)庫、Web 服務(wù)。

第 二 章 可行性分析

2.1 B/S結(jié)構(gòu)介紹

B/S（Browser/Server，簡(jiǎn)稱B/S）結(jié)構(gòu)，即瀏覽器/服務(wù)器模式，它是WEB興起后的一種網(wǎng)絡(luò)結(jié)構(gòu)模式，從傳統(tǒng)的二層C/S結(jié)構(gòu)發(fā)展而來，通常采用三層結(jié)構(gòu)：瀏覽器-Web服務(wù)器-數(shù)據(jù)庫服務(wù)器，WEB瀏覽器是客戶端最主要的應(yīng)用軟件，瀏覽器通過Web Server 同數(shù)據(jù)庫進(jìn)行數(shù)據(jù)交互。

在B／S體系結(jié)構(gòu)系統(tǒng)中，用戶通過瀏覽器向分布在網(wǎng)絡(luò)上的許多服務(wù)器發(fā)出請(qǐng)求，服務(wù)器對(duì)瀏覽器的請(qǐng)求進(jìn)行處理，將用戶所需信息返回到瀏覽器。而其余如數(shù)據(jù)請(qǐng)求、加工、結(jié)果返回以及動(dòng)態(tài)網(wǎng)頁生成、對(duì)數(shù)據(jù)庫的訪問和應(yīng)用程序的執(zhí)行等工作全部由Web Server完成，這樣大大簡(jiǎn)化了客戶端，減輕了系統(tǒng)維護(hù)與升級(jí)的成本和工作量，降低了用戶的總體擁有成本（TCO）。

該結(jié)構(gòu)的缺點(diǎn)是存在數(shù)據(jù)安全性問題、對(duì)服務(wù)器要求過高、數(shù)據(jù)傳輸速度慢、軟件的個(gè)性化特點(diǎn)明顯降低，難以實(shí)現(xiàn)傳統(tǒng)模式下的特殊功能要求。

2.2 ACCESS 數(shù)據(jù)庫

Access是微軟公司推出的基于Windows的桌面關(guān)系數(shù)據(jù)庫管理系統(tǒng)（RDBMS），是Office系列應(yīng)用軟件之一。它提供了表、查詢、窗體、報(bào)表、頁、宏、模塊7種用來建立數(shù)據(jù)庫系統(tǒng)的對(duì)象；提供了多種向?qū)?、生成器、模板，把?shù)據(jù)存儲(chǔ)、數(shù)據(jù)查詢、界面設(shè)計(jì)、報(bào)表生成等操作規(guī)范化；為建立功能完善的數(shù)據(jù)庫管理系統(tǒng)提供了方便，也使得普通用戶不必編寫代碼，就可以完成大部分?jǐn)?shù)據(jù)管理的任務(wù)。由于Access數(shù)據(jù)庫的ODBC驅(qū)動(dòng)程序支持的SQL指令全，執(zhí)行效率高，所以Access后臺(tái)數(shù)據(jù)庫+ASP服務(wù)器端程序+客戶端IE瀏覽器，是一個(gè)精練、實(shí)用、高效的組合模式。

2.3 ASP 技術(shù)

ASP是Active Server Page的縮寫，意為“動(dòng)態(tài)服務(wù)器頁面”。ASP是微軟公司開發(fā)的代替CGI腳本程序的一種應(yīng)用，它可以與數(shù)據(jù)庫和其它程序進(jìn)行交互，是一種簡(jiǎn)單、方便的編程工具。ASP的網(wǎng)頁文件的格式是.asp，現(xiàn)在常用于各種動(dòng)態(tài)網(wǎng)站中。ASP是一種服務(wù)器端腳本編寫環(huán)境，可以用來創(chuàng)建和運(yùn)行動(dòng)態(tài)網(wǎng)頁或Web應(yīng)用程序。ASP網(wǎng)頁可以包含HTML標(biāo)記、普通文本、腳本命令以及COM組件等。利用ASP可以向網(wǎng)頁中添加交互式內(nèi)容（如在線表單），也可以創(chuàng)建使用HTML網(wǎng)頁作為用戶界面的web應(yīng)用程序。與HTML相比，ASP網(wǎng)頁具有實(shí)現(xiàn)動(dòng)態(tài)網(wǎng)頁技術(shù)；包含在HTML代碼所組成的文件中，易于修改和測(cè)試；可以使用服務(wù)器端ActiveX組件來執(zhí)行各種各樣的任務(wù)；方便連接ACCESS與SQL數(shù)據(jù)庫等多種優(yōu)點(diǎn)，其主要缺點(diǎn)是開發(fā)人員要有豐富的經(jīng)驗(yàn)，否則會(huì)留出漏洞，讓黑客利用進(jìn)行注入攻擊。安裝ASP時(shí)，系統(tǒng)提供了兩種腳本語言：VBScript和JScript，而VBScript則被作為系統(tǒng)默認(rèn)的腳本語言。

第 三 章 網(wǎng)頁需求分析

3.1 總體功能需求分析

網(wǎng)頁功能分析就是以系統(tǒng)的觀點(diǎn)，對(duì)已選定的對(duì)象與開發(fā)范圍進(jìn)行有目的、有步驟的實(shí)際調(diào)查和科學(xué)分析。分析的目的就是要弄清楚網(wǎng)頁要做什么，最終為后面的設(shè)計(jì)工作打下基礎(chǔ)。

該網(wǎng)頁作為電子政務(wù)的一種服務(wù)平臺(tái)，政務(wù)公開、在線辦事、網(wǎng)上交流是其基本的三大功能。

3.1.1. 基本功能需求

? 政務(wù)公開功能

根據(jù)2008年5月1日起施行的政府信息公開條例規(guī)定，行政機(jī)關(guān)應(yīng)當(dāng)將主動(dòng)公開的政府信息，通過政府公報(bào)、政府網(wǎng)站、新聞會(huì)以及報(bào)刊、廣播、電視等便于公眾知曉的方式公開，確保公眾享有充分的知情權(quán)、監(jiān)督權(quán)。

? 網(wǎng)站辦事功能

網(wǎng)上辦公辦事是網(wǎng)頁功能服務(wù)中非常重要的組成部分，是電子政務(wù)建設(shè)努力的方向。通過提供一些行政審批等項(xiàng)目的在線辦理極大地方便了群眾，減少了不必要的人為環(huán)節(jié)，節(jié)省了社會(huì)資源。

? 網(wǎng)上交流功能

通過搭建政民交流平臺(tái)，讓公眾不但能夠?qū)⒆约旱慕ㄗh與意見直接反映給部門領(lǐng)導(dǎo)，實(shí)現(xiàn)普通群眾參政、議政的夙愿，而且使領(lǐng)導(dǎo)能夠通過這一平臺(tái)，傾聽民聲、關(guān)注民情、體察民意，進(jìn)而為群眾辦理更多的實(shí)事、好事、貼心事。

3.1.2. 功能結(jié)構(gòu)圖

3.2 網(wǎng)頁具體功能模塊需求分析

根據(jù)總體功能需求分析，該部門網(wǎng)頁確定政務(wù)公開、工作動(dòng)態(tài)、領(lǐng)導(dǎo)講話等功能模塊，具體組成分別如下。

3.2.1. 政務(wù)公開功能

? 領(lǐng)導(dǎo)講話模塊

功能：即時(shí)領(lǐng)導(dǎo)關(guān)于三農(nóng)工作的各種會(huì)議、現(xiàn)場(chǎng)講話。

作用：傳達(dá)精神，貫徹意圖。

? 政務(wù)公開模塊

政務(wù)公開模塊包含七個(gè)子模塊：機(jī)構(gòu)職能、領(lǐng)導(dǎo)介紹、內(nèi)設(shè)科室、農(nóng)口系統(tǒng)、人事信息、規(guī)劃計(jì)劃、財(cái)政信息。模塊根據(jù)國家信息公開條例等法規(guī)政策要求，針對(duì)該政府部門必須公開的七個(gè)方面進(jìn)行設(shè)置。

? 工作動(dòng)態(tài)模塊

工作動(dòng)態(tài)模塊，包含六個(gè)子模塊：綜合信息、新村建設(shè)、農(nóng)業(yè)產(chǎn)業(yè)化、勞務(wù)開發(fā)、農(nóng)田建設(shè)、移民工作。功能根據(jù)該政府部門各科室（辦）所承擔(dān)的職能職責(zé)進(jìn)行設(shè)計(jì)，實(shí)現(xiàn)了各責(zé)任條塊當(dāng)前工作信息的即時(shí)公開。

? 政策法規(guī)模塊

模塊設(shè)置農(nóng)業(yè)法規(guī)、政策文件兩個(gè)子模塊，提供近年來國家關(guān)于三農(nóng)工作各種重要法規(guī)、政策的瀏覽和下載，同時(shí)對(duì)本區(qū)、部門關(guān)于三農(nóng)工作制定的各種政策文件進(jìn)行了公開，使法規(guī)政策透明化，接受公眾監(jiān)督。

? 專題專欄模塊

模塊包含科學(xué)發(fā)展觀、調(diào)研文章、企業(yè)推介、農(nóng)業(yè)前沿四個(gè)子模塊?？茖W(xué)發(fā)展觀子模塊緊扣時(shí)代所需，調(diào)研文章子模塊是在互聯(lián)網(wǎng)上開辟的一個(gè)嶄新的調(diào)研舞臺(tái)，企業(yè)推介子模塊為本地龍頭企業(yè)的宣傳、推廣提供了一個(gè)新平臺(tái)。農(nóng)業(yè)前沿子模塊放眼全球，宣傳、推介農(nóng)業(yè)領(lǐng)域的最新技術(shù)、最新品種。

3.2.2. 網(wǎng)站辦事功能

? 網(wǎng)上辦事模塊

模塊設(shè)置便民服務(wù)、服務(wù)流程、資料下載、統(tǒng)計(jì)報(bào)表四個(gè)子模塊，將該部門能夠進(jìn)行網(wǎng)上辦理的相關(guān)行政審批事項(xiàng)予以了公開，方便了群眾，提高了辦事效率，提升了部門形象。

3.2.3. 網(wǎng)上交流功能

? 在線交流模塊

模塊設(shè)置三農(nóng)論壇、領(lǐng)導(dǎo)信箱、咨詢留言、網(wǎng)上投訴、網(wǎng)上調(diào)查五個(gè)子模塊。三農(nóng)論壇子模塊為公眾之間相互交流提供了平臺(tái)。領(lǐng)導(dǎo)信箱、在線咨詢等四個(gè)子模塊，為政府部門決策即時(shí)提供了群眾的意見及建議。

? 聯(lián)系我們模塊

該模塊主要功能：收集網(wǎng)站的反饋信息。

3.3 網(wǎng)頁結(jié)構(gòu)圖

3.4 網(wǎng)頁版面規(guī)劃

全部網(wǎng)頁采用1024×768分辨率制成，網(wǎng)頁訪問采用首頁、導(dǎo)航頁和新聞頁三級(jí)頁面形式。

? 首頁

首頁使用的是國字型結(jié)構(gòu)布局。 國字型結(jié)構(gòu)布局是一些大型網(wǎng)站所喜歡的類型，即最上面是網(wǎng)站的標(biāo)題+主菜單，下半部分分為3個(gè)區(qū)域，左右分列一些兩小條內(nèi)容，中間是主題內(nèi)容，與左右一起羅列到底，最下面是網(wǎng)站的一些基本信息，聯(lián)系方式，版權(quán)聲明等。這種布局的優(yōu)點(diǎn)是能夠充分利用版面，信息量大;缺點(diǎn)是頁面擁擠，不夠靈活。

? 導(dǎo)航頁

采用拐角型布局，優(yōu)點(diǎn)是頁面結(jié)構(gòu)清晰，主次分明，缺點(diǎn)是規(guī)矩呆板，容易讓人“看之無味。

? 新聞頁

使用標(biāo)題正文型：這種類型即最上面是標(biāo)題或類似的一些東西，下面是正文；本站子頁大部分是這個(gè)結(jié)構(gòu)。

? 頁頭

本站頁頭以900×150的農(nóng)村風(fēng)景圖為底，左置“巴中市”六字及名稱英文“”O(jiān)ffice of rural affairs，Bazhou District，Bazhong City，右邊放置宣傳語（FLASH動(dòng)畫）一起構(gòu)成。

? 頁腳

本站頁腳如下：

3.5 網(wǎng)站CI形象設(shè)計(jì)

? 主色調(diào)與色彩

網(wǎng)站采用代表了春天、希望、田野的“綠色”為主色調(diào)，與部門的農(nóng)業(yè)、農(nóng)村、農(nóng)民三農(nóng)工作性質(zhì)相吻合。

? 字體

導(dǎo)航欄字體為“黑體”，14px；網(wǎng)站主欄目字體為“宋體”，14 px；正文字體為“宋體”，9 px；

? 交互方式

網(wǎng)站設(shè)置了專門的在線交流模塊，提供了論壇、網(wǎng)上投訴、咨詢留言、網(wǎng)上調(diào)查等多種交互方式。

3.6 網(wǎng)頁布局技術(shù)

網(wǎng)頁使用表格方式布局，同時(shí)用CSS進(jìn)行樣式控制。表格布局的優(yōu)勢(shì)在于它能對(duì)不同對(duì)象加以處理，而又不用擔(dān)心不同對(duì)象之間的影響。表格布局的缺點(diǎn)是，當(dāng)我們用了過多表格時(shí)，頁面下載速度受到影響。CSS層疊樣式表是W3C組織新近批準(zhǔn)的一個(gè)輔助HTML設(shè)計(jì)的新特性，它使整個(gè)HTML保持統(tǒng)一的外觀。過去在設(shè)置文本時(shí)，為了保持整個(gè)段落都使用相同的外觀，不得不為每一段設(shè)置屬性，很麻煩。采用CSS可以在設(shè)置文本之前，就指定整個(gè)文本的屬性，比如顏色、字體大小等等，獲得統(tǒng)一的文本外觀。

第 四 章 數(shù)據(jù)庫設(shè)計(jì)

數(shù)據(jù)庫在一個(gè)網(wǎng)頁系統(tǒng)中占有非常重要的地位，數(shù)據(jù)庫的結(jié)構(gòu)好壞將直接影響到應(yīng)用系統(tǒng)的實(shí)現(xiàn)效果和數(shù)據(jù)操作效率以及能否保證數(shù)據(jù)的一致性、完整性和安全性。

4.1 數(shù)據(jù)庫概念結(jié)構(gòu)設(shè)計(jì)

數(shù)據(jù)庫概念設(shè)計(jì)的任務(wù)是根據(jù)用戶需求設(shè)計(jì)數(shù)據(jù)的概念數(shù)據(jù)模型，簡(jiǎn)稱概念模型。概念模型是按用戶的觀點(diǎn)對(duì)數(shù)據(jù)和信息進(jìn)行建模，是從用戶的角度看到的數(shù)據(jù)庫，它可以用E-R模型來表示。構(gòu)成E-R圖的基本要素是實(shí)體型、屬性和關(guān)系，其表示方法為：實(shí)體型：用矩形表示，矩形框內(nèi)寫明實(shí)體名；屬性：用橢圓形表示，并用無向邊將其與相應(yīng)的實(shí)體連接起來；關(guān)系：用菱形表示，菱形框內(nèi)寫明關(guān)系名，并用無向邊分別將有關(guān)實(shí)體連接起來，同時(shí)在無向邊旁標(biāo)上聯(lián)系的類型。

根據(jù)前面的需求分析，可以得到本網(wǎng)頁數(shù)據(jù)庫系統(tǒng)的E-R圖，如圖4-1所示。

上述E-R圖的關(guān)系說明如下：管理員可以對(duì)所有網(wǎng)上調(diào)查、新聞信息、投訴留言、論壇發(fā)貼等實(shí)體進(jìn)行增刪編輯，它們都是1：n的關(guān)系。一個(gè)管理員可以對(duì)論壇所有注冊(cè)用戶進(jìn)行監(jiān)管，一個(gè)超級(jí)管理員可以對(duì)多個(gè)后臺(tái)管理普通用戶進(jìn)行監(jiān)管，它們的關(guān)系也都是1：n。

各實(shí)體屬性的E-R圖如下：

4.2 數(shù)據(jù)庫邏輯結(jié)構(gòu)設(shè)計(jì)

通過分析系統(tǒng)涉及的相關(guān)實(shí)體以及要收集、存儲(chǔ)和操縱的數(shù)據(jù)信息，本網(wǎng)頁數(shù)據(jù)庫共設(shè)置了新聞信息表（News）等6個(gè)表，分述如下。

? 新聞信息表:用于存儲(chǔ)新聞及政務(wù)信息。

表4-1 新聞信息表(News)

?

三農(nóng)論壇表:用于存儲(chǔ)論壇發(fā)帖。

表4-2 三農(nóng)論壇表(BBS)

?

投訴留言表:用于存儲(chǔ)群眾來信、投訴、咨詢及回復(fù)。

表4-3 投訴留言表(Message)

? 論壇注冊(cè)用戶表:用于存儲(chǔ)三農(nóng)論壇注冊(cè)用戶信息。

表4-4 論壇注冊(cè)用戶表(User)

? 后臺(tái)管理員表:用于存儲(chǔ)管理員姓名、密碼、權(quán)限。

表4-5 后臺(tái)管理員表(ManageUser)

?

網(wǎng)上調(diào)查表:用于存儲(chǔ)網(wǎng)站調(diào)查項(xiàng)及投票。

表4-6 網(wǎng)上調(diào)查表(OnlineSurvey)

第 五 章 人機(jī)界面設(shè)計(jì)

5.1 后臺(tái)登錄界面設(shè)計(jì)

設(shè)計(jì)思想：登錄頁面主要實(shí)現(xiàn)用戶的登錄。通過用戶名、密碼、隨機(jī)密碼、IP、SessionID的組合驗(yàn)證實(shí)現(xiàn)未登陸用戶的正常登陸和已登陸用戶中同一用戶名允許在同一IP上重復(fù)登陸，拒絕同一用戶名在不同IP上重復(fù)登陸。

圖5-1 登錄流程圖

圖5-2 管理員登錄界面

5.2 用戶管理頁面設(shè)計(jì)

設(shè)計(jì)思想：登錄頁面主要實(shí)現(xiàn)用戶的登錄，用戶有超級(jí)管理員、普通管理員。超級(jí)管理員可以對(duì)其進(jìn)行任何的操作，包括對(duì)普通管理員的增刪、密碼修改。一般用戶只可以做權(quán)限之內(nèi)的操作和只能對(duì)自身的信息作修改。

圖5-3 用戶管理流程圖

圖5-4 用戶管理界面

5.3 信息檢索頁面設(shè)計(jì)

設(shè)計(jì)思想：根據(jù)輸入的關(guān)鍵字實(shí)現(xiàn)單字段或多字段組合查詢。

圖5-5 信息檢索流程圖

5.4 后臺(tái)管理頁面設(shè)計(jì)

網(wǎng)站后臺(tái)管理系統(tǒng)提供了添加新聞內(nèi)容、管理全部新聞、領(lǐng)導(dǎo)信箱管理、在線咨詢管理、公眾留言管理、網(wǎng)上投訴管理、網(wǎng)上調(diào)查管理、信息中心管理、超級(jí)管理選項(xiàng)、文件上傳十個(gè)功能選擇項(xiàng)，可以完成新聞信息的在線編輯、咨詢留言的在線回復(fù)、網(wǎng)上調(diào)查項(xiàng)的增減等管理任務(wù)。

圖5-7 后臺(tái)功能結(jié)構(gòu)圖

第 六 章 系統(tǒng)程序設(shè)計(jì)

前面著重討論了系統(tǒng)功能模塊的設(shè)計(jì)，詳細(xì)分析了每一個(gè)模塊的功能，本章將就系統(tǒng)中模塊功能的具體實(shí)現(xiàn)，選取部分源程序進(jìn)行討論。

6.1 程序設(shè)計(jì)語言

網(wǎng)站主要采用ASP作為程序設(shè)計(jì)代碼的開發(fā)工具。使用ASP作為開發(fā)工具可以方便地建立動(dòng)態(tài)的、高性能的、安全的、跨平臺(tái)的先進(jìn)動(dòng)態(tài)網(wǎng)站，其突出特點(diǎn)有以下幾個(gè)：

? ASP可以將內(nèi)容的生成和顯示進(jìn)行分離

Web頁面開發(fā)者可以用HTML或XML 標(biāo)識(shí)進(jìn)行對(duì)最終頁面的設(shè)計(jì)，同時(shí)使用ASP Tag 或Java Script 來生成頁面上的動(dòng)態(tài)內(nèi)容，因?yàn)樗械哪_本都在服務(wù)器端運(yùn)行， 所以， 如果核心邏輯部分被封裝在標(biāo)識(shí)中， 那么Web管理人員或頁面設(shè)計(jì)者將只能編輯ASP頁面的顯示方式， 而不會(huì)影響其內(nèi)容的實(shí)質(zhì)。

? 對(duì)不同瀏覽器的兼容

由于ASP技術(shù)采用了將ASP Tag 和Java Script 在服務(wù)器端解釋并執(zhí)行而只將結(jié)果以HTML或XML的形式送回到客戶端的方法， 從而保證了對(duì)其它基于HTML的Web瀏覽器的完全兼容。

6.2 部份源程序?qū)崿F(xiàn)及文件

? 數(shù)據(jù)庫訪問技術(shù)

網(wǎng)頁在采用微軟IIS/PWS的網(wǎng)絡(luò)平臺(tái)，通過服務(wù)器端運(yùn)行的ASP程序來訪問后臺(tái)Access數(shù)據(jù)庫。數(shù)據(jù)庫訪問采用匿名身份驗(yàn)證方式，使用戶無需輸入用戶名或密碼便可以對(duì)數(shù)據(jù)庫進(jìn)行訪問。匿名身份驗(yàn)證是指由 IIS創(chuàng)建IUSR、計(jì)算機(jī)名稱、帳戶（計(jì)算機(jī)名稱是正在運(yùn)行IIS 的服務(wù)器名稱），當(dāng)匿名用戶請(qǐng)求數(shù)據(jù)庫內(nèi)容時(shí)IIS 會(huì)將該連接分配給 IUSER_ComputerName 帳戶，其中ComputerName。默認(rèn)情況下，IUSER_ComputerName 帳戶為 Guests 組的成員。此組具有 NTFS 文件系統(tǒng)權(quán)限所規(guī)定的安全限制，這些限制指定訪問級(jí)別以及可提供給公共用戶的內(nèi)容的類型。建立Access數(shù)據(jù)庫連接的步驟及參數(shù)意義如下：

第一行程序：建立一個(gè)ADO對(duì)象集中的Connection對(duì)象，也即連接對(duì)象。這是建立數(shù)據(jù)庫連接的初始步驟。執(zhí)行這行程序后，Conn成為一個(gè)連接對(duì)象。

第二行程序：建立一個(gè)ADO對(duì)象集中的Recordset對(duì)象，以便利用Recordset對(duì)象操作數(shù)據(jù)庫（當(dāng)然，這只是對(duì)數(shù)據(jù)庫操作的多種方式之一）。執(zhí)行這行后，rs就成為一個(gè)Recordset對(duì)象。

第三行程序：利用連接對(duì)象Conn的Open方法打開一個(gè)指定的數(shù)據(jù)庫。首先利用Server對(duì)象的MapPath函數(shù)，取得要打開數(shù)據(jù)庫的完整的文件路徑，并存儲(chǔ)在變量DBQ中。其次，因?yàn)槲覀円蜷_的是Access數(shù)據(jù)庫，所以要指定ODBC驅(qū)動(dòng)程序參數(shù)，表示要透過Access的ODBC驅(qū)動(dòng)程序來訪問數(shù)據(jù)庫。到這里，就已經(jīng)打開了數(shù)據(jù)庫名指定的數(shù)據(jù)庫。

第四行程序： Sql指令串。

第五行程序：利用rs對(duì)象的Open方法打開數(shù)據(jù)庫中的數(shù)據(jù)表。這其中有四個(gè)參數(shù)，其意義如下：

數(shù)據(jù)表名或SQL指令串：在這個(gè)參數(shù)里指定要打開的數(shù)據(jù)庫內(nèi)的數(shù)據(jù)表名稱，或者是用SQL的Select指令串確定的數(shù)據(jù)表的指定范圍數(shù)據(jù)

Connection對(duì)象：指定已經(jīng)打開的數(shù)據(jù)庫的Connection對(duì)象。

Recordset類型：表示打開數(shù)據(jù)表的方式，有四種選擇。數(shù)字0表示只讀方式，且當(dāng)前記錄只能下移；數(shù)字1表示可讀寫方式，當(dāng)前記錄可自由上下移動(dòng)，但不能及時(shí)看到別的用戶建立的新記錄，除非重新啟動(dòng)；數(shù)字2表示可讀寫方式，當(dāng)前記錄可自由移動(dòng)，而且可以及時(shí)看到別的用戶增加的新記錄；數(shù)字3表示只讀方式，但當(dāng)前記錄可以自由移動(dòng)。

鎖定類型：這個(gè)參數(shù)指定數(shù)據(jù)庫的鎖定功能。因?yàn)榫W(wǎng)絡(luò)上的數(shù)據(jù)庫都是多用戶的，很可能同時(shí)有多個(gè)用戶在操作數(shù)據(jù)庫。為了避免錯(cuò)誤，讓同一時(shí)間只可能有一個(gè)用戶修改數(shù)據(jù)，就要用鎖定功能。有四種選擇：數(shù)字1表示只讀方式鎖定，用戶不能更改數(shù)據(jù)；數(shù)字2表示悲觀鎖定，當(dāng)一個(gè)用戶用rs對(duì)象開始修改數(shù)據(jù)時(shí)就鎖定數(shù)據(jù)庫，直到用戶用rs.Update更新記錄后，才解除鎖定；數(shù)字3表示樂觀鎖定，只有在數(shù)據(jù)寫入數(shù)據(jù)庫中的時(shí)候才鎖定。數(shù)字4表示批次樂觀鎖定，只有在使用rs.UpdateBatch成批更新數(shù)據(jù)時(shí)候才鎖定數(shù)據(jù)記錄。

? 身份驗(yàn)證

本網(wǎng)站身份驗(yàn)證采用服務(wù)器端驗(yàn)證代碼方式，密碼算法采用流行的MD5算法，同時(shí)附加客戶端隨機(jī)密碼驗(yàn)證。MD5全稱Message-Digest Algorithm 5（信息-摘要算法），是由MIT Laboratory for Computer Science和RSA Data Security Inc的Ronald L. Rivest在90年代初向IEFT提交的一種不可逆運(yùn)算加密算法，經(jīng)MD2、MD3和MD4發(fā)展而來，面向32位的電腦。登陸驗(yàn)證按一個(gè)IP可以有多個(gè)用戶登陸，一個(gè)用戶只能登陸一個(gè)IP的原則進(jìn)行設(shè)計(jì)，具體代碼及解釋如下：

? 網(wǎng)上調(diào)查功能實(shí)現(xiàn)

圖6-1 網(wǎng)上調(diào)查投票界面

圖6-2 網(wǎng)上調(diào)查結(jié)果界面

網(wǎng)上調(diào)查實(shí)現(xiàn)代碼

第 七 章 網(wǎng)頁測(cè)試

7.1 測(cè)試網(wǎng)站的建立

7.1.1. 測(cè)試網(wǎng)站環(huán)境

網(wǎng)頁測(cè)試使用本單位局域網(wǎng)進(jìn)行，配置如下：

服務(wù)器端：操作系統(tǒng)—Windows xp

Web服務(wù)器—IIS5.1

瀏覽器—IE6.0

客戶端：Internet Explorer6.0

7.1.2. Web服務(wù)器IIS5.1簡(jiǎn)介

IIS是Internet Information Services的縮寫，是目前使用最廣泛的Web服務(wù)器，可以在UNIX和Windows平臺(tái)上運(yùn)行。它與Windows NT Server完全集成，允許使用Windows NT Server內(nèi)置的安全性以及NTFS文件系統(tǒng)建立強(qiáng)大靈活的Internet／Intranet站點(diǎn)。IIS組件主要包括Web服務(wù)器、FTP服務(wù)器、NNTP服務(wù)器和SMTP服務(wù)器，分別用于網(wǎng)頁瀏覽、文件傳輸、新聞服務(wù)和郵件發(fā)送等方面。

7.1.3. 網(wǎng)頁測(cè)試

? IIS配置

當(dāng)IIS被成功安裝后，將在計(jì)算機(jī)C:\Inetpub\wwwroot下新建一個(gè)默認(rèn)網(wǎng)站，通過修改默認(rèn)網(wǎng)站配置可以建立自己的站點(diǎn)。如自己的網(wǎng)頁放在D:\Wy目錄下，首頁文件名為Index.asp，其具體步驟如下：

第一步：在“默認(rèn)Web站點(diǎn)”上單擊右鍵，選“屬性”，以進(jìn)入名為“默認(rèn)Web站點(diǎn)屬性”設(shè)置界面。

第二步：轉(zhuǎn)到“主目錄”窗口，再在“本地路徑”輸入（或用“瀏覽”按鈕選擇）好自己網(wǎng)頁所在的“D:\Wy”目錄。

第三步：轉(zhuǎn)到“文檔”窗口，再按“添加”按鈕，根據(jù)提示在“默認(rèn)文檔名”后輸入自己網(wǎng)頁的首頁文件名“Index.asp”。

第四步：在“默認(rèn)Web站點(diǎn)”上單擊右鍵，選“新建虛擬目錄”，依次在“別名”處輸入“test”，在“目錄”處輸入“D:\Wy”后再按提示操作。

? 數(shù)據(jù)源（ODBC）配置

第一步：選擇控制面板中的管理工具打開數(shù)據(jù)源（ODBC）。

第二步：在選項(xiàng)卡系統(tǒng)DNS中添加Microsoft Access Driver(*.mdb)驅(qū)動(dòng)并指定數(shù)據(jù)源為網(wǎng)站的數(shù)據(jù)庫文件。

? 測(cè)試

打開瀏覽器，直接在地址欄中輸入：localhost/test/index.asp或者127.0.0.1/test/index.asp即可。

7.2 網(wǎng)頁及網(wǎng)站維護(hù)

在測(cè)試完成后，網(wǎng)頁就可以到互聯(lián)網(wǎng)上了，接下來要做的就是網(wǎng)站的日常維護(hù)了。網(wǎng)站維護(hù)就是對(duì)服務(wù)器及相關(guān)軟硬件的維護(hù)，對(duì)可能出現(xiàn)的問題進(jìn)行評(píng)估，制定響應(yīng)時(shí)間，制定相關(guān)維護(hù)規(guī)定，將網(wǎng)站維護(hù)制度化、規(guī)范化，主要包括以下內(nèi)容：

? 即時(shí)更新新聞內(nèi)容

? 留言、投訴、咨詢、信箱定期回復(fù)

? 數(shù)據(jù)庫內(nèi)容定期備份、刪減、分類

? 更正數(shù)據(jù)庫使用過程中發(fā)現(xiàn)的問題

? 定期進(jìn)行綜合分析，不斷優(yōu)化數(shù)據(jù)庫中數(shù)據(jù)結(jié)構(gòu)，提高使用效率

? 在系統(tǒng)運(yùn)行過程中應(yīng)定期對(duì)管理員用戶名和密碼進(jìn)行更新，并對(duì)IIS和NT權(quán)限作相應(yīng)設(shè)置

第 八 章 結(jié)論

本次利用畢業(yè)設(shè)計(jì)的機(jī)會(huì)，為自己工作的單位設(shè)計(jì)了網(wǎng)頁。網(wǎng)頁使用ASP技術(shù)開發(fā)，具有良好的交互性能，具備強(qiáng)大的后臺(tái)管理功能。新聞、信息檢索、互動(dòng)交流等主要模塊設(shè)計(jì)做到了與單位職能職責(zé)的緊密結(jié)合，達(dá)到了預(yù)期設(shè)計(jì)目標(biāo)。網(wǎng)頁經(jīng)單位局域網(wǎng)多次測(cè)試，在WindowsXP操作系統(tǒng)，IIS5.1的服務(wù)器環(huán)境上正常運(yùn)行。

此次網(wǎng)頁制作，通過大量閱讀書籍和求助互聯(lián)網(wǎng)，使我初步掌握了網(wǎng)頁設(shè)計(jì)制作的一般過程、ASP簡(jiǎn)單設(shè)計(jì)應(yīng)用、CSS和表單布局常識(shí)、ACCESS數(shù)據(jù)庫設(shè)計(jì)技能。特別是在ASP編程階段，通過無數(shù)次解決測(cè)試過程中排查出的問題，我不僅回顧和應(yīng)用了以前學(xué)習(xí)過的理念知識(shí)，還掌握了許多新的知識(shí)和技巧，獲益良多。但由于時(shí)間倉促，受一些技術(shù)和設(shè)備所限，網(wǎng)頁在美工、需求分析、網(wǎng)頁安全等方面存在諸多不足之處，有待后期運(yùn)行中進(jìn)一步改進(jìn)和完善。

參考文獻(xiàn)

1. 《Dreamweaver CS3 入門 提高 精通》，薛凱，康亞雄編著，機(jī)械工業(yè)出版社 2008

2. 《Photoshop CS3 平面設(shè)計(jì)標(biāo)準(zhǔn)教程》，李建宏，雷波編著，機(jī)械工業(yè)出版社 2008

3. 《ASP網(wǎng)頁數(shù)據(jù)庫短訓(xùn)教程》，劉瑞新，汪遠(yuǎn)征編著，機(jī)械工業(yè)出版社 2005

4. 《Flash CS3動(dòng)畫制作》，華信卓越編著，電子工業(yè)出版社 2008

5. 《網(wǎng)頁設(shè)計(jì)三合一》，甘登岱編著，清華大學(xué)出版社 2009

6. 《網(wǎng)頁設(shè)計(jì)與網(wǎng)站建》，邱云飛，溫國峰編著，清華大學(xué)出版社 2009

7. 《Access2007數(shù)據(jù)庫應(yīng)用與開發(fā)》，楊繼萍，孫巖，梁文新編著，清華大學(xué)出版社 2008

8. 《網(wǎng)頁制作從入門到精通》，譚貞軍，劉斌編著，清華大學(xué)出版社 2008

9. nbagri.gov.cn/index.jsp（寧波農(nóng)村經(jīng)濟(jì)綜合信息網(wǎng)）

10. 68design.net/（網(wǎng)頁設(shè)計(jì)師聯(lián)盟）

11. wznb.gov.cn/（溫州市委農(nóng)辦）

篇9

中圖分類號(hào)：TP315

畢業(yè)論文是高校本科教學(xué)過程中最重要的環(huán)節(jié)，也是最后的環(huán)節(jié)?，F(xiàn)在的大多數(shù)高校，就畢業(yè)設(shè)計(jì)指導(dǎo)來說基本上都是通過師生見面來完成的，或者是通過電話聯(lián)系。這樣導(dǎo)師有時(shí)既浪費(fèi)時(shí)間又不能及時(shí)給予指導(dǎo)和答疑。對(duì)于學(xué)生來說和老師過于頻繁的見面也會(huì)浪費(fèi)一定的時(shí)間，面對(duì)就業(yè)壓力越來越大的今天，應(yīng)屆畢業(yè)生面臨著找工作的難題也就越來越嚴(yán)重，學(xué)生沒有過多的精力和時(shí)間來和導(dǎo)師見面討論畢業(yè)設(shè)計(jì)中的各種問題。因此，在網(wǎng)絡(luò)如此發(fā)達(dá)的今天，采用網(wǎng)上的方式作為指導(dǎo)和答疑也不失是一種好的選擇。

基于ASP的畢業(yè)設(shè)計(jì)指導(dǎo)網(wǎng)站是用ASP動(dòng)態(tài)網(wǎng)頁技術(shù)和SQL Server 2000開發(fā)，它涵蓋計(jì)算機(jī)技術(shù)和網(wǎng)絡(luò)技術(shù)兩門學(xué)科。是提供給畢業(yè)生和指導(dǎo)教師之間溝通交流的好的平臺(tái)。也是彌補(bǔ)目前許多高校的網(wǎng)站系統(tǒng)中一個(gè)小的漏缺，可以作為高校網(wǎng)站系統(tǒng)中的一小部分。正是這一不起眼的小部分，卻給畢業(yè)生和指導(dǎo)教師帶來了許多方便，節(jié)省了許多時(shí)間，又能及時(shí)地得到老師的指導(dǎo)，從而提高指導(dǎo)效率。

1 網(wǎng)站總體功能設(shè)計(jì)

基于ASP的畢業(yè)設(shè)計(jì)指導(dǎo)網(wǎng)站管理系統(tǒng)的主要用戶分為三種類型：管理員、教師、學(xué)生。針對(duì)不同的用戶類型，登錄進(jìn)去都有不同的權(quán)限和操作功能。

2 系統(tǒng)功能實(shí)現(xiàn)

主要包括數(shù)據(jù)庫設(shè)計(jì)和網(wǎng)站功能設(shè)計(jì)。數(shù)據(jù)庫設(shè)計(jì)主要是創(chuàng)建數(shù)據(jù)庫和添加數(shù)據(jù)表，并創(chuàng)建觸發(fā)器和存儲(chǔ)過程等；網(wǎng)站功能設(shè)計(jì)主要是功能模塊的界面和程序代碼的實(shí)現(xiàn)。

2.1 數(shù)據(jù)庫設(shè)計(jì)

（1）創(chuàng)建數(shù)據(jù)庫和數(shù)據(jù)表

4）觸發(fā)器。觸發(fā)器是用戶定義在關(guān)系表上的一類由事件驅(qū)動(dòng)的特殊過程。一旦定義，任何用戶對(duì)表的增、刪、改操作均由服務(wù)器自動(dòng)激活相應(yīng)的觸發(fā)器，在DBMS核心層進(jìn)行集中的完整性控制。觸發(fā)器比約束更加靈活，實(shí)施比約束更為復(fù)雜的檢查和操作，具有更精細(xì)和更強(qiáng)大的數(shù)據(jù)控制能力。

在tbGuest表里創(chuàng)建了“update”觸發(fā)器，“update”觸發(fā)器用于當(dāng)更改tbGuest表中strTitle時(shí)，其他視圖關(guān)于該strTitle也相應(yīng)更改。

2.2 網(wǎng)站功能設(shè)計(jì)

網(wǎng)站功能設(shè)計(jì)主要是各個(gè)功能模塊的界面設(shè)計(jì)和程序代碼的實(shí)現(xiàn)。

點(diǎn)擊“管理個(gè)人信息”便可以進(jìn)入該界面。該模塊有查詢個(gè)人信息、修改密碼、查看公告的功能，其中學(xué)生和教師用戶還有查看群發(fā)消息的功能，但是管理員不必要有此項(xiàng)功能，因?yàn)楣芾韱T群發(fā)消息時(shí)在當(dāng)前的頁面就可以看到，管理員還具有公告的功能，師生可以在管理個(gè)人信息中點(diǎn)擊查看公告查看管理員的公告。還必須說明的是查詢個(gè)人信息項(xiàng)中學(xué)生和教師用戶沒有權(quán)限，只有管理員有添加、刪除和修改的權(quán)限。

上傳和下載文件模塊所有用戶都有，該功能主要是方便用戶的文件交流，點(diǎn)擊上傳文件可進(jìn)入上傳界面，點(diǎn)擊下載可進(jìn)入下載界面。

向指導(dǎo)老師提問模塊是集結(jié)學(xué)生的提問，教師的回復(fù)和管理員的提醒答疑（管理員還可以選擇公告的方式提醒教師答疑）為同一模塊，該模塊功能可以提供多方交流溝通，點(diǎn)擊選擇的方式可以進(jìn)入相應(yīng)的界面，學(xué)生可通過三種方式完成提問；教師通過相應(yīng)的方式回復(fù)；管理員通過三種方式提醒教師答疑。

查詢問題模塊的實(shí)現(xiàn)，此模塊只有留言方式可以查詢，其他不必要。在學(xué)生和指導(dǎo)老師之間提供三種交流方式，查詢中學(xué)生和教師沒有權(quán)限，只有管理員有添加、刪除的權(quán)限。

首頁模塊和退出系統(tǒng)模塊，單擊首頁則返回首頁登錄界面，單擊退出系統(tǒng)則實(shí)現(xiàn)關(guān)閉網(wǎng)頁。

3 系統(tǒng)測(cè)試結(jié)果

本系統(tǒng)曾經(jīng)移植到多臺(tái)計(jì)算機(jī)上對(duì)不同配置的計(jì)算機(jī)進(jìn)行兼容性測(cè)試，測(cè)試結(jié)果表明，Web在不同的環(huán)境配置下運(yùn)行正常。

4 結(jié)語

本設(shè)計(jì)是基于B/S架構(gòu)，采用ASP動(dòng)態(tài)網(wǎng)頁技術(shù)和SQL Server 2000，結(jié)合Dreamweaver軟件開發(fā)出來的。網(wǎng)站根據(jù)不同身份的用戶實(shí)現(xiàn)了不同的應(yīng)用操作界面，各個(gè)界面的功能稍微不同但相差不大。整個(gè)系統(tǒng)界面友好，運(yùn)行可靠，系統(tǒng)功能基本滿足用戶要求，從而加強(qiáng)了指導(dǎo)老師和學(xué)生之間的交流，提高了論文寫作的效率。本系統(tǒng)可作為一個(gè)單獨(dú)的畢業(yè)設(shè)計(jì)指導(dǎo)網(wǎng)站，也可以嵌入到高校網(wǎng)站系統(tǒng)中作為一個(gè)子系統(tǒng)。

參考文獻(xiàn)：

[1]李林，申時(shí)凱，王衛(wèi)星.Visual Basic程序設(shè)計(jì)[M].北京：地質(zhì)出版社，2006，2.

[2]尚俊杰.網(wǎng)絡(luò)程序設(shè)計(jì) ―ASP（第三版）[M].北京：清華大學(xué)出版社，2009，6.

[3]王珊，薩師煊.數(shù)據(jù)庫系統(tǒng)概論（第四版）[M].北京：高等教育出版社，2005，3.

[4]趙文耘，牛軍鈺.軟件工程[M].北京：清華大學(xué)出版社，2007，1.

[5]張克非網(wǎng)絡(luò)程序設(shè)計(jì)及應(yīng)用[M].北京：北京航空航天大學(xué)出版社，2007，6.

[6]何薇，舒后.網(wǎng)絡(luò)數(shù)據(jù)庫技術(shù)與應(yīng)用[M].北京：清華大學(xué)出版社，2011，4.

[7]呂云翔，王洋，肖咚.軟件測(cè)試案例教程[M].北京：機(jī)械工業(yè)出版社，2011，1.

篇10

隨著學(xué)生對(duì)互聯(lián)網(wǎng)的依賴性越來越強(qiáng)，以及Googlescholar、百度學(xué)術(shù)等學(xué)術(shù)搜索引擎對(duì)圖書館學(xué)術(shù)資源主體地位的沖擊，使得圖書館網(wǎng)站的用戶體驗(yàn)變得越來越重要。圖書館網(wǎng)站必須進(jìn)行優(yōu)化設(shè)計(jì)，使用戶可以方便地瀏覽網(wǎng)站的信息、使用網(wǎng)站的服務(wù)，讓用戶獲得愉快的體驗(yàn)，才能吸引用戶使用圖書館的網(wǎng)站，使用圖書館的資源與服務(wù)。用戶體驗(yàn)強(qiáng)調(diào)在網(wǎng)站構(gòu)建的過程中以用戶為中心，充分考慮用戶體驗(yàn)的內(nèi)容及影響因素，通過設(shè)計(jì)滿足用戶需求，符合用戶審美體驗(yàn)、認(rèn)知特點(diǎn)、使用習(xí)慣的組織系統(tǒng)、導(dǎo)航系統(tǒng)等，從而讓用戶獲得良好的體驗(yàn)效果。用戶體驗(yàn)設(shè)計(jì)的目標(biāo)可以歸納為：解決用戶需求，減少用戶理解和操作的成本，給用戶留下美好而深刻的印象。基于用戶體驗(yàn)的網(wǎng)站設(shè)計(jì)主要包括：視覺設(shè)計(jì)、界面設(shè)計(jì)和導(dǎo)航設(shè)計(jì)等。

1視覺設(shè)計(jì)

視覺設(shè)計(jì)是在用戶審美文化的基礎(chǔ)上，通過色彩、字體、圖片、按鈕、隱喻等的使用，設(shè)計(jì)出富有美感和藝術(shù)感的網(wǎng)站，從而實(shí)現(xiàn)在很短的時(shí)間內(nèi)吸引住用戶，并激發(fā)用戶進(jìn)一步的信息行為[1]。圖書館網(wǎng)站在視覺設(shè)計(jì)上要符合用戶當(dāng)前的視覺趨勢(shì)，體現(xiàn)圖書館的文化內(nèi)涵，通過圖文、色彩、形狀的搭配以及信息塊的建立和整合，形成一個(gè)疏密有序、圖文并茂、條理清晰、氣氛和諧的網(wǎng)站視覺感受。

1.1符合視覺趨勢(shì)

不同時(shí)期用戶的審美取向與內(nèi)心訴求是不同的，網(wǎng)站的設(shè)計(jì)一定要符合當(dāng)前用戶的視覺趨勢(shì)。就目前而言，視覺趨勢(shì)大致如下：響應(yīng)式的網(wǎng)頁設(shè)計(jì)讓網(wǎng)站頁面無論屏幕尺寸大小都能有最佳的顯示效果[2]，寬屏、大圖讓頁面更顯大氣；改變以往用線條來分割區(qū)域的方式，采用空隙和留白，讓頁面順暢自由的呼吸，給用戶留下廣闊的思考空間；減少漸變和視覺元素，采用規(guī)整的布局、扁平化的視覺風(fēng)格，讓整體感覺更清爽。在網(wǎng)站構(gòu)建之初，設(shè)計(jì)師一般會(huì)根據(jù)圖書館的需求結(jié)合當(dāng)前的視覺趨勢(shì)設(shè)計(jì)出至少3版首頁設(shè)計(jì)圖，圖書館可以采用問卷調(diào)查的形式從中選出最受目標(biāo)用戶歡迎的頁面。

1.2做好色彩搭配

色彩是網(wǎng)站最具表現(xiàn)力和感染力的視覺元素，好的色彩搭配可以吸引用戶的注意力，給用戶帶來過目不忘的效果。相反，太過單調(diào)乏味的頁面會(huì)使用戶視線游離；過于炫目多彩的頁面又會(huì)對(duì)用戶的實(shí)際需要造成干擾。網(wǎng)站的色彩搭配上要注意以下情況：（1）每種色彩都有自己特定的含義和象征，會(huì)給人帶來不同的情感反應(yīng)[3]，網(wǎng)站設(shè)計(jì)要合理恰當(dāng)?shù)倪\(yùn)用，設(shè)計(jì)符合網(wǎng)站自身特色的色彩搭配，把網(wǎng)站的思想正確的傳遞給用戶。例如，“紅色”可以給人熱情、喜慶、奔放的情感反應(yīng)，也能給人危險(xiǎn)的心理暗示；金燦燦的“黃色”給人富有、高貴之感，而混濁的暗黃給人凋謝、衰敗之感；“藍(lán)色”象征著智慧、理智、清爽，會(huì)讓人感覺平靜、深遠(yuǎn)、穩(wěn)定、可靠。（2）不同色彩對(duì)眼睛刺激不同，會(huì)造成視覺上先后順序和關(guān)注度的不同。在色彩的運(yùn)用上，要考慮內(nèi)容的先后順序和優(yōu)先級(jí)，正確的運(yùn)用色彩。例如，冷色類和暖色類色彩是有明顯的層次差別的，一般情況下，用戶會(huì)先注意到暖色調(diào)色彩，且對(duì)暖色調(diào)色彩的關(guān)注度和點(diǎn)擊量要高于冷色調(diào)色彩；色彩的反差更容易造成用戶的關(guān)注度的不同，通常高反差色彩更能引起用戶的關(guān)注[4]。（3）避免使用色盲不易區(qū)分的顏色對(duì)。網(wǎng)站的色彩設(shè)計(jì)要保證在辨識(shí)色彩方面存在缺陷的用戶（如紅綠色盲、藍(lán)黃色盲、全色弱等）也能正常使用網(wǎng)站，避免使用深紅和黑、深紅和深綠、藍(lán)色和紫色以及淺綠和白色這樣的顏色對(duì)[5]。網(wǎng)站色彩設(shè)計(jì)時(shí)可在專業(yè)的色盲所見效果檢測(cè)網(wǎng)站（如網(wǎng)站和）上檢測(cè)，確保需要辨識(shí)顏色的地方所用的顏色在色盲和正常人看來是一致的，不需要辨識(shí)顏色的地方，在色盲眼中是清晰的。

2界面設(shè)計(jì)

界面設(shè)計(jì)最基本的性能是功能性和使用性。通過界面設(shè)計(jì)，讓信息更加流暢的傳遞給用戶，讓功能和操作變得更加簡(jiǎn)單。界面設(shè)計(jì)包括標(biāo)識(shí)設(shè)置能否被用戶所理解[1]、頁面布局是否能夠凸顯頁面重點(diǎn)、符合用戶的習(xí)慣等。在標(biāo)識(shí)設(shè)置方面重點(diǎn)是要避免使用用戶不熟悉的詞匯；頁面布局方面，首頁一定要將關(guān)注度高的欄目放在醒目的位置上；其它欄目的擺放位置要遵從網(wǎng)站形成的慣例，符合用戶的心智模型；以信息呈現(xiàn)為主的頁面要建立清晰的視覺層次。

2.1避免使用用戶不熟悉的詞匯

根據(jù)Krug的可用性第一規(guī)律，網(wǎng)頁必須是清晰且自明的[6]，也就是說網(wǎng)頁的內(nèi)容對(duì)于用戶來說是不言而喻、一目了然的。要做到這一點(diǎn)，就要避免使用用戶不熟悉的詞匯，比如，OPAC、E讀、查收查引、題名、責(zé)任者、資源發(fā)現(xiàn)系統(tǒng)等。這些字用戶都認(rèn)識(shí)，但不代表真的理解了意思，因?yàn)樾滦畔⒅挥泻鸵延械闹R(shí)結(jié)構(gòu)緊密結(jié)合，才能被徹底的理解吸收，而用戶基本上是非圖書館專業(yè)的學(xué)生和老師，接受過的圖書館專業(yè)培訓(xùn)比較少，對(duì)這些詞很難做到一看就懂。當(dāng)用戶在網(wǎng)站上尋找信息或者某個(gè)功能時(shí)，他們并不會(huì)認(rèn)真閱讀，只是快速而粗略地掃描屏幕上與目標(biāo)相關(guān)的東西[4]，這些用戶不熟悉的詞匯往往被認(rèn)為是與目標(biāo)無關(guān)，直接被忽略掉。可以把“OPAC”換成“館藏書刊搜索”；“E讀”換成“全國高校館藏搜索”；“查收查引”換成“論文收錄引用”；“題名”換成“書名/篇名”；“責(zé)任者”換成“作者”；資源發(fā)現(xiàn)系統(tǒng)因?yàn)閷?shí)現(xiàn)的是圖書館紙質(zhì)和電子館藏的一站式搜索，所以一般采用學(xué)校特色名字加上搜索或?qū)W術(shù)搜索的形式，例如，清華大學(xué)圖書館的“水木搜索”、北京大學(xué)圖書館的“未名學(xué)術(shù)搜索”、南方科技大學(xué)圖書館的“南科學(xué)術(shù)搜索”、浙江大學(xué)圖書館的“求是學(xué)術(shù)搜索”等。

2.2關(guān)注度高的欄目放在醒目的位置上

關(guān)注度高的欄目放在首頁醒目的位置上可以有效提高網(wǎng)站的用戶體驗(yàn)。網(wǎng)站欄目的關(guān)注度可通過網(wǎng)站分析工具來統(tǒng)計(jì)。目前，免費(fèi)的網(wǎng)站分析工具有十余種，比如，GoogleAnalytics、CrazyEgg、Yahoo!WebAnalytics、百度統(tǒng)計(jì)和CNZZ的站長(zhǎng)統(tǒng)計(jì)等。其主要采用當(dāng)前較為流行的基于腳本（JavaScript等）的統(tǒng)計(jì)方式，這種方法需要在網(wǎng)站的Html代碼中嵌入一段腳本來統(tǒng)計(jì)網(wǎng)站的被訪問情況。館員可通過網(wǎng)站訪問情況統(tǒng)計(jì)分析，來確定網(wǎng)站中用戶關(guān)注度最高的欄目。以南方科技大學(xué)圖書館舊版網(wǎng)站為例，關(guān)注度最高的欄目是“數(shù)據(jù)庫導(dǎo)航”，關(guān)注度為11.32%；其次是“館藏資源搜索欄”，因該版網(wǎng)站中沒有資源發(fā)現(xiàn)系統(tǒng)，所以主要搜索館藏紙本資源，關(guān)注度為9.47%；關(guān)注度第三的欄目是“我的圖書館”，關(guān)注度為7.02%。在新網(wǎng)站的設(shè)計(jì)中就要把這3個(gè)欄目放在網(wǎng)站中最醒目的位置。一般情況下，網(wǎng)站的上半部分和中左部分的被關(guān)注度要高于右半部分和下半部分。網(wǎng)站中最醒目的位置的確定可以在新網(wǎng)站的測(cè)試過程中，通過眼動(dòng)跟蹤技術(shù)記錄用戶在使用網(wǎng)站時(shí)所注視的網(wǎng)站的位置，從而找出網(wǎng)站的關(guān)注“熱點(diǎn)”———網(wǎng)站中最醒目的位置。

2.3遵從網(wǎng)站形成的慣例

當(dāng)一個(gè)人訪問一個(gè)新網(wǎng)站的時(shí)候，他尋找信息的第一個(gè)位置就是在其它大多數(shù)網(wǎng)站找到它們的地方，所以遵從網(wǎng)站形成的慣例可以減少用戶的尋找成本，讓用戶找起來更方便。比如，語言切換、用戶登錄、站內(nèi)搜索等獨(dú)立于網(wǎng)站結(jié)構(gòu)的功能或內(nèi)容一般設(shè)置在網(wǎng)頁頂端；重要的、需求大的欄目應(yīng)該放在網(wǎng)頁上方主導(dǎo)航的位置；相對(duì)而言不那么重要、需求不那么大的欄目應(yīng)該放在下方導(dǎo)航條的位置；網(wǎng)站的隱私政策、免責(zé)聲明、版權(quán)等一般放在底部。

2.4符合用戶的心智模型界面設(shè)計(jì)

符合用戶的心智模型主要為了讓用戶在使用網(wǎng)站的過程中思考降到最低、操作簡(jiǎn)單到極致。心智模型是影響用戶與網(wǎng)站交互時(shí)內(nèi)在的、可預(yù)測(cè)的認(rèn)知模型[7]，是隱含在用戶內(nèi)心深處的一種思維方式和思想觀念，直接或者間接的影響著用戶的行為[8]。也就是說，當(dāng)用戶在網(wǎng)站上尋找某一元素時(shí)，并不是從上到下順序?qū)ふ?，而是在用戶心中已?jīng)形成了關(guān)于這個(gè)元素應(yīng)該放在哪個(gè)位置的預(yù)期[9]，然后根據(jù)預(yù)期去尋找該元素。了解用戶的心智模型，可以知道用戶心中欄目的位置，從而提升欄目位置與用戶預(yù)期的位置吻合度；了解用戶的心智模型，可以知道某一信息在用戶心中應(yīng)該屬于哪個(gè)欄目，從而提高欄目的名稱與用戶心中名稱的吻合度。要提高網(wǎng)站界面與用戶心智模型的吻合度，可以在網(wǎng)站的建設(shè)過程中通過迭代的可用性測(cè)試[10]，不斷地發(fā)現(xiàn)網(wǎng)站中存在的問題，通過布局的不斷調(diào)整，讓用戶的操作變得簡(jiǎn)單、再簡(jiǎn)單；通過建立清晰的流程和界面，減少用戶的思考和尋找時(shí)間。最后用戶耗費(fèi)時(shí)間最少的界面設(shè)計(jì)就是最趨近于用戶的心智模型的界面。調(diào)研用戶的心智模型可以通過如實(shí)觀察法、遠(yuǎn)程測(cè)試法和眼動(dòng)跟蹤技術(shù)等方法來實(shí)現(xiàn)。筆者采用了如實(shí)觀察法，無需遠(yuǎn)程監(jiān)測(cè)法的屏幕共享技術(shù)，也不用眼動(dòng)跟蹤儀，只要有臺(tái)可供用戶瀏覽網(wǎng)站的電腦即可，而且不僅能清晰的觀察到用戶的操作，直接、及時(shí)地獲取用戶的反饋，還能夠捕捉用戶的細(xì)微反應(yīng)，挖掘用戶內(nèi)隱的體驗(yàn)信息[11]。比如用戶發(fā)出“咦？”、“哦！”等聲音，或者皺眉、撓頭等動(dòng)作，這些都能反映出存在的問題。如實(shí)觀察法主要是讓被試用戶在一個(gè)可控制的實(shí)驗(yàn)室環(huán)境里完成指定任務(wù)，通過觀察用戶信息搜索過程，總結(jié)用戶的行為數(shù)據(jù)等[12]，在測(cè)試過程中，要減少語言對(duì)用戶的干擾，切忌引導(dǎo)性過強(qiáng)，要更多地去關(guān)注用戶的操作行為?？梢怨膭?lì)用戶采用“出聲思維法”，即要求用戶在操作時(shí)，將完成任務(wù)時(shí)所有的思考、行為、感受都描述出來，這樣測(cè)試員更容易發(fā)現(xiàn)用戶行為背后的原因。例如，在南方科技大學(xué)圖書館網(wǎng)站的調(diào)研中發(fā)現(xiàn)，用戶在完成“查看我的借閱信息”的任務(wù)時(shí)，偶爾使用圖書館網(wǎng)站的用戶，受其它網(wǎng)站的影響會(huì)在網(wǎng)站的頂端尋找“我的”相關(guān)欄目；經(jīng)常使用圖書館網(wǎng)站的用戶，因知道該信息會(huì)在“我的圖書館”中找到，所以找尋的欄目會(huì)鎖定在“我的圖書館”，而找尋的位置會(huì)受到圖書館舊版網(wǎng)站的影響，在網(wǎng)站中間的直接導(dǎo)航部分找“我的圖書館”欄目。綜合這兩種情況，在新版網(wǎng)站的設(shè)計(jì)中將“我的”放置在網(wǎng)站上方全局導(dǎo)航的區(qū)域，“我的”這個(gè)欄目被設(shè)計(jì)為用戶的個(gè)人空間，里面的內(nèi)容包含用戶的個(gè)人基本信息、借閱信息、薦購信息等“我的圖書館”中查詢和操作的信息以及網(wǎng)站的個(gè)性化定制內(nèi)容。另外，在網(wǎng)站的直接導(dǎo)航區(qū)域設(shè)置“我的圖書館”的入口，方便讀者進(jìn)入“我的圖書館”。

2.5建立清晰的視覺層次感

建立清晰的視覺層次感可以在用戶瀏覽網(wǎng)頁時(shí)形成良性引導(dǎo)，從而減少用戶的尋找時(shí)間。用戶在瀏覽頁面時(shí)會(huì)對(duì)網(wǎng)站頁面的視覺層次進(jìn)行分解，篩選出需要的東西。好的視覺層次通過預(yù)先處理，用一種用戶能快速理解的方式對(duì)頁面進(jìn)行組織并根據(jù)模塊的優(yōu)先級(jí)進(jìn)行排列，從而減少了用戶的尋找時(shí)間。大小、顏色、對(duì)比、對(duì)齊、親密性、緊密與留白都是制造視覺層次的好工具。大小往往與重要性結(jié)合起來，最大的元素大部分情況下都具有最大的重要性。顏色在組織和個(gè)性兩方面都起到作用，醒目、對(duì)比強(qiáng)烈的顏色在特殊的元素中會(huì)引起更大的關(guān)注（比如，按鈕、超鏈接或錯(cuò)誤信息）；在個(gè)性方面，豪華、舒適的顏色會(huì)給頁面帶來感情上的吸引力。對(duì)比能夠體現(xiàn)出相對(duì)的重要性。對(duì)齊能夠體現(xiàn)出元素們之間的組織關(guān)系。親密性是將關(guān)系緊密的內(nèi)容組織起來的最快方式。緊密與留白的和諧搭配，既能體現(xiàn)內(nèi)容之間的相互關(guān)系，又能避免緊密給用戶帶來的信息過量之感。

3導(dǎo)航設(shè)計(jì)

導(dǎo)航是網(wǎng)站內(nèi)用戶的指示路標(biāo)，可以說是網(wǎng)站最為重要的設(shè)計(jì)環(huán)節(jié)，它引導(dǎo)著用戶進(jìn)行瀏覽和查找信息，一個(gè)好的導(dǎo)航能夠讓用戶在離開網(wǎng)站時(shí)猶如享受了一次愉快的旅程。導(dǎo)航設(shè)計(jì)首先要將網(wǎng)站的信息進(jìn)行組織分類，一個(gè)精心組織分類的鏈接體系能夠采用簡(jiǎn)約的風(fēng)格，將信息梳理到最符合邏輯、最易于用戶理解的類目，讓用戶不經(jīng)遲疑、無需復(fù)雜操作就能訪問到他們想要的內(nèi)容。

3.1信息的組織與分類

信息的組織與分類是導(dǎo)航設(shè)計(jì)的基礎(chǔ)[13]，好的導(dǎo)航能夠?qū)⒎睆?fù)的頁面內(nèi)容組織起來，梳理出其中的邏輯，按照層級(jí)關(guān)系，建立起簡(jiǎn)潔易懂的欄目信息架構(gòu)?？ㄆ诸惙ㄊ且环N以用戶為導(dǎo)向的有效的組織信息的方法，可以設(shè)計(jì)出符合用戶心智模型的信息架構(gòu)?？ㄆ诸惙ǚ譃殚_放式和封閉式兩種[14]。開放式卡片分類法給被試人員足夠的自由度來進(jìn)行信息歸類，測(cè)試者不僅可能會(huì)得到豐富的分類結(jié)果，而且有力于發(fā)現(xiàn)欄目命名存在的問題，所以一般用于信息分類的前期，用于獲取用戶對(duì)圖書館服務(wù)及資源項(xiàng)目的理解情況。開放式卡片分類法由測(cè)試者將寫有圖書館的相關(guān)介紹、服務(wù)、資源等名稱的卡片完全打亂后分發(fā)給被試人員，被試人員可以完全自由地決定把卡片分成幾組，每組有多少張卡片，最后再由被試人員為分好組的卡片命名。在開放式卡片分類階段，能夠發(fā)現(xiàn)命名不合理的欄目，能夠獲得被試人員理想的分組命名。例如南方科技大學(xué)圖書館網(wǎng)站在開放式卡片分類調(diào)查過程中發(fā)現(xiàn)，“新館風(fēng)貌”頁的名稱存在問題，因?yàn)閷?duì)于館員而言，啟動(dòng)校區(qū)的圖書館為舊館，當(dāng)前使用的圖書館為新館。但是對(duì)于學(xué)生而言，他們并不知道啟動(dòng)校區(qū)圖書館，所以當(dāng)前使用的圖書館就稱不上新館，使用“館舍風(fēng)貌”命名則更為合適；關(guān)于欄目的分組命名也有收獲，舊版網(wǎng)站中使用“關(guān)于圖書館”欄目，而用戶會(huì)更喜歡給它命名為“關(guān)于本館”；“資源查找”用戶更喜歡給它命名為“資源導(dǎo)航”等。封閉式卡片分類法可在開放式卡片分類法之后使用，由測(cè)試者先確定出欄目分組的個(gè)數(shù)和名稱，再將屬于這些分組的卡片分發(fā)給被試人員，讓被試人員根據(jù)自己的期望，把卡片歸類在不同的分組名稱下。如果有些卡片被測(cè)人員不知道該將它分到哪個(gè)分組名稱下，可以將它拿出來，不一定要把所有卡片分完。封閉式的分類更利于掌控，可以用于對(duì)信息架構(gòu)設(shè)計(jì)結(jié)果的有效性進(jìn)行驗(yàn)證。

3.2導(dǎo)航功能模塊設(shè)計(jì)

虛擬的網(wǎng)絡(luò)世界不像現(xiàn)實(shí)世界中有明顯的方向感，若沒有清晰的導(dǎo)航和位置信息可能導(dǎo)致用戶迷失方向。成功的導(dǎo)航通過各種標(biāo)識(shí)和路徑的顯示，讓用戶在導(dǎo)航系統(tǒng)中清楚地認(rèn)識(shí)到網(wǎng)站信息結(jié)構(gòu)和自己瀏覽到的位置[15]。導(dǎo)航按照在網(wǎng)站中所處的區(qū)域與功能的不同分為：全局導(dǎo)航、局部導(dǎo)航、直接導(dǎo)航、面包屑導(dǎo)航、網(wǎng)站地圖等。全局導(dǎo)航，也就是通常所說的主導(dǎo)航，是網(wǎng)站的一級(jí)菜單，通常以橫條的形式設(shè)置在網(wǎng)站全局區(qū)域較為顯著的位置，提供覆蓋整個(gè)網(wǎng)站的通路，能夠展現(xiàn)網(wǎng)站的全貌。用戶通過全局導(dǎo)航可以隨時(shí)從網(wǎng)站的最底層頁面到達(dá)任何其它頁面，實(shí)現(xiàn)各個(gè)頁面之間的跳轉(zhuǎn)。局部導(dǎo)航，也稱為副導(dǎo)航，是全局導(dǎo)航的補(bǔ)充和延伸，專門針對(duì)網(wǎng)站二級(jí)以下的欄目，在幫助用戶瀏覽網(wǎng)站頁面時(shí)起輔助作用，主要用于有序?yàn)g覽目錄內(nèi)的具體內(nèi)容。直接導(dǎo)航，是在首頁中設(shè)置的直接將用戶引導(dǎo)到網(wǎng)站內(nèi)任意指定位置的導(dǎo)航，直接導(dǎo)航可以跨越多個(gè)層級(jí)而直接指向鏈接目標(biāo)，是為迎合用戶需求而設(shè)置的到達(dá)頁面的快捷途徑。面包屑導(dǎo)航，這個(gè)導(dǎo)航名稱來自于童話故事，面包屑是漢賽爾在進(jìn)入森林的路上偷偷灑下的，是一種“歷史記錄”的應(yīng)用方式。面包屑導(dǎo)航能夠呈現(xiàn)用戶當(dāng)前在網(wǎng)站中所處位置，記錄用戶的瀏覽路徑，表達(dá)當(dāng)前內(nèi)容的歸屬關(guān)系，可以幫助用戶方便地通過路徑返回到上一級(jí)頁面。網(wǎng)站地圖，將網(wǎng)站的所有頁面名稱按照結(jié)構(gòu)層次放置在一個(gè)頁面中，展現(xiàn)整個(gè)網(wǎng)站的信息架構(gòu)，通過鏈接的方式，幫助用戶在一個(gè)頁面中快捷、準(zhǔn)確地找到想要的頁面。網(wǎng)站的導(dǎo)航設(shè)計(jì)就是通過上述不同類型導(dǎo)航的合理設(shè)置與相互搭配，最終實(shí)現(xiàn)網(wǎng)站的便捷瀏覽、信息的有效獲取。

4結(jié)語

網(wǎng)站設(shè)計(jì)的重中之重不是界面設(shè)計(jì)的多么美觀，運(yùn)用的技術(shù)多么炫酷，而是網(wǎng)站的設(shè)計(jì)是否符合用戶體驗(yàn)，能否讓用戶輕松、快捷的完成操作。基于用戶體驗(yàn)的網(wǎng)站設(shè)計(jì)強(qiáng)調(diào)以用戶為中心，設(shè)計(jì)出符合用戶審美體驗(yàn)、認(rèn)知特點(diǎn)和使用習(xí)慣等與用戶心智模型相契合的系統(tǒng)，但用戶的審美、認(rèn)知特點(diǎn)、使用習(xí)慣以及心智模型都不是一成不變的，而且包含很多隱性的因素，需要經(jīng)過一系列細(xì)致的調(diào)查、測(cè)試、優(yōu)化等步驟，才能逐步提升用戶的體驗(yàn)。

參考文獻(xiàn)：

[1]李小青.基于普遍心理分層理論的Web用戶體驗(yàn)?zāi)Ｐ驮O(shè)計(jì)[J].情報(bào)資料工作,2010,(1):62-65.

[2]畢劍,劉曉艷,張禹.使用響應(yīng)式網(wǎng)頁設(shè)計(jì)構(gòu)建圖書館移動(dòng)門戶網(wǎng)站———以云南大學(xué)圖書館為例[J].現(xiàn)代圖書情報(bào)技術(shù),2015,255(2):97-101.

[3]張曉景.網(wǎng)站用戶體驗(yàn)全程揭秘[M].北京:清華大學(xué)出版社,2014.

[4]如何運(yùn)用視覺表現(xiàn)建立網(wǎng)頁的信息層級(jí)[EB/OL].[2015-03-19].

[6]SmashingMagazine.眾妙之門：用戶體驗(yàn)設(shè)計(jì)的秘密[M].邱胤炎,林本杰,譯.北京:人民郵電出版社,2014.

[7]吳鵬,張佩佩,甘利人.網(wǎng)站用戶信息獲取中的心智模型研究[J].情報(bào)學(xué)報(bào),2011,30(9):935-945.

[8]黃群,朱超.基于用戶心智模型的產(chǎn)品設(shè)計(jì)[J].包裝工程,2009,30(12):133-136.

[9]SusanWeinschenk.設(shè)計(jì)師要懂心理學(xué)[M].徐佳,馬迪,余盈億,譯.北京:人民郵電出版社.2014.

[10]林一,陳靖,劉越,王涌天.基于心智模型的虛擬現(xiàn)實(shí)與增強(qiáng)現(xiàn)實(shí)混合式移動(dòng)導(dǎo)覽系統(tǒng)的用戶體驗(yàn)設(shè)計(jì)[J].計(jì)算機(jī)學(xué)報(bào).2015,38(2):408-421.

[11]李海濤,宋琳琳.用戶使用網(wǎng)站的心智模型測(cè)量方法的選擇及應(yīng)用[J].情報(bào)理論與實(shí)踐,2015,38(2):11-16.

[12]孫麗,田才.基于用戶體驗(yàn)的網(wǎng)站信息構(gòu)建模型[J].情報(bào)科學(xué),2010,28(6):907-910.

[13]劉津,李月.破繭成蝶：用戶體驗(yàn)設(shè)計(jì)師的成長(zhǎng)之路[M].北京:人民郵電出版社,2014.