專業(yè)文學(xué)網(wǎng)站設(shè)計(jì)原則與趨勢(shì)

前言：想要寫出一篇引人入勝的文章？我們特意為您整理了專業(yè)文學(xué)網(wǎng)站設(shè)計(jì)原則與趨勢(shì)范文，希望能給你帶來(lái)靈感和參考，敬請(qǐng)閱讀。

摘要:

現(xiàn)在互聯(lián)網(wǎng)用戶對(duì)網(wǎng)頁(yè)設(shè)計(jì)的質(zhì)量要求越來(lái)越高，沒有內(nèi)涵的華麗設(shè)計(jì)很快就會(huì)被遺棄。所以現(xiàn)今的設(shè)計(jì)趨勢(shì)已經(jīng)越來(lái)越重視網(wǎng)站的響應(yīng)設(shè)計(jì)、持續(xù)聯(lián)系以及虛擬現(xiàn)實(shí)。在一個(gè)注重用戶體驗(yàn)的時(shí)代，一個(gè)好的文學(xué)網(wǎng)站，不是只有華麗的界面或者良好的交互設(shè)計(jì)就可以，而是要在藝術(shù)和功能上做到兩全其美。

關(guān)鍵詞:網(wǎng)頁(yè)設(shè)計(jì);色彩;圖片優(yōu)化;用戶體驗(yàn)

現(xiàn)代設(shè)計(jì)在中國(guó)的發(fā)展大概有二十多年的時(shí)間了，以前中國(guó)很少有人會(huì)注意網(wǎng)頁(yè)界面的用戶體驗(yàn)，而且國(guó)內(nèi)寬帶水平有限，所以那時(shí)候我國(guó)的網(wǎng)頁(yè)界面基本上都是框架式，創(chuàng)新的頁(yè)面很少。隨著我國(guó)各方面的發(fā)展，我們的設(shè)計(jì)也越來(lái)越有創(chuàng)新意識(shí)，我們也越來(lái)越注重用戶的體驗(yàn)。尤其是在文學(xué)網(wǎng)站設(shè)計(jì)方面，以前很多網(wǎng)站的設(shè)計(jì)大部分都是大的框架加上鏈接構(gòu)成，沒有下多少功夫在外觀設(shè)計(jì)和用戶體驗(yàn)方面，而現(xiàn)在隨著文學(xué)網(wǎng)的發(fā)展，僅僅是靠老一套的理論來(lái)做的設(shè)計(jì)已經(jīng)不能滿足現(xiàn)在用戶的審美需求了。

1文學(xué)類網(wǎng)站設(shè)計(jì)原則

1．1色彩設(shè)計(jì)原則

眾所周知，不管是做招貼、包裝或者是VI，給人的第一印象往往是這個(gè)作品的色彩設(shè)計(jì)，它的色彩運(yùn)用的好與壞，將直接影響到閱讀者的興趣。同樣，在網(wǎng)頁(yè)設(shè)計(jì)中，色彩也是居于十分重要的地位?，F(xiàn)在的文學(xué)類網(wǎng)站的網(wǎng)頁(yè)設(shè)計(jì)，大部分以比較淺的顏色為網(wǎng)頁(yè)的背景色，如淺黃色、淺藍(lán)色、淺綠色或者直接就是白色背景，再加上較深顏色的文字來(lái)做的配色。一般來(lái)說(shuō)網(wǎng)頁(yè)中所出現(xiàn)的字體顏色都是黑色，因?yàn)闇\色背景中黑色字體的視認(rèn)度最高，但是這種強(qiáng)對(duì)比，屏幕刺激較大，也更容易讓瀏覽者產(chǎn)生視覺疲勞。在文學(xué)類網(wǎng)頁(yè)設(shè)計(jì)中，這種對(duì)比過(guò)于強(qiáng)烈的配色會(huì)使用戶長(zhǎng)時(shí)間在線瀏覽的時(shí)候有不適，但是緩和的色彩搭配視認(rèn)度不高，也不利于用戶閱讀。所以筆者認(rèn)為在網(wǎng)頁(yè)中出現(xiàn)大面積文字以及考慮到用戶會(huì)長(zhǎng)時(shí)間停留在一個(gè)頁(yè)面的時(shí)候，比如文學(xué)網(wǎng)站的在線閱讀界面，我們可以給用戶一個(gè)選擇，讓用戶自己來(lái)挑選網(wǎng)頁(yè)的背景色以及字體顏色，讓用戶自己來(lái)選擇適合自己的顏色搭配。

