導(dǎo)語：商務(wù)網(wǎng)站網(wǎng)頁前端界面設(shè)計(jì)探討一文來源于網(wǎng)友上傳，不代表本站觀點(diǎn)，若需要原創(chuàng)文章可咨詢客服老師，歡迎參考。

摘要：在商務(wù)網(wǎng)站的網(wǎng)頁前端界面設(shè)計(jì)過程中，作為設(shè)計(jì)師要設(shè)計(jì)出商家、客戶都滿意的商務(wù)網(wǎng)站，就應(yīng)該遵循商務(wù)網(wǎng)頁設(shè)計(jì)的基本原則，就在網(wǎng)頁前端界面設(shè)計(jì)中的基本原則：對(duì)明確商務(wù)網(wǎng)站的目標(biāo)和用戶需求、把握好網(wǎng)頁界面設(shè)計(jì)的一致性與變化性、色彩搭配的和諧性、掌控好網(wǎng)頁元素的調(diào)和性與對(duì)比性、用好字體原則、多媒體元素及網(wǎng)頁特效的合理應(yīng)用等方面進(jìn)行了探討。

關(guān)鍵詞：商務(wù)網(wǎng)站；網(wǎng)頁設(shè)計(jì)；基本原則；探討

在互聯(lián)網(wǎng)的世界里，映入瀏覽者眼簾的會(huì)有各式各樣的商務(wù)網(wǎng)站，對(duì)于商家而言，要達(dá)到商業(yè)目的，網(wǎng)頁就要有吸引瀏覽者眼球的網(wǎng)頁元素來呈現(xiàn)信息內(nèi)容，也就是通過網(wǎng)頁來展示商家的產(chǎn)品及成果信息，彰顯商家的內(nèi)涵，提升商家形象，重要的是通過電子商務(wù)活動(dòng)能使商家的利潤(rùn)增長(zhǎng)。要使以上目的得以順利實(shí)現(xiàn)，網(wǎng)頁前端界面設(shè)計(jì)師就必須把握好商務(wù)網(wǎng)頁設(shè)計(jì)的基本原則。就商務(wù)網(wǎng)站的網(wǎng)頁前端界面設(shè)計(jì)的基本原則，展開探討。

1明確商務(wù)網(wǎng)站的目標(biāo)和用戶需求

設(shè)計(jì)師必須明確建站目標(biāo)和用戶需求，設(shè)計(jì)之初，設(shè)計(jì)師應(yīng)具備網(wǎng)頁前端界面設(shè)計(jì)的技術(shù)積累，并有動(dòng)態(tài)了解當(dāng)前網(wǎng)站及網(wǎng)頁的新潮流、新技術(shù)的習(xí)慣，在此基礎(chǔ)上，應(yīng)積極與業(yè)主（即商家）溝通，頃聽他們的訴求，結(jié)合目標(biāo)用戶的需求、商家的特點(diǎn)、市場(chǎng)的情況、流行的因子等因素來綜合調(diào)研分析，并經(jīng)合作團(tuán)隊(duì)的反復(fù)論證，做出切實(shí)可行的項(xiàng)目任務(wù)書。項(xiàng)目開展后，進(jìn)行設(shè)計(jì)時(shí)，要有顧客就是上帝的理念，切忌單純以藝術(shù)角度為中心，而應(yīng)以用戶為中心來進(jìn)行網(wǎng)頁前端界面的設(shè)計(jì)規(guī)劃。其中，重點(diǎn)就是注重用戶需求，如潛在用戶想要什么，想用什么，他們的關(guān)注熱點(diǎn)在哪里，作為商家能提供什么的產(chǎn)品與服務(wù)，用怎樣的頁面形式來表現(xiàn)才能滿足要求等，這些因素在建站之初商家與設(shè)計(jì)師必須考慮清楚。只有明確了建站目標(biāo)與用戶需求，就能夠準(zhǔn)確地確定整個(gè)網(wǎng)站的主題，這樣，才能為網(wǎng)頁前端界面的設(shè)計(jì)的成功打下良好的基礎(chǔ)。

2把握好網(wǎng)頁界面設(shè)計(jì)的一致性與變化性

