網(wǎng)頁(yè)設(shè)計(jì)中企業(yè)網(wǎng)站信息的交互流程體驗(yàn)的引導(dǎo)功能分析

摘 要：虛擬網(wǎng)絡(luò)的宣傳平臺(tái)越來(lái)越受到現(xiàn)代企業(yè)的重視，無(wú)論是網(wǎng)絡(luò)購(gòu)物還是微博營(yíng)銷，線上交易平臺(tái)成了產(chǎn)品設(shè)計(jì)創(chuàng)新、運(yùn)營(yíng)創(chuàng)新的新途徑。企業(yè)的官方網(wǎng)站正是展現(xiàn)公司定位、產(chǎn)品特色、風(fēng)格理念的最佳平臺(tái)，而網(wǎng)站的交互流程的優(yōu)良與否又直接關(guān)系著用戶，甚至顧客的購(gòu)買滿意度。因此本文主要以網(wǎng)頁(yè)版式設(shè)計(jì)的相關(guān)要素出發(fā)，通過(guò)社會(huì)、環(huán)境和技術(shù)三方面的互相關(guān)聯(lián)，分析在網(wǎng)站設(shè)計(jì)當(dāng)中如何進(jìn)行體驗(yàn)引導(dǎo)的作用分析，通過(guò)對(duì)典型案例（家紡網(wǎng)站“上海故事”）進(jìn)行多面分析，闡述如何優(yōu)化用戶體驗(yàn)，怎樣進(jìn)行正確視覺(jué)流引導(dǎo)，從而加強(qiáng)維護(hù)企業(yè)網(wǎng)上形象與網(wǎng)下形象的統(tǒng)一性，進(jìn)而更好地提升企業(yè)形象與品牌價(jià)值。

關(guān)鍵詞：交互流程；網(wǎng)頁(yè)設(shè)計(jì)；體驗(yàn)；網(wǎng)站信息

0 引言

在現(xiàn)代電子網(wǎng)絡(luò)技術(shù)高速發(fā)展的當(dāng)今，擁有一個(gè)獨(dú)立的企業(yè)網(wǎng)站并非難事，而對(duì)于任意一個(gè)已經(jīng)擁有網(wǎng)站的企業(yè)來(lái)說(shuō)，如果可以恰當(dāng)?shù)乩米陨淼木W(wǎng)站進(jìn)行宣傳和推廣，不僅可以有效地提高企業(yè)知名度，同時(shí)運(yùn)用得當(dāng)也可以吸引新顧客和保留就有顧客，是一個(gè)回報(bào)效果明顯的舉措，因此如何運(yùn)營(yíng)和設(shè)計(jì)企業(yè)網(wǎng)站是具有研究?jī)r(jià)值的。

1 基于三大層面上的企業(yè)網(wǎng)站設(shè)計(jì)需求分析

從網(wǎng)站設(shè)計(jì)的目標(biāo)出發(fā)，基于社會(huì)、環(huán)境以及技術(shù)等三大層面，在每個(gè)層面當(dāng)中提取出初步的設(shè)計(jì)需求，從而為接下來(lái)的“上海故事”網(wǎng)站設(shè)計(jì)分析鋪設(shè)基礎(chǔ)。

1.1 社會(huì)層面上——企業(yè)網(wǎng)站設(shè)計(jì)目標(biāo)的多層次需求

（1）明確建設(shè)網(wǎng)站目的的定位需求。既然是為企業(yè)設(shè)計(jì)網(wǎng)站，當(dāng)然需要重點(diǎn)突出企業(yè)自身獨(dú)特的屬性和優(yōu)勢(shì)以區(qū)別其他同行企業(yè)或產(chǎn)品。建立網(wǎng)站之前，要有明確的目的，即所建立的網(wǎng)站的作用是什么，服務(wù)的對(duì)象是哪些群體，要為瀏覽者提供怎樣的服務(wù)，只有找準(zhǔn)了網(wǎng)站的定位，才為網(wǎng)站建設(shè)提供可能。

