電子商務網站的頁面設計

　　1.網頁的版面布局設計

　　雖然網頁技術的發展使得我們開始趨向于學習場景的編劇，但是固定網頁版面設計基礎依然是必須學習和掌握的。它們的基本原理是相通的。你可以領會要點，舉一反三。版面指的是通過瀏覽器看到的完整的一個頁面(可以包含框架和層)。因為每個人的顯示器分辨率不同，所以同一個頁面的大小可能出現640×480像素、800×600像素、1024×768像素等不同尺寸。布局則指的是以最適合用戶瀏覽的方式將圖片和文字排放在頁面中。

　　(1)版面布局的重要性。具體到網站的每一個網頁，其排版布局達到一種和諧的狀態才算是一種成功的網頁設計，同樣的圖像和文字，用不同的方式將其組合起來，很可能產生截然不同的效果。網頁的內容和頁面的形式都是網站設計者必須考慮的，只考慮內容，不重視其形式，會影響用戶瀏覽時的情緒；只顧頁面的排版形式，不顧內容，用戶也不會歡迎。二者缺一不可，少了任何一個，都是設計的失敗。

　　(2)版面布局的步驟。

　　1)草案。屬于創造階段，不講究細膩工整，也不必考慮細節功能，只以粗陋的線條勾畫出創意的輪廓即可。盡可能多畫幾張，最后選定一幅較滿意的作為繼續創作的腳本。

　　2)粗略布局。在草案的基礎上，將需要放置的功能模塊安排到頁面上。功能模塊主要包含網站標志、主菜單、新聞、搜索、友情鏈接、廣告條、郵件列表、計數器和版權信息等。注意，這里必須遵循突出重點、平衡協調的原則，將網站標志、主菜單等重要的模塊放在最顯眼、最突出的位置，然后再考慮次要模塊的排放。

　　3)定案。將粗略布局精細化、具體化，最后達到滿意定案。

　　(3)常見的版面布局形式。

　　“T”型布局。所謂“T”型就是指頁面頂部為“橫條網站標志+廣告條”，下方左面為主菜單，右面顯示內容的布局。因為菜單條背景較深，整體效果類似英文字母“T”，所以稱為“T”型布局，這是網頁設計中使用最廣泛的一種布局方式。這種布局的優點是頁面結構清晰、主次分明，且是初學者最容易掌握的布局方法。缺點是規矩呆板，如果色彩細節上再不注意，很容易讓人看后乏味。

　　“口”型布局。這是一個象形的說法，就是頁面一般上下各有一個廣告條，左面是主菜單，右面放友情鏈接等，中間是主要內容。這種布局的優點是充分利用版面、信息量大；缺點是頁面擁擠、不夠靈活。也有將四邊突出，只用中間的窗口型設計。

　　“三”型布局。這種布局多用于國外站點，國內使用得不多。特點是頁面上橫向有兩條色塊將頁面整體分割為3部分，色塊中大多放廣告條。

　　對稱對比布局。顧名思義，采取左右或者上下對稱的布局，一半深色，另一半淺色，一般用于設計型站點。優點是視覺沖擊力強，缺點是將兩部分有機地結合起來比較困難。以上總結了目前網絡上常見的布局，此外還有許多別具一格的布局，關鍵在于網站本身的創意和設計。

　　(3)頁面版面布局應遵循的原則。

　　正常平衡。亦稱“勻稱”，多指左右、上下對照的形式，主要強調秩序，能達到安定、誠實、信賴的效果。

　　異常平衡。即非對照形式，但也要平衡和韻律，當然都是不均衡的，這種布局能達到強調性、高注目性的效果。

　　對比。所謂對比，是指不僅利用色彩、色調等技巧來表現，在內容上也可涉及古與今、新與舊的對比。

　　空白?？瞻子袃煞N作用，一方面表示網站的突出卓越，另一方面也表示網頁品位的優越感，這種表現方法對體現網頁的格調十分有效。

　　盡量用圖片解說。此法對不能用語言說服或用語言無法表達的情感，特別有效。圖片解說的內容可以傳達給瀏覽者更多的感性認識。

