網頁設計：簡單即美

作者：佚名   時間：2015-04-22   分享到：

報紙的網絡版發布后，與網上讀者直接見面的就是網頁，大致可以說 ，它對應于紙介印刷版的版面。顯然，相對于傳統的版面，網絡版的網頁意味著新的特征和新的可能。這些隨因特網技術發展而不斷擴展的新可能無疑是令人興奮的，但其中也暗藏"陷阱"。確有不少網頁設計者情不自禁地在作品中過多地置入自賞或炫技的成份，導致網頁外觀或結構的缺陷，影響了瀏覽效果。

浙江日報網站籌建經歷數月，我有幸參與其中，組織實施網絡版網頁的構思與設計制作。這項富有挑戰性的工作，自然首先是一個學習的過程、創意的過程，但從前述意義來說，倒更是一個不斷抗御誘惑而趨向堅定和成熟的過程。

1999年元旦上網的浙江日報網絡版實際包含浙江日報等六報一刊，這是一個比較復雜的網絡版系列。但其網頁總體設計要求卻十分"簡單"：在符合各報刊印刷版根本定位與基本風格的前提下，實現高效的結構布局與清新的視覺效果。

我們曾大量瀏覽國內外報刊網絡版，發現相當多的網頁在設計中一味追求華麗的視覺印象。雖然可能某些地方也頗具特色，但這未必使得網頁外觀更加賞心悅目，也未必使得瀏覽過程更加便捷愉快，因此整體上就不能說是成功的。有鑒于此，又衡量了實際可用的設計時間與設計力量，我們考慮：浙江日報網絡版的網頁不妨一反通常設計者對于精美別致的追求，只求高效與清新，這樣仍有可能在眾多國內報刊網絡版中獨樹一幟，躋身一流行列。

這個要求如何實現？隨著設計的展開，逐漸明確了兩個字-簡單。網頁中除內容以外的對象都力求簡單，這最終成了浙江日報網絡版網頁設計的原則之一。

一、 簡單的層次結構

網頁是一種超文本。超文本的本質就是無限的鏈接與跳轉。在網頁中點擊預置的鏈接，輕松地就可以跳轉到另一個網站或另一個網頁。這個特征對于網絡版的網頁結構有著決定意義。

信息必須按照便于瀏覽與查找的方式進行結構化的組織，這是一切成功的信息系統的起碼要求。報紙印刷版中運用種種手段進行版面分割、設置"引導點"，為專輯、專版、專欄等規定某種固定的版次關系，類似的這些做法，都是在為信息的結構化作努力。由于網頁的超文本特性，一者，網頁尺寸過大的問題可以避免，二者，網頁獲得良好結構化的希望有了邏輯上的堅實基礎，設計高效實用的導航（導覽）系統也有了物理的基礎。

從整體上構思網絡版的結構，首先必須考慮一定程度上的分層。最頂層的導航頁就是分層的起點，從這里讀者瀏覽全部內容的概況，以便迅速確定下一步的跳轉方向。雖然分層是明晰與簡化結構的好方法，但也必須節制，不可過細、過深。如果從起始頁出發需要點擊（連接）超過三次或四次才看到想要的內容，這對讀者的耐心多少會是一個考驗。

有的報刊印刷版在概念上有較多的層次，如錢江晚報，在日常版面之外另有七個周刊，分別安排在周一至周日，每個周刊各含幾個專版，專版下又含專欄（多數欄目實際一次只含一篇文章）。如果直接照搬上述層次關系，按"起始頁總目（含周刊目錄）->專版目錄->專欄目錄->圖文目錄->圖文"這樣的層次結構，計數箭頭就知道，從頂層頁面到底層內容頁面需要點擊（連接）四次。我們在實際構思中，網頁結構按縮減的"起始頁總目（含周刊目錄）->專版目錄及圖文目錄->圖文"的層次。在第二層的頁面上，右邊是本期周刊全部圖文的目錄（鏈接），它們按專版分區排列，左側是本期周刊的專版目錄（鏈接），各鏈接即指向本頁右邊的各專版圖文目錄區，進入本頁后，既可點擊左側鏈接通過頁內跳轉到達某個專版的圖文目錄區，也可通過滾屏找到該專版的圖文目錄區，隨后找到新聞標題。在這個簡化的層次結構中，從頂層起點擊兩次或三次就可以連接到新聞（重要新聞通過起始頁的導讀區可以一次點擊連到）。

二、 簡單的平面布局

報紙的幅面是相當大的，這就可能把大量的新聞集中于一張紙上。如對開的浙江日報一個版可以放置六七篇千字文章另加兩三張普通大小的圖片，即便是小報的版面，可容納的圖文也不會少于大報版面的一半。讀者往往習慣于統覽整個版面，以便迅速從中選定進一步閱讀的圖文。

網頁在信息密集度上顯然遠遜于報紙，因為讀者瀏覽網頁必須通過尺寸與分辨率都小于報紙的顯示器。即使是在"大屏幕、高分辨率"的條件下，一屏可能含有的圖文量仍是遠小于報紙的版面（通常也不能多于兩篇千字文章）。如果把頁面設計成版面那樣的尺寸，要完整地瀏覽一個頁面就須不斷地縱橫滾屏。原則上，網頁是不應橫向滾屏的，縱向滾屏也是越少越好。所以，網頁的尺寸（特別是寬度）必須加以控制，否則無法適應屏幕的尺寸，也無法使讀者接受。