1．2文字和排版設(shè)計(jì)原則

在做網(wǎng)頁(yè)設(shè)計(jì)的過(guò)程中，無(wú)論選擇什么字體，都要基于網(wǎng)頁(yè)的總體設(shè)想和瀏覽者的需要來(lái)使用。而且瀏覽器使用的是本地字庫(kù)顯示的頁(yè)面內(nèi)容，作為一個(gè)網(wǎng)頁(yè)設(shè)計(jì)者，不得不考慮到用戶電腦中是否有你選用的字體，所以說(shuō)網(wǎng)頁(yè)中的文字最好使用缺省字體，在必須使用特殊字體的地方，可以先把文字做成圖像，然后再插入到網(wǎng)頁(yè)頁(yè)面中去。再者就是文字行距的問(wèn)題，一般的行距比例為10:12，因?yàn)楹线m的行距可以很好引導(dǎo)瀏覽者的視線，如果行距過(guò)寬會(huì)影響行與行之間的文字延續(xù)性，影響閱讀。而且在視覺傳達(dá)中文字作為網(wǎng)頁(yè)頁(yè)面的要素之一，除了表達(dá)文字本身的意義以外，還有傳達(dá)感情的作用，所以文字設(shè)計(jì)在視覺上要給人以美好的印象，讓瀏覽者可以獲得良好的閱讀感受。而且網(wǎng)頁(yè)設(shè)計(jì)作為一種視覺語(yǔ)言，特別講究編排和布局，雖然主頁(yè)的設(shè)計(jì)不等同于平面設(shè)計(jì)，但它們有許多相近之處，都是通過(guò)文字圖形的空間組合，表達(dá)出和諧與美。在網(wǎng)頁(yè)文字設(shè)計(jì)編排中最重要的一點(diǎn)，就是要與網(wǎng)頁(yè)內(nèi)容的性質(zhì)和特點(diǎn)相和諧，其設(shè)計(jì)風(fēng)格要與內(nèi)容特性相一致，而不是相分離沖突，所以在我們把大量的信息整合到一個(gè)頁(yè)面上去的時(shí)候，首先要考慮的是怎樣把它們以合理統(tǒng)一的排布，達(dá)到變化與統(tǒng)一并存的和諧效果。在排版這方面，網(wǎng)頁(yè)的版式設(shè)計(jì)同報(bào)刊雜志的版式設(shè)計(jì)有不少共同之處，基本上都是把頁(yè)面中的文字字體、圖形圖像、色塊線條等要素按照一定的節(jié)奏進(jìn)行編排，同時(shí)注意其結(jié)構(gòu)的大小、輕重、虛實(shí)等對(duì)比因素，并通過(guò)對(duì)這些要素的編排，使瀏覽者直觀地感受到該頁(yè)面要傳遞的信息。

1．3網(wǎng)頁(yè)圖形的優(yōu)化和應(yīng)用原則