（2）考慮訪問(wèn)者的心理需求。設(shè)計(jì)網(wǎng)站是為了更好地將企業(yè)形象深入到每位訪客心中，借此保留住原有的顧客，同時(shí)吸引更多的新顧客通過(guò)網(wǎng)絡(luò)從虛擬世界走向現(xiàn)實(shí)世界當(dāng)中，購(gòu)買企業(yè)的產(chǎn)品。既然目標(biāo)對(duì)象是具有深層次心理活動(dòng)的人，其心理需求自然需要多加考慮，這不僅影響著訪問(wèn)者是否會(huì)重新回訪、瀏覽過(guò)后的反饋如何，同時(shí)還會(huì)帶動(dòng)影響其他關(guān)注者的心理活動(dòng)，對(duì)企業(yè)的宣傳和推廣都有不可忽視的作用。

（3）進(jìn)行可行性分析的功能需求。可行性分析就是分析是否有能力、財(cái)力建設(shè)和維護(hù)這個(gè)網(wǎng)站；分析網(wǎng)站建成以后是否有一定的經(jīng)濟(jì)效益或社會(huì)效益；分析網(wǎng)站建設(shè)需要花費(fèi)多少時(shí)間、精力、人力，性價(jià)比是否合算。

1.2 環(huán)境層面上——根據(jù)行業(yè)特點(diǎn)和地域特色對(duì)網(wǎng)站產(chǎn)品進(jìn)行推廣

環(huán)境方面包含了、地理環(huán)境、自然環(huán)境、市場(chǎng)環(huán)境以及生活環(huán)境等方面的因素，結(jié)合網(wǎng)站設(shè)計(jì)關(guān)注如下幾點(diǎn)：

（1）能否與競(jìng)爭(zhēng)同行形成差異化特色。在同樣的市場(chǎng)環(huán)境競(jìng)爭(zhēng)，如何脫穎而出，獨(dú)具特點(diǎn)是讓顧客和網(wǎng)站瀏覽者記住企業(yè)的有效途徑，這樣在顧客購(gòu)買同類產(chǎn)品時(shí)，對(duì)印象深刻的品牌和企業(yè)是十分具有積極影響的。

（2）是否具有網(wǎng)站獨(dú)具的地域特色。不少網(wǎng)站設(shè)計(jì)千篇一律，毫無(wú)獨(dú)特風(fēng)格，與同行業(yè)之間的競(jìng)爭(zhēng)優(yōu)勢(shì)十分微弱。但是，一個(gè)具有地域特色的網(wǎng)站不僅可以從同類行業(yè)網(wǎng)站當(dāng)中脫穎而出，更能增加同屬地域訪問(wèn)者的親切感和熟悉感，加大購(gòu)買機(jī)會(huì)。

（3）如何深入配合產(chǎn)品宣傳的需要。通過(guò)Internet進(jìn)行產(chǎn)品發(fā)布、宣傳無(wú)疑是最理想的途徑，人們?cè)絹?lái)越習(xí)慣到Internet上查找所需要的信息，并且作為首選的途徑。盡管很多網(wǎng)站無(wú)論是從藝術(shù)效果和實(shí)用功能來(lái)講都已具備相當(dāng)?shù)膶?shí)力，但是企業(yè)在發(fā)布網(wǎng)站后就不在過(guò)問(wèn)，很多企業(yè)都不太重視網(wǎng)站推廣的重要性，不懂得如何利用網(wǎng)站來(lái)宣傳自己的企業(yè)，樹立自己的品牌形象，企業(yè)網(wǎng)站形同虛設(shè)。

1.3 技術(shù)層面上——對(duì)網(wǎng)站開發(fā)和功能實(shí)現(xiàn)的基礎(chǔ)支持