網(wǎng)頁前端界面設(shè)計(jì)就是網(wǎng)頁的頁面設(shè)計(jì)，講究布局與內(nèi)容編排。網(wǎng)頁頁面設(shè)計(jì)，就是用文字、圖形等網(wǎng)頁元素的組合構(gòu)成網(wǎng)頁，通過設(shè)計(jì)師的藝術(shù)表達(dá)，從而設(shè)計(jì)出優(yōu)秀的網(wǎng)頁。一個(gè)網(wǎng)站是由數(shù)十張乃至數(shù)百張網(wǎng)頁組成的，一致性就是秩序，遵守這個(gè)秩序就是通常說的要風(fēng)格統(tǒng)一。但是如果每個(gè)網(wǎng)頁過分統(tǒng)一也會(huì)降低可讀性和吸引力，要使網(wǎng)站的網(wǎng)頁在保持整體風(fēng)格一致的前提條件下有變化，設(shè)計(jì)師就要處理好網(wǎng)頁前端界面設(shè)計(jì)中的一致與變化的這對(duì)矛盾體，使之有機(jī)統(tǒng)一。關(guān)鍵就是要圍繞網(wǎng)站的主題，首先做好主頁的界面設(shè)計(jì)，保證主頁本身的鮮明突出、要點(diǎn)明確，主頁界面設(shè)計(jì)形成了風(fēng)格特點(diǎn)，才能談其他頁面的一致性。在網(wǎng)站中主頁、分主頁及其他對(duì)應(yīng)的頁面中，它們之間是有內(nèi)在聯(lián)系的，設(shè)計(jì)時(shí)必須要呈現(xiàn)出來，要在守好一致性的秩序，處理好各頁面的風(fēng)格及內(nèi)容的內(nèi)在聯(lián)系的基礎(chǔ)上，才去藝術(shù)地、合適地活用變化性。比如，利用網(wǎng)頁特效的形式來進(jìn)行在線營(yíng)銷時(shí)，要想既叫好又叫座的話，即又要達(dá)到預(yù)期的營(yíng)銷目的，又能呈現(xiàn)最佳的頁面視覺效果，就需要設(shè)計(jì)師的經(jīng)驗(yàn)，要科學(xué)合理地、有藝術(shù)水準(zhǔn)地去進(jìn)行整體的規(guī)劃布局。如需要推介某件商品時(shí)，有商品的名稱、型號(hào)、功能，還有價(jià)格等參數(shù)，如何將這些枯燥的參數(shù)讓客戶能主動(dòng)去了解，這時(shí)就要考量設(shè)計(jì)師的功力了，是采用簡(jiǎn)潔的文本信息、華麗并有吸引力的圖像、多媒體表現(xiàn)手法，還是直接用網(wǎng)頁特效呈現(xiàn)，這些都需要設(shè)計(jì)師周到的考慮，目的就是要登錄網(wǎng)站的瀏覽者有舒服的視覺體驗(yàn)，流暢的操作，來促成登錄瀏覽者購買行為的成功。整個(gè)網(wǎng)站的網(wǎng)頁前端界面的布局應(yīng)該在做到主次分明，突出重點(diǎn)；導(dǎo)航清晰，瀏覽便利，布局合理，邏輯性強(qiáng)的前提下，做好相對(duì)保持一致且有合理的變化，即把握好一致性與變化性。另外，作為設(shè)計(jì)師，在頁面具體的規(guī)劃上，還要注意一些小細(xì)節(jié)，比如對(duì)于一個(gè)頁面寬度，尤其是主頁，左右不宜拖動(dòng)，最好是一屏的寬度；而頁面高度，上下可以拖動(dòng)，但不宜過長(zhǎng)。

3色彩搭配的和諧性

