國內(nèi)電子商務(wù)網(wǎng)站的視覺設(shè)計(jì)分析

1、國內(nèi)電子商務(wù)網(wǎng)站的視覺設(shè)計(jì)分析本文主要分析國內(nèi)購物網(wǎng)站的視覺設(shè)計(jì)，通過對(duì)網(wǎng)站 的網(wǎng)頁版面以及色彩上進(jìn)行比較分析，結(jié)合用戶體驗(yàn)以及設(shè) 計(jì)心理學(xué)，探討如何提升網(wǎng)站的視覺設(shè)計(jì)，提高網(wǎng)站的競(jìng)爭(zhēng) 優(yōu)勢(shì)。電子商務(wù)的發(fā)展概述隨著計(jì)算機(jī)信息技術(shù)的發(fā)展，互聯(lián)網(wǎng)的普及，電子商務(wù) 這一新興行業(yè)也呈迅猛發(fā)展之勢(shì)進(jìn)入人們的生活中。電子商 務(wù)與網(wǎng)民的生活密切相關(guān)。各大網(wǎng)站之間的競(jìng)爭(zhēng)日趨白熱 化。購物網(wǎng)站，其主旨就是通過對(duì)商品的描述，圖片的展示、信息的排列說服消費(fèi)者消費(fèi)。視覺是人的第一感官，網(wǎng)站的 視覺體驗(yàn)直接決定了消費(fèi)者的心理感受，網(wǎng)站想要獨(dú)樹一 幟，吸引消費(fèi)者的眼球，那么視覺設(shè)計(jì)是網(wǎng)站設(shè)計(jì)的重中之 重。網(wǎng)頁設(shè)計(jì)視覺元素

2、分析網(wǎng)頁是互聯(lián)網(wǎng)用戶直接交流使用的頁面，是一種交互和 操作的系統(tǒng)前臺(tái)。網(wǎng)頁的設(shè)計(jì)相當(dāng)于實(shí)體店的店鋪裝修，給 消費(fèi)者直觀的用戶體驗(yàn)，因此網(wǎng)頁設(shè)計(jì)是否合理直接決定了 網(wǎng)站的用戶流量。那么設(shè)計(jì)師如何通過框架結(jié)構(gòu)、內(nèi)容排版、色彩搭配、字體以及圖片運(yùn)用達(dá)到網(wǎng)頁的和諧統(tǒng)一呢？以下 從四個(gè)方面分析了網(wǎng)頁的視覺設(shè)計(jì)。1. 版面設(shè)計(jì) 網(wǎng)站頁面的結(jié)構(gòu)框架即網(wǎng)頁的整體版面設(shè)計(jì)，它是視覺 設(shè)計(jì)中傳遞信息的重要手段。網(wǎng)站頁面的版式設(shè)計(jì)是用戶與 互聯(lián)網(wǎng)之間相互交流的最初印象，它的主旨是更好的傳遞客 戶信息，使網(wǎng)站所要表達(dá)的主題一目了然，給用戶清晰的向 導(dǎo)，其中涵蓋的諸多視覺元素，如文字、圖片、 logo 等都要 在有限的

3、版面中得到合理的優(yōu)化，表達(dá)出和諧的美感。在網(wǎng) 頁界面設(shè)計(jì)中，圖像和文字有不同的區(qū)分形式，如大小、屬 性和內(nèi)容的區(qū)別，兩者要根據(jù)用戶或使用者不同需求進(jìn)行布 局與編排，有效展現(xiàn)整體效果。在對(duì)頁面進(jìn)行設(shè)計(jì)時(shí)，要遵 循一定的規(guī)則和視覺規(guī)范，出發(fā)點(diǎn)為“以人為本” ，以簡(jiǎn)便、 快速傳播信息為準(zhǔn)則，運(yùn)用到電商網(wǎng)站的視覺設(shè)計(jì)中。當(dāng)代的網(wǎng)站設(shè)計(jì)呈現(xiàn)方式頗為豐富。風(fēng)格從清新到復(fù) 古，插畫手繪到擬真設(shè)計(jì)，無奇不有。無論是版面樣式，還 是設(shè)計(jì)元素，都是標(biāo)新立異，與眾不同。以為天貓商城的版 面設(shè)計(jì)，作為中國最大的電子商城，天貓商城的版面設(shè)計(jì)是 比較符合版面設(shè)計(jì)的原理。在購物網(wǎng)站的頁面信息中，商品 的種類繁多，信息量很大