技術(shù)方面包括網(wǎng)站的開發(fā)技術(shù)、管理技術(shù)、維護(hù)技術(shù)以及發(fā)布網(wǎng)絡(luò)的技術(shù)等。這些技術(shù)在實(shí)際應(yīng)用當(dāng)中，應(yīng)充分考慮現(xiàn)有技術(shù)市場(chǎng)和技術(shù)條件，以最合適的人力、資源比來(lái)實(shí)現(xiàn)對(duì)網(wǎng)站的技術(shù)支持。

2 家紡網(wǎng)站企業(yè)案例分析之“上海故事”

本文綜合調(diào)查了多個(gè)知名的家紡網(wǎng)站，并對(duì)“上海故事”、“絕代佳人”、“博洋家紡”、和“黛富妮家紡”等多家知名家紡網(wǎng)站進(jìn)行了分析比較和研究，總結(jié)歸納出同行業(yè)之間，家紡網(wǎng)站設(shè)計(jì)的共同點(diǎn)和各自優(yōu)勢(shì)，其中“上海故事”本身具有長(zhǎng)久以來(lái)線下實(shí)體店的經(jīng)營(yíng)銷售，其專賣店已輻射到南京、杭州、寧波、福州、青島、天津，哈爾濱等重要城市，具有研究代表性；同時(shí)還在線下對(duì)“上海故事”在上海各大商場(chǎng)的幾個(gè)主要門店進(jìn)行了市場(chǎng)調(diào)研和資料收集。

針對(duì)家紡企業(yè)網(wǎng)站，對(duì)其設(shè)計(jì)需要考慮的方面進(jìn)行歸納整理，家紡網(wǎng)站設(shè)計(jì)的要素結(jié)構(gòu)圖如表1。

3 “上海故事”網(wǎng)站設(shè)計(jì)的出發(fā)點(diǎn)

“上海故事”企業(yè)網(wǎng)站，主要圍繞：企業(yè)簡(jiǎn)介、企業(yè)文化、服務(wù)理念、品牌定位、風(fēng)格定位等級(jí)方面來(lái)進(jìn)行設(shè)計(jì)，通過(guò)將目前主營(yíng)產(chǎn)品分為絲巾圍飾、時(shí)尚陽(yáng)傘、時(shí)尚手袋三大類別，近千余個(gè)花色品種。這些數(shù)量龐大的產(chǎn)品，通過(guò)圖片展示和文字介紹的形式進(jìn)行表現(xiàn)；在網(wǎng)站設(shè)計(jì)中，顏色選擇上具有浪漫色彩的絲綢紅，以及富有文藝氣息的照片幻燈，極力宣揚(yáng)企業(yè)文化中的“真誠(chéng)·愛(ài)·快樂(lè)”；其品牌定位體現(xiàn)出一個(gè)故事，萬(wàn)般風(fēng)情。在上海故事的產(chǎn)品當(dāng)中，無(wú)論是傘、絲巾或者是包類，都可以通過(guò)一個(gè)簡(jiǎn)單的故事為原型，來(lái)闡述產(chǎn)品的理念和文化；再將服務(wù)理念的宗旨放入網(wǎng)站設(shè)計(jì)中，體現(xiàn)對(duì)顧客的悉心關(guān)懷，“顧客”不僅是指購(gòu)買“上海故事”產(chǎn)品的消費(fèi)者，還包括所有與“上海故事”打交道的合作伙伴及經(jīng)銷商等。

3.1 2010年舊版“上海故事”網(wǎng)站規(guī)劃和基本交互流程

點(diǎn)擊上海故事的官方網(wǎng)站，首先是一段flash動(dòng)畫，動(dòng)畫的主題圍繞上海故事的品牌理念“一個(gè)故事，萬(wàn)般風(fēng)情”展開，通過(guò)不同類型企業(yè)的產(chǎn)品佩戴在不同氣質(zhì)的優(yōu)雅女性身上，體現(xiàn)出濃濃的典雅氣質(zhì)。