關(guān)于色彩，其實(shí)早就有科學(xué)家證明了這點(diǎn)：人們對(duì)色彩是非常敏感的，人們會(huì)對(duì)不同的顏色會(huì)產(chǎn)生不同的生理反應(yīng)。色彩在一定的條件下能刺激和吸引人的視覺。由于人的年齡、性別、學(xué)歷、社會(huì)閱歷、職業(yè)、社會(huì)地位、興趣愛好及習(xí)慣等的不同，就形成了人們千差萬別的審美情趣，作為設(shè)計(jì)師，進(jìn)行網(wǎng)頁前端界面設(shè)計(jì)，就要根據(jù)要求的不同，創(chuàng)造出各具特色色彩搭配，來滿足各種不同人群的審美需求。當(dāng)瀏覽者打開一個(gè)網(wǎng)站，瀏覽網(wǎng)頁的時(shí)候，往往不會(huì)是先看其他網(wǎng)頁元素，而在直覺上，首先關(guān)注的應(yīng)該是色彩。作為網(wǎng)頁前端界面設(shè)計(jì)師，要從藝術(shù)的角度去重視色彩搭配，要了解色彩的特性，學(xué)會(huì)與色彩溝通，體會(huì)色彩的奧秘，人們常說，只有把創(chuàng)意融入色彩設(shè)計(jì)里，設(shè)計(jì)才有靈魂。一個(gè)設(shè)計(jì)，肯定包含3個(gè)元素：色彩、圖像、文字，其中最重要的就是是色彩。而一個(gè)好的頁面設(shè)計(jì)，肯定會(huì)有好的配色方案。配色方案即是色彩搭配，可根據(jù)網(wǎng)站的設(shè)計(jì)目標(biāo)、主題、使用人群設(shè)計(jì)出不同的配色方案，配色方案的選擇往往是決定網(wǎng)站成敗的一個(gè)關(guān)鍵因素。作為設(shè)計(jì)師，通常通過不同顏色來呈現(xiàn)網(wǎng)站風(fēng)格定位，表達(dá)情感和意圖。一般的配色原則是：整個(gè)網(wǎng)站的色系要保持一致；若商家有企業(yè)視覺形象識(shí)別系統(tǒng)（CIS），網(wǎng)站就應(yīng)該使用商家原有CIS顏色，來體現(xiàn)商家的文化形象；盡量使用瀏覽器支持的216個(gè)Web安全顏色；遵循三色原則：除了黑色和白色以外，主要顏色不要超過3種；網(wǎng)頁元素應(yīng)該選擇與網(wǎng)站主體相一致的色調(diào)；圖像的顏色應(yīng)該盡可能少，減小圖片尺寸。

4掌控好網(wǎng)頁元素的調(diào)和性與對(duì)比性

網(wǎng)頁元素一般有：標(biāo)志（Logo）、導(dǎo)航條、文本、圖像、表格、表單、超鏈接、多媒體元素等。這些元素通過網(wǎng)頁界面設(shè)計(jì)有機(jī)地組合在一起，構(gòu)成了網(wǎng)頁。使這些權(quán)重不同的網(wǎng)頁元素放在一起，讓它們和諧地融合，通過頁面布局組合成頁面，而頁面之間的風(fēng)格也能一致協(xié)調(diào)，這就是人們常說的調(diào)和性。為了使不同的頁面中網(wǎng)頁元素搭配協(xié)調(diào)、架構(gòu)一致，就需要調(diào)和。頁面由網(wǎng)頁元素構(gòu)成，它們的重要性各不相同，一些元素之間是有關(guān)聯(lián)的，但有些是沒有關(guān)聯(lián)，如何讓對(duì)比性發(fā)揮作用，讓它們?cè)陧撁嬷杏行У?、自然地表達(dá)出來，這就需要設(shè)計(jì)師的用心。在一個(gè)頁面中，可以在某個(gè)區(qū)域利用二個(gè)或二個(gè)以上的頁面元素產(chǎn)生對(duì)比效果來吸引用戶，但如果所有頁面的元素都作同樣處理，頁面會(huì)變得單調(diào)無味。就像人們平時(shí)所說的，會(huì)審美疲勞，用戶瀏覽內(nèi)容時(shí)會(huì)很快跳轉(zhuǎn)他網(wǎng)站的頁面，留不住瀏覽者的訪問。所以作為設(shè)計(jì)師，在頁面設(shè)計(jì)時(shí)也要用好對(duì)比性。作為設(shè)計(jì)師，頁面引入元素時(shí)要充分考慮調(diào)和性與對(duì)比性原則，在進(jìn)行網(wǎng)頁整體設(shè)計(jì)時(shí)，設(shè)計(jì)師要充分考慮商務(wù)網(wǎng)站的設(shè)計(jì)初衷，網(wǎng)頁元素在頁面布局中如何規(guī)劃，頁面間的設(shè)計(jì)如何體現(xiàn)它們之間的聯(lián)系，這些都很重要，是考量設(shè)計(jì)師的功力，網(wǎng)頁元素的合理使用，視覺的吸引，整體合理布局，設(shè)計(jì)師都要充分考慮，用心設(shè)計(jì)，比如，頁頁布局中，常見的網(wǎng)頁布局形式有：“廠”字型、“口”字型、對(duì)稱布局、“同”（或“國(guó)”）字型、POP布局、“三”字型等，使用哪種形式，設(shè)計(jì)師就要根據(jù)商家設(shè)計(jì)目標(biāo)和用戶需求充分考慮，結(jié)合上述的調(diào)和性與對(duì)比性原則，進(jìn)行合理的選擇與規(guī)劃。