對(duì)于一個(gè)網(wǎng)站來(lái)說(shuō)，網(wǎng)頁(yè)的下載速度是非常重要的，但是影響網(wǎng)頁(yè)的下載速度的因素除了網(wǎng)速以外，網(wǎng)頁(yè)中所包含的圖像圖形對(duì)網(wǎng)頁(yè)的下載速度也有很大的影響。因此，對(duì)網(wǎng)頁(yè)圖形進(jìn)行優(yōu)化，使網(wǎng)頁(yè)能夠快速下載是網(wǎng)站設(shè)計(jì)制作中考慮的首要問(wèn)題。所以，接下來(lái)就來(lái)探討一下圖片優(yōu)化的基本方法。首先是圖片的裁切，裁切時(shí)應(yīng)盡量沿所需圖像邊緣裁切，避免不必要區(qū)域占用文件大小。如果在頁(yè)面中有一張過(guò)大的圖片，也可以先把它裁成小塊，然后再使用Table語(yǔ)法所提供的Border=0、Cell-spacing=0、Cellpadding=0的無(wú)縫功能，將它們組合起來(lái)，這樣也會(huì)提高圖片的加載速度。再者就是圖片的輸出，一般情況下，色彩少的圖片使用GIF或者PNG格式，色彩豐富的的圖片使用JPG格式。如果是一些攝影網(wǎng)站，圖片要求都是高清圖片，那就可以用JPG格式做小圖預(yù)覽，然后鏈接到TIF格式(無(wú)損)的原圖，這對(duì)沒興趣看這張大圖片的瀏覽者而言，不但可快速下載該網(wǎng)頁(yè)，而且也是一種體貼的選擇。還有些圖片，因?yàn)橐诓煌谋尘爸惺褂茫枰敵鰹橥该鞯男Ч?，這時(shí)，就可以選用GIF格式，因?yàn)閷?duì)于GIF圖像來(lái)說(shuō)，色彩越少，文件就越小。所以說(shuō)在看起來(lái)可以接受的范圍內(nèi)，盡可能地將色彩數(shù)量減少，就能夠?qū)IF圖像進(jìn)行不錯(cuò)的優(yōu)化。而且對(duì)于網(wǎng)頁(yè)中所采用的圖檔，通常會(huì)加入Width、Height這兩個(gè)屬性，這樣就可以在加載網(wǎng)頁(yè)的過(guò)程中為圖像預(yù)留空間，在加載圖片時(shí)，用戶就可以先瀏覽其他已加載項(xiàng)目。如果沒有這些屬性，瀏覽器就不能了解圖像的大小，也就不能為圖像預(yù)留下合適的空間，這可能會(huì)給網(wǎng)頁(yè)中其他元素的顯示帶來(lái)很大的延遲，從而影響用戶的閱讀。

2現(xiàn)今專業(yè)文學(xué)網(wǎng)站設(shè)計(jì)趨勢(shì)

以前，做網(wǎng)頁(yè)設(shè)計(jì)基本上都是用PS設(shè)計(jì)網(wǎng)頁(yè)版面，僅僅是PS就可以滿足用戶的需求，但是現(xiàn)在互聯(lián)網(wǎng)用戶對(duì)網(wǎng)頁(yè)設(shè)計(jì)的質(zhì)量要求越來(lái)越高，沒有內(nèi)涵華麗的設(shè)計(jì)很快就會(huì)被遺棄。所以現(xiàn)今的設(shè)計(jì)趨勢(shì)已經(jīng)越來(lái)越重視網(wǎng)站的響應(yīng)設(shè)計(jì)、持續(xù)聯(lián)系以及虛擬現(xiàn)實(shí)。另外在版式設(shè)計(jì)方面也逐漸加入了一些“留白”的理念，“留白”發(fā)源于中國(guó)傳統(tǒng)的虛實(shí)相生、陰陽(yáng)辯證的哲學(xué)思想，發(fā)展于傳統(tǒng)的繪畫行業(yè)，表達(dá)一種“以無(wú)勝有，以簡(jiǎn)勝繁”的思想，這種設(shè)計(jì)理念與西方20世紀(jì)興起的一些現(xiàn)代設(shè)計(jì)理念如出一轍?！傲舭住辈皇且粋€(gè)色彩的概念，而是一種形式的概念，通過(guò)欣賞者的審美聯(lián)想和想象獲得的一種“秒與生意，能不失真”的意想空間，從而使設(shè)計(jì)者能夠更好地表達(dá)出設(shè)計(jì)的意圖，將作品的視覺感染力加強(qiáng)?？傊?，一個(gè)好的文學(xué)網(wǎng)站的網(wǎng)頁(yè)設(shè)計(jì)，不是只要有華麗的界面就可以，而是要在藝術(shù)和功能上做到兩全其美。

2．1大背景圖的網(wǎng)頁(yè)設(shè)計(jì)

