如何設計好網站的頁面

　　一、垃圾還是經典

　　網頁技術更新很快，一個網站的介面設計壽命僅僅2-3年而已。不管是垃圾還是精品，都沒有所謂的經典。經典只存在於是哪個首次成功創新性的應用。網頁設計者不管自己的學識、技術和經驗如何，都自以為自己吊的不得了，這可能是源與商業設計自我意識體現的強烈主觀因素。一個閉門造車者做出的東西，是遠遠趕不上綜合借鑑者的。網頁設計不同於其他藝術，在模仿加創新的網頁設計領域當中，即便是完全自己設計的，也是沿用了人們已經認同的大部分使用者習慣，而且這種沿襲的痕跡時非常的明顯！還有那個設計者敢腆著臉說，這都是我自己的原創設計？對於業界來說，經典只是個理念和象徵！

　　二、國內網頁設計環境

　　不可否認，國內網頁設計環境目前還停留在初級的認知階段，也就是說，絕大多數人不知道網路的真正的可用之處，你去做一個業務的時候，不得不去做大量的說服教育工作。以乙方的身份去說服甲方，以專業角度去教育非專業認識，結果是可想而知的。也正是這種全體社會普遍的低認知水平，導致了大量網路垃圾的產生。

　　舉個簡單的例子，看看“阿里巴巴”中文和英文兩個版本的頁面。中文版主色是橙色（與標誌色統一），英文版是極不協調的藍橙（具有很明顯的生湊效果）。

　　為啥中文版是橙色，呵呵，不要以為哪是為了和標誌統一，其實那時國內最常用的商業色。橙色代表什麼？肉色，淫慾。商業是性質？貪婪、拜金。對於社會主義初級階段群眾的普遍思想來說，橙色就是最突出的體現，它不僅僅是網頁首選商業色，它還體現了當今社會經濟發展條件下的“浮躁”和“糜爛”，它還說明了“低認知水平”的國人，需要用這個刺激的顏色，去宣教引領他們被動接受。

　　為啥英文版是藍橙？因為洋人已處於發達社會，他們首先需要的不是“宣教引領”，而是“功能”。一個弱化的介面更能強化顯示功能，使人方便使用。較刺激熱烈的顏色，會引起洋人的反感，所以用的淺藍灰色。那麼為什麼又會出現極不協調的橙色捏？原因有二，一是要與標誌顏色統一，二是中英文要有傳承，所以出了這末個一半是火焰一半世海水的結果。

　　明白了嗎？社會主義初級階段界定了各行業都在一個初級階段，這個初級階段歸根結底是由“經濟發達水平”決定的。同樣，決定網頁設計的也是“經濟發達水平”，而不是個人的設計水平和思想理念。

　　三、什麼是好的網頁設計

　　（1）內容和功能決定表現形式和介面設計

　　常常拿到的任務是一張小紙條，上面兩句話，叫你去做一個網站設計。有的人看看紙條就去設計頁面了憑，憑兩句話，你就可以為客戶做一個頁面設計，以我7、8年的設計經驗，我都不敢去做，你真是我的偶像阿！

　　做網頁設計，你需要了解客戶的東西很多：

　　1、建站目的

　　2、欄目規劃及每個欄目的表現形式及功能要求

　　3、主色、客戶性別喜好、聯絡方式、舊版網址、偏好網址

　　4、根據行業和客戶要求，那些要著重表現

　　5、是否分期建設、考慮後期的相容性

　　6、客戶是否有強烈的建站慾望

　　7、你是否能在精神意識上控制住客戶

　　8、面對你未接觸的技術知識，你有底嗎？

　　等等...

　　當你把這些內容都瞭解清除了時候，你的大腦中就已經給這個網站有個全面而形象的定位了，這時才是有的放矢去做介面設計的時候了。

　　（2）介面弱化

　　一個好的介面設計它的介面時弱化的，它突出的是功能，著重體現的是網站業提供給使用者是主要什麼。這就涉及到瀏覽順序、功能分割槽等等。

　　要讓訪客在0.5內就能把握網站的行業性質，1秒內就知道該從哪個地方開始使用這個網站，能點一此的，絕不點第二次。當然上面說的是大多數功能性網站，對於宣戰展示性網站，諸如加特效的或Flash網站，可能就不得不花哨一些，但不能太過分。網站不是動畫片，在效率越來越高，社會心理越來越浮躁的中國，人們的耐心越來越小，心理承受能力越來越低。效果可以體現意境，點到為止。