5用好字體原則

網(wǎng)頁中最基本的頁面元素是文字，作為設(shè)計(jì)師，必須遵循好字體原則：正文英文字體：TimeNewRoman/Ar-ial；正文中文字體：宋體，12像素或14像素；特殊效果字體應(yīng)放在圖像中，如帶有特效的標(biāo)題上、廣告條等；段落行文本不宜過長(zhǎng)，不要橫跨整個(gè)瀏覽器窗口；改變頁邊距、行邊距和顏色增加字體效果；字體在整個(gè)網(wǎng)站中保持一致性，同類型的數(shù)據(jù)或信息應(yīng)使用同一種字體。

6多媒體元素及網(wǎng)頁特效的合理應(yīng)用

在網(wǎng)頁前端界面設(shè)計(jì)中，設(shè)計(jì)師總喜歡在頁面中加入多媒體元素，如動(dòng)畫、影片等，或直接應(yīng)用網(wǎng)頁特效，以豐富動(dòng)感和流媒體特有效果，來吸引住瀏覽者的注意力。隨著HTML5+CSS3的應(yīng)用，網(wǎng)頁特效使用日益豐富，作為設(shè)計(jì)師，越來越喜歡使用最新的網(wǎng)頁特效，特別是在商務(wù)網(wǎng)站中的頁面應(yīng)用越來越廣泛?，F(xiàn)在一打開電子商務(wù)網(wǎng)站，各網(wǎng)站的頁面上呈現(xiàn)的都是網(wǎng)頁特效下的比拚，比誰的新，誰的酷，誰的實(shí)用。在頁面中無論加入網(wǎng)頁特效，還是加入多媒體元素，都要有個(gè)度，應(yīng)用要合理，合適為度，要把握頁面中元素與頁面整體的動(dòng)與靜。不宜應(yīng)用過多，以免造成喧賓奪主。作為設(shè)計(jì)師，要合理地應(yīng)用多媒體元素與網(wǎng)頁特效。

7結(jié)語

在商務(wù)網(wǎng)站的網(wǎng)頁前端界面設(shè)計(jì)過程中，設(shè)計(jì)師必須在不斷地學(xué)習(xí)中前行，在實(shí)踐中點(diǎn)點(diǎn)滴滴地積累經(jīng)驗(yàn)，去研究、有意識(shí)地運(yùn)用這些網(wǎng)頁前端界面設(shè)計(jì)的規(guī)律，不斷地完善商務(wù)網(wǎng)頁設(shè)計(jì)的基本原則，追求一種和諧的單純，把美的形式規(guī)律同網(wǎng)頁設(shè)計(jì)結(jié)合起來，才能設(shè)計(jì)出商家、客戶都滿意的商務(wù)網(wǎng)站。

參考文獻(xiàn)

[1]劉丹.網(wǎng)頁設(shè)計(jì)的原則與要求[J].鹽城:鹽城師范學(xué)院學(xué)報(bào)(人文社會(huì)科學(xué)版),2016,（5）：97-99.

[2]王玉芹.淺談網(wǎng)頁設(shè)計(jì)的基本原則[J].北京:中國(guó)科技投資,2013,(10):84.

[3]劉艷麗.網(wǎng)頁設(shè)計(jì)與制作實(shí)用教程[M].3版.北京：高等教育出版社,2015.

作者:周海 吳小瑩 單位:北海職業(yè)學(xué)院