點(diǎn)擊跳過(guò)動(dòng)畫，出現(xiàn)的黑色背景的上海故事的主頁(yè)，頁(yè)面的導(dǎo)航部分由上海故事的CI形象標(biāo)志與導(dǎo)航欄組成。導(dǎo)航欄的策劃是主導(dǎo)航欄和次導(dǎo)航欄的結(jié)合，其中主導(dǎo)航欄的內(nèi)容包括：首頁(yè)，聯(lián)系方式和網(wǎng)站地圖，此導(dǎo)航欄的內(nèi)容是：企業(yè)介紹，產(chǎn)品中心，周邊介紹，會(huì)員貴賓和銷售服務(wù)。

頁(yè)面中心主體部分是紅色次級(jí)背景的產(chǎn)品圖片替換展示、企業(yè)風(fēng)采、最新動(dòng)態(tài)和產(chǎn)品展示。另外在頁(yè)面下方還有一段次級(jí)導(dǎo)航欄，內(nèi)容依次是：網(wǎng)站地圖、版權(quán)申明、隱私條款、聯(lián)系方式、友情鏈接以及企業(yè)郵箱，并在旁邊附上了團(tuán)購(gòu)熱線電話號(hào)碼。值得注意的是上海故事在這里進(jìn)行了一些文字替換：如企業(yè)介紹被稱作了“關(guān)于我們”，周邊介紹部分被稱為“絲路花語(yǔ)”。

點(diǎn)擊進(jìn)入“關(guān)于我們”，在左側(cè)列出了該目錄下的四級(jí)內(nèi)容分別是：企業(yè)簡(jiǎn)介、企業(yè)文化、品牌介紹及最新動(dòng)態(tài)；該層級(jí)的右側(cè)是內(nèi)容顯示區(qū)域，相應(yīng)的文字和圖片介紹都羅列其中。有個(gè)細(xì)節(jié)設(shè)計(jì)是在右側(cè)的抬頭部分添加了導(dǎo)航欄層級(jí)顯示，方便瀏覽時(shí)的返回操作。

接下來(lái)的產(chǎn)品中心界面設(shè)計(jì)基本和企業(yè)介紹部分相同，左側(cè)均為層級(jí)顯示，右側(cè)均為內(nèi)容展示。值得一提的是，在產(chǎn)品指示的部分，“包包”一欄無(wú)任何內(nèi)容展示；絲路花語(yǔ)的電子期刊只有摘要性話語(yǔ)介紹，具體內(nèi)容并無(wú)展示；在會(huì)員貴賓的層級(jí)中，會(huì)員登入與會(huì)員信息是相同內(nèi)容；銷售服務(wù)的部分中，業(yè)績(jī)排行與優(yōu)秀員工的頁(yè)面均無(wú)內(nèi)容呈現(xiàn)。

其他稍有差別的細(xì)節(jié)，如企業(yè)郵箱是跳出一個(gè)新的登入窗口，不過(guò)一旦進(jìn)入此頁(yè)面則無(wú)法返回到上一級(jí)；在產(chǎn)品指示部分，增加了站內(nèi)產(chǎn)品搜索功能，加強(qiáng)了網(wǎng)站與客戶的互動(dòng)性。

3.2 2013新版“上海故事”網(wǎng)站改版后的交互體驗(yàn)優(yōu)化

新版的“上海故事”官方網(wǎng)站，對(duì)原有的網(wǎng)站進(jìn)行了優(yōu)化設(shè)計(jì)，主要體現(xiàn)出網(wǎng)頁(yè)版式設(shè)計(jì)要素對(duì)網(wǎng)站交互體驗(yàn)的引導(dǎo)上：