高清圖片是一種可以產(chǎn)生極具視覺沖擊力并迅速抓住讀者視線的好方式，而且這些圖片一般都是高質(zhì)量寫實(shí)的或者是抽象的精美照片，這些圖片的用色和表現(xiàn)的內(nèi)容都十分考究，并且趨向于一些比較柔和，比較透明的圖片，不會(huì)影響到文字的閱讀。不然再漂亮的圖片，看起來(lái)和網(wǎng)站整體效果不協(xié)調(diào)，影響用戶體驗(yàn)，也是白白浪費(fèi)資源。除此之外，大背景圖的運(yùn)用還有一種方式，叫做擬真設(shè)計(jì)，聽起來(lái)可能有點(diǎn)陌生，但是擬真設(shè)計(jì)就是和大背景圖的運(yùn)用相似的一種設(shè)計(jì)，它是指將界面元素設(shè)計(jì)成用戶容易理解的，存在于現(xiàn)實(shí)世界中的實(shí)體。就文學(xué)網(wǎng)站，在書籍閱讀的界面平臺(tái)上，不單單是書籍內(nèi)容完整無(wú)誤的呈現(xiàn)，它的呈現(xiàn)方式可以像常見的平面媒體帶給讀者的愉悅體驗(yàn)一樣?？梢栽跁喿x的起始部分與結(jié)束部分分別放置圖書原有的封面與封底;可以模仿紙張的材質(zhì)，靈活設(shè)置;可以在文章的正文界面中配合插圖，插圖同文字共同營(yíng)造書中的獨(dú)特氛圍，插圖的類型可以配合文章的敘述情境進(jìn)行繪制;可以與插畫師合作，共同創(chuàng)造出良好的閱讀環(huán)境，從而提高閱讀質(zhì)量和閱讀效益。

2．2移動(dòng)互聯(lián)網(wǎng)時(shí)代

現(xiàn)在這個(gè)時(shí)代，智能手機(jī)幾乎是人手一部，而且平板電腦、小型上網(wǎng)本隨處可見。所以說(shuō)，如今的網(wǎng)頁(yè)設(shè)計(jì)已經(jīng)不能只局限在普通電腦的顯示效果上，還要考慮到更多的移動(dòng)設(shè)備。但是，設(shè)計(jì)適合移動(dòng)設(shè)備的網(wǎng)站不是去掉大量裝飾，做得簡(jiǎn)單易于下載就可以，因?yàn)樗粌H僅是變得簡(jiǎn)單，更是要表現(xiàn)出原網(wǎng)站的精華。另外，現(xiàn)在很多網(wǎng)站都推出了屬于自己的方形的條形碼，這種條形碼被稱為QR，全稱就是QuickResponse。這個(gè)條形碼就相當(dāng)于一個(gè)快捷方式，讓用戶可以方便迅速地打開自己的移動(dòng)網(wǎng)頁(yè)。近幾年來(lái)，移動(dòng)媒體的優(yōu)勢(shì)越來(lái)越明顯，利用這個(gè)優(yōu)勢(shì)所做的網(wǎng)頁(yè)設(shè)計(jì)也是現(xiàn)在的熱門。

2．3頁(yè)面布局設(shè)計(jì)及特效設(shè)計(jì)

以前的網(wǎng)頁(yè)設(shè)計(jì)，大部分都類似于書籍和雜志的版面設(shè)計(jì)。而隨著互聯(lián)網(wǎng)等各方面的發(fā)展，現(xiàn)在的設(shè)計(jì)更接近于影片的效果，更注重空間藝術(shù)，現(xiàn)在的網(wǎng)頁(yè)設(shè)計(jì)已經(jīng)不再是單純的平面設(shè)計(jì)，而是立體設(shè)計(jì)、空間設(shè)計(jì)，致力于把瀏覽者帶進(jìn)一個(gè)現(xiàn)實(shí)的虛擬世界。我們都知道構(gòu)成網(wǎng)站的是網(wǎng)頁(yè)，網(wǎng)頁(yè)本身也是很多個(gè)頁(yè)面的總平面，所以說(shuō)平面設(shè)計(jì)原則同樣也適用于網(wǎng)頁(yè)設(shè)計(jì)。但是網(wǎng)頁(yè)設(shè)計(jì)的排版又是對(duì)平面設(shè)計(jì)的延伸，單獨(dú)考慮平面設(shè)計(jì)原則的話，這樣的網(wǎng)頁(yè)設(shè)計(jì)是不能滿足現(xiàn)在瀏覽者的需求的。在網(wǎng)頁(yè)特效方面，文學(xué)類網(wǎng)站運(yùn)用的不是很多?，F(xiàn)在是一個(gè)注重用戶體驗(yàn)的時(shí)代，適當(dāng)?shù)夭捎靡恍┚W(wǎng)頁(yè)特效會(huì)給網(wǎng)站加分不少。比如說(shuō)，視差滾動(dòng)設(shè)計(jì)，讓多層背景以不同的速度移動(dòng)，形成一種類似于3D的視覺效果，吸引瀏覽者。但是值得注意的是，這種效果不適于導(dǎo)航。