這個重要不同，決定了報紙網絡版無法再以傳統的版面形式來排布圖文。基于版面分割概念的常規版面設計手段，要么不再有效要么不再作用突出，即便是平面視覺設計中一些共同的基本藝術守則，在這兩種設計中也體現為不同的要求。總的來說，相對于印刷版，網絡版的視覺設計是在狹小幅面上的設計，因此就平面布局而言，一屏網頁中的內容過于擁塞容易引起讀者的視覺疲勞，也不便于讀者搜尋內容。

大容量網站的起始網頁較多采用左中右三列的布局方式。但三列式的布局不完全適于中文新聞網站。

我們在構思中為了避免上述弊病，基本采用簡單的左右兩列的布局方式，各部分內容的拼合也有意作寬松的安排。如浙江日報網絡版的起始頁，頂部是對應于浙江日報各版內容的鏈接，底部是工具欄（包括一些有關報紙或網站的鏈接），左邊是浙江日報社六報一刊網絡版的鏈接和友好網站的鏈接，右邊是圖片新聞和今日導讀（包括推薦新聞的標題、提要與鏈接）。這個導航界面相對簡單，但功能比較完整，并且風格洗練、條理清晰，可以較好地發揮瀏覽效率。

三、簡單的圖形、特效

報紙經過一次性印刷，送達讀者手中已是完全的成品。而讀者在線瀏覽網絡版，每一個頁面都須有一個即時的數據下載過程。這里就有網絡的數據傳輸速率問題，即帶寬問題。而帶寬過窄正是目前國內網民最難忍受的問題之一。

去年11月，浙江日報網絡版處于正式發布前的測試階段。當時，為參加省政府主辦的"信息化在浙江"展覽，曾經運用FLASH技術為網絡版制作了一個具有封面性質的網頁。它融合了動態圖形與配樂音響，具有極強的視聽沖擊力，在展覽會上受到人們的好評，連慣弄視覺與動態的電視記者也為之贊嘆。但這種網頁傳送時要求較高的帶寬，否則讀者將難以忍受長時間的下載過程。也就是說，引人入勝的網頁特效與一般讀者對瀏覽效率的要求發生了矛盾。我們最后的選擇是，簡化效果以保證效率，在網絡版正式推出時毅然舍棄了這個FLASH網頁。

這是一個抗御誘惑、自我克制的例子。實際上，媒體很容易在形式上自我放任，自發地追求一些自我欣賞、并不實用的東西。在網絡出版中這個問題特別突出，因為網絡出版顯然是所有媒體中出版費用最低廉的，它不像其他媒體那樣因為出版費用較高而受到相當的抑制。

對于新聞網頁來說，能迅速提供新聞并保證讀者方便地在網頁上找到想要的新聞，這才是最重要的，而花哨的效果或所謂觀賞性不應是它過多考慮的。但另一方面，從版面設計到頁面設計的轉變，實際是夾帶著遺憾的，設計者將感受到某些自己曾經熱衷的藝術意味的喪失，作為補償，他可能愿意多多運用傳統報紙設計中無法運用或限于制作費用不能經常運用的手段，大量圖形、復雜背景、彩色圖像、各種特效，可能都會成為他的新追求。

這些追求有時明顯會進一步惡化讀者的帶寬困境，有時雖不至于如此，但也可能并不能取得預期的美化效果。因此，面對眾多選擇，網頁設計者的自我克制總是必須的。

比如，頁面背景顏色（或圖像、圖形）的挑選就應該比較克制。使用過于鮮艷的顏色或過于復雜的圖像、圖形作為背景，不利于清晰地顯示文本或鏈接。事實上，我們已經見過太多色彩斑斕而難以清晰瀏覽的網頁。另外，根據中國的文化傳統，色彩運用上的禁忌實際是比較多的，要為報紙（尤其是黨報）找到既符合本身定位又適應人們審美習慣還要顯得與眾不同的背景色相當困難，這種情況下，謹慎的選擇反而易于成功。我們在設計浙江日報網絡版時，就此進行了一些嘗試，比較后發現，其實，簡單地運用白色就可以使頁面顯得莊重得體。

當然，簡單不應淪為簡陋。因此，又考慮在純凈的背景上綴以紅色（報名）、藍色（鏈接），在廣告位加以一定量的其他彩色，這就使得頁面并不因為純白背景的素潔而單調呆滯。除此，在處理起始頁上浙江日報社各報刊網絡版的鏈接時，設計師在每個報刊名前放置了一個小色塊，這些不同的顏色塊既象征著浙報的六報一刊各具個性，也使整個頁面顯得更生動、更親切。

設計和傳送網頁所憑借的網絡軟硬環境總在不斷發展變化，因此網頁設計是一個不斷創新、不斷完善的過程。相信浙江日報網絡版在博采眾長、汲取海內外讀者各種意見、建議后，將以更為令人賞心悅目的界面面對世人。