4、，要根據(jù)商品的屬性做出合理的分 類。那么信息導(dǎo)航和主次分明就顯得尤為重要。天貓商城的 整體板塊基本保持一致，首屏板塊的大面積的廣告提醒用戶 當(dāng)日最新商品訊息。版面分布均衡，視覺重心在屏幕的黃金 位置，若頂部的廣告欄再稍加弱化，視覺效果會(huì)更加集中。網(wǎng)站界面的導(dǎo)航系統(tǒng)，對(duì)于頁面信息的分類起著很大的作 用，同類商品的細(xì)分使頁面布局更加合理、簡(jiǎn)潔。網(wǎng)站頁面信息的布局，就如大型超市，將貨品擺放，區(qū) 分類別、功用、大小、價(jià)格等進(jìn)行的擺放布置，在視覺上對(duì) 消費(fèi)者的瀏覽和選購提供便利性的引導(dǎo)。打開天貓頁面信息 布局，你會(huì)發(fā)現(xiàn)每層結(jié)構(gòu)相同，整個(gè)版式非常工整。對(duì)于信 息量大，分類多，商品凌亂的購物網(wǎng)站來說，次要信

5、息用不 斷重復(fù)的版面結(jié)構(gòu)或許更有優(yōu)勢(shì)。就如商場(chǎng)的樓層結(jié)構(gòu)一 樣，每一層的洗手間都在同一位置， 用戶的體驗(yàn)具有習(xí)慣性， 這樣提高消費(fèi)者的購物效率，縮短了不必要的流程。優(yōu)化網(wǎng) 頁信息布局，設(shè)計(jì)合理，提高視覺的邏輯性，便于瀏覽者閱 讀信息。2. 色彩搭配 美國流行色彩研究中心的一項(xiàng)調(diào)查表明，人們?cè)谔暨x商 品的時(shí)候只需 7 秒鐘就可以確定對(duì)這些商品是否感興趣。在 這短暫而關(guān)鍵的 7 秒鐘內(nèi)， 色彩的作用占到 67 %，成為決定 人們對(duì)商品好惡的重要因素， 這就是 20 世紀(jì) 80 年代出現(xiàn)的” 色彩營(yíng)銷”的理論依據(jù)。同樣道理，在界面設(shè)計(jì)中，如果色 彩的選擇和搭配恰到好處，可以在段時(shí)間內(nèi)給新用戶留下深

6、刻的印象，會(huì)給我們的設(shè)計(jì)帶來意想不到的效果。每一種色彩都有其特定的顏色寓意，例如紅色偏向熱情 活力，藍(lán)色則偏向冷靜和平和，黃色總是給人富貴和輝煌的 感覺。正因?yàn)轭伾南笳餍?，所以設(shè)計(jì)時(shí)必須考慮到使用場(chǎng) 合以及適用對(duì)象。再看天貓商城的色彩運(yùn)用，每一區(qū)域均以 色塊為引導(dǎo)，多以亮色引導(dǎo)視覺重心。網(wǎng)上消費(fèi)的主要群體 是女性，頁面以暖色為主，營(yíng)造出一種活潑、溫暖且有安全 感的視覺心理。天貓商城整版的底色均為白色，白色屬于無 色系，與任何顏色都可搭配，用作底色輔助十分合理，自然 地營(yíng)造出一種主題明確、舒適和諧的視覺體驗(yàn)，使用戶深深 的融入網(wǎng)站的情境中。天貓商城走的是重“色”路線，各種 色塊多重視覺層級(jí)，用

7、視覺刺激用戶的購物欲。3. 字體的選擇 文字是最直觀的產(chǎn)品信息，任何表達(dá)方式都不如文字的 精準(zhǔn)，文字是最不起眼但卻最重要的媒介載體。廣義上的字 體分為兩大類：襯線字體和非襯線字體，襯線字體是指帶有 額外裝飾并且粗細(xì)不同的字體，例如中國網(wǎng)頁中常用的宋 體。非襯線字體即字體粗細(xì)相同，簡(jiǎn)單無裝飾的字體，如國 英文版面中常用的 Arial、Thoma、微軟黑雅等。字體的選擇 也有特定的含義。粗字體比較顯眼，給人的第一印象偏向硬 朗、大氣、穩(wěn)健，多用于男性化的網(wǎng)頁中；而女性為主體網(wǎng) 站的字體則多選用細(xì)致、苗條的字體，以迎合女性柔美的心 理。天貓商城的主要字體是黑體，屬于非襯線體，由于筆畫 的粗細(xì)相同，使得很小的文字能有看的更清楚。其他的購物 網(wǎng)站如京東、亞馬遜等均使用宋體字，文字編輯顯的輕盈， 有粗細(xì)變化的節(jié)奏感。在網(wǎng)頁中，字體的選擇不宜過多，否 則會(huì)給用戶產(chǎn)生昏亂感。結(jié)束語國內(nèi)的電商已進(jìn)入到全面發(fā)展時(shí)期，網(wǎng)站的設(shè)計(jì)業(yè)隨之 受到多方關(guān)