（1）單元區(qū)分視覺(jué)化——通過(guò)圖像來(lái)引導(dǎo)視覺(jué)焦點(diǎn)集中定位。2013版的“上海故事”網(wǎng)站結(jié)合了更多的圖像元素，網(wǎng)站視覺(jué)界面去除了更多文字?jǐn)⑹觯热鐚?dǎo)航欄下移到近底欄的位置，更大地還原了網(wǎng)頁(yè)的圖形圖像元素，這樣既減少了視覺(jué)焦點(diǎn)的混亂，又起到了突出、強(qiáng)化主體照片的作用，而在選擇圖片上提高了對(duì)清晰度、品質(zhì)的要求。另外在“上海故事”欄目下使用動(dòng)畫幻燈片的形似來(lái)展示圖片圖像，起到了一個(gè)很好的觀看效果，在展示圖片的速度、頻率、切換方式上都具有懷舊的情感流露，模擬觀賞舊電影的感受來(lái)加強(qiáng)對(duì)新老客戶的吸引。考慮到家紡類網(wǎng)站具有產(chǎn)品信息量大的特點(diǎn)，通過(guò)圖像化處理具有聚焦視點(diǎn)的作用。

（2）導(dǎo)航欄目動(dòng)態(tài)化——通過(guò)適當(dāng)?shù)膭?dòng)畫效果進(jìn)行操作提示。網(wǎng)站的導(dǎo)航欄，也就是通俗意義上理解的菜單欄，展示網(wǎng)頁(yè)的基本框架結(jié)構(gòu)。在“上海故事”當(dāng)中，網(wǎng)頁(yè)采用漸隱的方式，通過(guò)鼠標(biāo)滑動(dòng)的行為操作，表現(xiàn)出與用戶的交互反應(yīng)。同時(shí)通過(guò)交互過(guò)程中柔和地呼應(yīng)效果，與整體網(wǎng)站設(shè)計(jì)的輕柔、飄逸特點(diǎn)進(jìn)行強(qiáng)化，考慮到絲綢、絲巾產(chǎn)品的特殊屬性，體現(xiàn)出產(chǎn)品語(yǔ)義學(xué)當(dāng)中的產(chǎn)品特點(diǎn)的轉(zhuǎn)移，起到了很好的效果呈現(xiàn)。

（3）布局形式多樣化——強(qiáng)化布局形式的不同特點(diǎn)來(lái)展示多類分頁(yè)。對(duì)于不同的頁(yè)面內(nèi)容，如家紡網(wǎng)站的產(chǎn)品頁(yè)面和首頁(yè)需要進(jìn)行區(qū)分、家紡產(chǎn)品的篩選頁(yè)面和產(chǎn)品展示效果頁(yè)面也有所不同，因此“上海故事”網(wǎng)站后期增添的網(wǎng)店選擇頁(yè)面，結(jié)合了“單頁(yè)多欄”的頁(yè)面布局，左側(cè)進(jìn)行數(shù)據(jù)篩選，右側(cè)進(jìn)行結(jié)果顯示，經(jīng)典的WINDOWS窗口設(shè)計(jì)原則的完整體現(xiàn)；另外，“上海故事”的產(chǎn)品類型界面通過(guò)與“天貓”界面的跳轉(zhuǎn)鏈接，雖然看似一步減少工作量的操作，實(shí)際強(qiáng)化了產(chǎn)品購(gòu)買的動(dòng)機(jī)，于是顧客或者用戶在訪問(wèn)過(guò)程中，直接參與到了實(shí)際購(gòu)買流程當(dāng)中，起到了多重功效。

4 總結(jié)

網(wǎng)頁(yè)版式設(shè)計(jì)的元素，在簡(jiǎn)單的二維設(shè)計(jì)中，發(fā)揮的是美化、裝飾作用，而在融入了現(xiàn)代互聯(lián)網(wǎng)技術(shù)的基礎(chǔ)上，具有了不可比擬的功能效果，對(duì)企業(yè)網(wǎng)站的交互體驗(yàn)過(guò)程中起到了更多地引導(dǎo)作用，具有重要的參考和實(shí)踐價(jià)值。針對(duì)家紡網(wǎng)站等企業(yè)網(wǎng)站，官方形象具有十分重要的指引作用，因此在設(shè)計(jì)當(dāng)中更需結(jié)合用戶心理、交互體驗(yàn)等多層次內(nèi)容，綜合視覺(jué)、行為、心理等多方面的感官結(jié)合，來(lái)實(shí)現(xiàn)真實(shí)的用戶體驗(yàn)交互機(jī)制。