2．4極簡(jiǎn)主義的運(yùn)用

極簡(jiǎn)主義在早幾年就流行起來(lái)了，但是在網(wǎng)頁(yè)設(shè)計(jì)方面極簡(jiǎn)主義的影響力在近幾年才逐漸大了起來(lái)。極簡(jiǎn)主義風(fēng)格的網(wǎng)站設(shè)計(jì)，運(yùn)行速度快，用戶體驗(yàn)效果更好，接入也更加容易，所以無(wú)論哪一類型的網(wǎng)頁(yè)設(shè)計(jì)都可以運(yùn)用，文學(xué)類網(wǎng)站也不例外。但是就目前來(lái)說(shuō)，還沒有哪個(gè)國(guó)內(nèi)文學(xué)網(wǎng)站嘗試這種極簡(jiǎn)主義設(shè)計(jì)，因?yàn)榻酉聛?lái)提到的文學(xué)類網(wǎng)站設(shè)計(jì)的一大要點(diǎn)，就是豐富的內(nèi)容。但是，極簡(jiǎn)主義并不是把內(nèi)容也變得極簡(jiǎn)。要知道極簡(jiǎn)主義有一個(gè)理念，少就是多，簡(jiǎn)潔就是豐富。所以說(shuō)極簡(jiǎn)主義只是把不必要的東西去掉，使頁(yè)面的每一個(gè)元素都和主題統(tǒng)一，用最簡(jiǎn)單的元素來(lái)傳達(dá)更豐富的信息。

2．5豐富的內(nèi)容

內(nèi)容是一個(gè)網(wǎng)站的最有價(jià)值的部分，而對(duì)于文學(xué)網(wǎng)站來(lái)說(shuō)，豐富的有價(jià)值的內(nèi)容比起網(wǎng)站外觀來(lái)要重要得多。但是做內(nèi)容的建設(shè)時(shí)也要注意幾點(diǎn)，首先，網(wǎng)站的內(nèi)容要和網(wǎng)站的主題一致，不可偏離主題。其次，就是網(wǎng)站內(nèi)容最好是原創(chuàng)內(nèi)容。作為一個(gè)文學(xué)網(wǎng)站，不是說(shuō)拿那些已經(jīng)現(xiàn)有的作品就可以，還要有新的原創(chuàng)文學(xué)，大家沒有看過(guò)的文學(xué)作品，這樣才能讓用戶時(shí)刻保持對(duì)網(wǎng)站的新鮮感。最后，網(wǎng)站的內(nèi)容要定時(shí)更新，并不是說(shuō)有豐富的文學(xué)作品就萬(wàn)事大吉了，不然一個(gè)再好的網(wǎng)站不去更新內(nèi)容，它也是一個(gè)死站。而且一般經(jīng)常瀏覽文學(xué)網(wǎng)站的互聯(lián)網(wǎng)用戶對(duì)文學(xué)都是很有見解的，所以說(shuō)作為一個(gè)專業(yè)的文學(xué)網(wǎng)站，為他們提供的不僅僅是一個(gè)文學(xué)資源庫(kù)，更應(yīng)是一個(gè)交流平臺(tái)，讓他們發(fā)表自己的原創(chuàng)文學(xué)及見解。

3文學(xué)網(wǎng)站中多媒體技術(shù)的運(yùn)用