　　（3）模組化和可修改性強

　　模組化不僅可以提高重用性，也能統一網站風格，還可以降低程式開發的強度。這裡就設計一些尺寸、模數、寬容度、命名規範等等知識了，不再冗述。

　　，無論是架構還是模組或圖片，都要考慮可修改性強。舉個簡單的例子，logo、按鈕等，很多人喜歡製作圖片，N個按鈕就是N張圖片。如果只做3-5類按鈕的背景圖片，然後用在網頁程式碼裡打上文字，那麼修改起來就簡單了，讓程式設計師自己改字就可以了。然而網頁顯示的字型是帶有鋸齒的，一般即能清晰又保證美觀的字型字號有幾類：

　　宋體 12px | 宋體 12px 粗體 | 宋體 14px | 宋體 14px 粗體 | 黑體 20px | verdana 9px| Arial Black 12px+ |

　　（4）創藝是可恥的，分析能力遠比創藝來的重要

　　設計界動輒就大談什麼“創意”，我要說的是，還沒有搞清目的意義內容，還沒在技術製作上臻於完善的基礎上班，用創藝和特效來迷惑客戶和訪客是可恥的。一個網也設計者的分析能力遠比創藝來的重要。

　　（5）兼顧還是拋棄

　　CSS、XHTML、web2.0、Ajax等等山雨欲來，學習先進技術固然是有好處的，但對於目前國內普遍的低認知水平，決定了客戶的需求和價格也是相當低的。之前，說到經濟決定網也設計，所以有的時候，是不允許你做出更多的兼顧的，拋棄和放棄也是無奈之舉。

　　四、結尾，送上我的《簡明網頁設計理念》

　　（一）網頁配色基本概念

　　（1）白紙黑字是永遠的主題，誰都說不出不好來。

　　（2）網頁最常用流行色

　　·蘭色——藍天白雲，沉靜整潔的顏色。

　　·綠色——綠白相間，雅緻而有生氣。

　　·橙色——活潑熱烈，標準商業色調。

　　·暗紅——寧重、嚴肅、高貴，需要配黑和灰來壓制刺激的紅色，

　　（3）顏色的忌諱

　　·忌髒——背景與文字內容對比不強烈，灰暗的背景令人沮喪！

　　·忌純——豔麗的純色對人的刺激太強烈抗議，缺乏內涵。

　　·忌跳——再好看的顏色，也不能脫離整體。脫離群眾是自取其辱！

　　·忌花——要有一種主色貫穿其中，主色並不時面積最大的顏色，而是最重要，最能揭示和反映主題的顏色，就象領導者一樣，雖然在人數上居少數，但起決定作用。

　　·忌粉——顏色淺固然顯的乾淨，但如果對比過弱，整得蒼白無力了，就象病夫一樣無可救藥。

　　·藍色忌純，綠色忌黃，紅色忌豔。

　　（4）幾種固定搭配

　　·藍白橙——藍為主調。白底，藍標題欄，橙色按鈕或ICON做點綴。

　　·綠白蘭——綠為主調。白底，綠標題欄，蘭色或橙色按鈕或ICON做點綴。

　　·橙白紅——橙為主調。白底，橙標題欄，暗紅或桔紅色按鈕或ICON做點綴。

　　·暗紅黑——暗紅主調。黑或灰底，暗紅標題欄，文字內容背景為淺灰色。

　　（二）網頁設計理念

　　（1）內容決定形式

　　先把內容充實上，再分割槽塊，再定色調，再處理細節。

　　（2）先整體，後區域性，最後迴歸到整體。

　　全域性考慮，把能填上的都填上，佔位置。然後定基調，分模組設計。最後調整不滿意的幾個區域性細節。

　　（3）功能決定設計方向

　　·看網站的用途，決定設計思路.商業性的就要突出贏利目的；政府型的就要突出形象和權威性的文章；教育性的，就要突出師資和課程。

　　（三）如何快速高效的完成設計工作

　　（1）天下文章一大抄。

　　就看你會抄不會抄。抄的是道念，思想，區域性精緻的點綴。

　　在網上搜尋同類網站，找幾個順眼的，用一個為基本蘭圖，把幾個優點整和成自己的，這樣最高效快捷，而且還出成果，能學到很多東西。

　　（2）上設計論壇，找參考資料。