　　以上的設計原則，雖然有些枯燥，但是如果網頁設計人員能領會并活用到網頁布局里，效果就大不一樣了。比如，網頁的白色背景太虛，則可以加些色塊；版面零散，可以用線條和符號串來分隔；左面文字太多，則右面可以插一張圖片以保持平衡；表格太過規矩，則可以改用倒角。

　　2.頁面中圖片和文字的處理

　　用戶在網上一般四處漫游，必須設法吸引他們對企業站點的注意力，所以企業電子商務網站的設計中要善于利用一些特色的效果，頁面上最好有醒目的圖像、新穎的畫面、美觀的字體，使其別具特色，令人過目不忘。

　　(1)圖片的使用。

　　圖像的內容應有一定的實際作用，切忌虛飾浮夸，最佳的圖像應集美觀與信息內容于一體。圖像總是為頁面的使用服務的，一幅大而漂亮的圖片，如果妨礙了頁面所要進行的工作，就會降低頁面的整體質量。在這種情況下，使用小圖像甚至不使用圖像將是更好的選擇。一個頁面的好壞在于它是否提供了有用的信息，所以不管圖像如何漂亮或標新立異，也不能隨意將它加入頁面中。

　　圖像可以彌補文字的不足，但并不能完全取代文字。很多用戶把瀏覽軟件設定為略去圖像，只看文字以求節省時間。因此，制作頁面時，必須注意將圖像所包含的重要信息或鏈接指示用文字替代功能重新表達一次。

　　(2)網站字體。

　　1)不要用太大或太小的文字。因為版面是寶貴而有限的，粗陋的大字不能給瀏覽者更多的信息。文字太小，用戶讀起來難受；文字太大，或者文字視覺效果變化頻繁，用戶看起來很不舒服。另外，按當代中文的閱讀習慣，文本大都是居左的，所以最好是讓文本左對齊，而不是居中。當然，標題一般應該居中，因為這符合瀏覽者的閱讀習慣。

　　2)避免過多使用不停閃爍的文字。閃爍的文字看起來好玩，但它可能使用戶分心，最好避免過多地使用它。有的網頁設計者想通過閃爍的文字引起瀏覽者的注意，但一個頁面中最多不要超過三處閃爍的文字，太多則給用戶一種眼花繚亂的感覺，影響用戶去訪問該網站的其他內容。

　　3)不要使用不常用的字體。網站中應該使用常用的字體，如“宋體”、“楷體”等。如果使用不常用的字體制作網頁，就會使客戶端所訪問的網頁達不到理想的效果。

　　3.網頁的色彩效果設計

　　網頁的色彩也是樹立網站形象的一個要素。色彩搭配看似簡單，實際上卻是網頁設計中很難處理的問題之一。如何運用最簡單的色彩表達最豐富的含義是網頁設計人員應認真思考的問題。在網頁設計中，根據和諧、均衡和重點突出的原則，將不同的色彩進行組合、搭配來構成美麗的頁面。色調及黑、自、灰的三色空間關系無論是在設計上，還是在繪畫上都起著重要的作用。但是需要注意，每個網站都應該有自己的主色調，不可為追求視覺效果而濫用顏色。例如號稱藍色巨人的IBM就用藍色作為自己網站的主色調。此外，色彩還會對人們的心理產生影響，應合理地加以運用。按照色彩的記憶性原則，一般暖色較冷色的記憶性強。另外，色彩還具有聯想與象征的特性，例如，紅色象征火、血、太陽，藍色象征大海、天空和水面等。例如設計出售冷食的虛擬店面，可使用清涼而沉靜的顏色，使人心理上感覺涼爽一些。

　　在色彩的運用過程中，還應注意的一個問題是：由于國家和種族的不同，宗教信仰、地理位置以及文化修養的差異，不同的人群對色彩的喜惡程度有很大的差別；生活在鬧市中的人們喜歡淡雅的顏色；生活在沙漠中的人們喜歡綠色。在設計中要考慮各企業的主要讀者群的背景和構成。

　　另外，在網頁色彩的處理上，要注意以下兩點：一方面色彩的使用要與眾不同，有自己的個性，這樣網頁才能引人注目，并給用戶留下深刻的印象；另一方面色彩的使用要和網站的內容保持一致，例如用綠色來作為一個無公害蔬菜連鎖超市站點的主色調。