無(wú)論是圖形文字，還是聲音視頻，設(shè)計(jì)者所要考慮的就是怎樣才能使它們以最和諧的方式融合到網(wǎng)頁(yè)這面大屏幕里。所以，多媒體技術(shù)的運(yùn)用在這里必不可少?，F(xiàn)在大部分的瀏覽器本身都可以支持在線播放或收聽，比如GIF、JPEG圖形和GIF89a動(dòng)畫。另外還有一些比較常見的插件，比如ActiveX，它可以播放更多種類的多媒體文件?？傊?，多媒體技術(shù)隨著互聯(lián)網(wǎng)的發(fā)展在網(wǎng)頁(yè)設(shè)計(jì)中的運(yùn)用也越來(lái)越多，也使瀏覽者能夠體驗(yàn)到更加完美的瀏覽效果。在現(xiàn)今有很多網(wǎng)站設(shè)計(jì)都采用了flash軟件來(lái)制作，用flash制作導(dǎo)航界面，隨著鼠標(biāo)的動(dòng)作可以產(chǎn)生動(dòng)畫或者聲音，讓網(wǎng)頁(yè)更有吸引力。而且制作flash時(shí)用的是矢量圖形，它需要的內(nèi)存和存儲(chǔ)空間要比位圖小很多。在網(wǎng)頁(yè)設(shè)計(jì)中flash還具有一定的交互性，比如說(shuō)網(wǎng)站導(dǎo)航欄動(dòng)畫、圖片展示動(dòng)畫以及網(wǎng)站注冊(cè)和登陸系統(tǒng)等等。在靜態(tài)頁(yè)面中，如果用到這些動(dòng)畫，一定能與瀏覽者有一個(gè)很好的互動(dòng)，也能使網(wǎng)站看起來(lái)更加生動(dòng)有趣。但是整體不可以太花哨，太雜亂，不然會(huì)使瀏覽者對(duì)該網(wǎng)頁(yè)缺乏信任感。當(dāng)然也有一些網(wǎng)站，為了表現(xiàn)自己的與眾不同，使用flash來(lái)制作整個(gè)網(wǎng)站。而且設(shè)計(jì)制作flash時(shí)就已經(jīng)包括網(wǎng)頁(yè)內(nèi)所有視聽元素和版式的設(shè)計(jì)，并不會(huì)給人眼花繚亂的感覺。這樣的flash網(wǎng)站，給人感覺都十分酷，給瀏覽者一種很特別的感覺，基本上可以完全調(diào)動(dòng)瀏覽者瀏覽的積極性，同時(shí)給瀏覽者一種活躍的心理感受。總之，不只是文學(xué)網(wǎng)站的設(shè)計(jì)，所有的的網(wǎng)頁(yè)藝術(shù)設(shè)計(jì)都需要大膽創(chuàng)新，需要不斷地完善和突破，從而達(dá)到網(wǎng)絡(luò)技術(shù)與藝術(shù)設(shè)計(jì)的完美結(jié)合，讓瀏覽者獲得最佳的閱讀體驗(yàn)。

參考文獻(xiàn):

［1］王曉峰，焦燕．網(wǎng)頁(yè)美術(shù)設(shè)計(jì)原理及實(shí)戰(zhàn)策略［M］．北京:清華大學(xué)出版社，2009:8．

［2］張新偉．網(wǎng)頁(yè)經(jīng)典配色藝術(shù)［M］．北京:電子工業(yè)出版社，2009:6．

［3］鄭國(guó)強(qiáng)．網(wǎng)頁(yè)設(shè)計(jì)與配色實(shí)例解析［M］．北京:清華大學(xué)出版社，2012:6．

［4］張磊．專業(yè)色彩搭配手冊(cè):網(wǎng)頁(yè)配色［M］．北京:北京希望電子出版社，2011:11．

［5］劉鵬．淺談網(wǎng)頁(yè)色彩的編排設(shè)計(jì)［J］．科技創(chuàng)新與應(yīng)用，2012，(1)．

［6］李立偉．淺談網(wǎng)頁(yè)色彩設(shè)計(jì)［J］．鄭州輕工業(yè)學(xué)院學(xué)報(bào)，2007，(2)．

［7］衛(wèi)捷．“留白”理念在現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)中的映射［D］．河南大學(xué)碩士學(xué)位論文，2011．

作者：曹晏禎 單位：鄭州工業(yè)應(yīng)用技術(shù)學(xué)院