淺析網(wǎng)站構(gòu)建中信息引導(dǎo)與界面元素的構(gòu)建原理及關(guān)系

胡堯　楊雋

摘 要：在企業(yè)的網(wǎng)站建設(shè)中不單只考慮到使企業(yè)的網(wǎng)站成為專業(yè)的宣傳營銷平臺(tái)，還應(yīng)考慮到企業(yè)網(wǎng)上形象與網(wǎng)下形象的統(tǒng)一性。企業(yè)的網(wǎng)站營銷始于網(wǎng)站策劃，網(wǎng)站策劃的好壞直接影響到網(wǎng)站運(yùn)作的效果，而網(wǎng)站中信息的順勢(shì)引導(dǎo)對(duì)于網(wǎng)站的運(yùn)作至關(guān)重要。網(wǎng)站是企業(yè)展示形象、介紹產(chǎn)品和服務(wù)、體現(xiàn)其發(fā)展戰(zhàn)略的重要途徑，也是借助Internet傳播文化的重要窗口，其界面元素的排列方式、色彩甚至是文字字體、大小都可向用戶提供相關(guān)信息，加強(qiáng)與客戶之間的交流，網(wǎng)站信息引導(dǎo)的建立離不開對(duì)界面元素的解碼。

關(guān)鍵詞：信息引導(dǎo)；網(wǎng)站；界面元素

1 網(wǎng)站信息的構(gòu)建分析圖

網(wǎng)站信息的歸納、提取及選擇，離不開對(duì)社會(huì)、經(jīng)濟(jì)及環(huán)境的依賴，在每個(gè)層面上提取相關(guān)要素，綜合成圖表為網(wǎng)站信息構(gòu)建提供集成化。以下為市場(chǎng)信息歸納示意圖。

2 上海故事：家紡網(wǎng)站信息引導(dǎo)與界面元素的關(guān)系

通過瀏覽整個(gè)企業(yè)的網(wǎng)站，從整流流程設(shè)計(jì)到細(xì)節(jié)設(shè)計(jì)，可以歸納出上海故事的網(wǎng)站設(shè)計(jì)的主要特點(diǎn)：

2.1 網(wǎng)站整體風(fēng)格一致

高貴典雅，并且與企業(yè)設(shè)定的品牌風(fēng)格相呼應(yīng)，從頁面色彩、頁面排式細(xì)化到頁面字體種類、字體大小、字體顏色等都符合上海故事這個(gè)品牌時(shí)尚、經(jīng)典、溫暖及頗具上海的風(fēng)情。

2.2 目標(biāo)明確，主題鮮明

上海故事的網(wǎng)站清楚地展示了公司形象，同時(shí)也為訪問者發(fā)布公司信息和提供服務(wù)，宣傳公司產(chǎn)品和相關(guān)周邊產(chǎn)品，符合商業(yè)網(wǎng)站建設(shè)的要求。

2.3 設(shè)計(jì)布局合理

上海故事的網(wǎng)頁布局設(shè)計(jì)在有限的空間內(nèi)，合理安排組成網(wǎng)頁的各種元素的位置，包含頁面標(biāo)題、網(wǎng)站標(biāo)志、頁眉、導(dǎo)航欄、內(nèi)容版塊和頁腳等部分，并且使頁面呈現(xiàn)了美觀的視覺效果，達(dá)到視覺和藝術(shù)效果的統(tǒng)一；同時(shí)把網(wǎng)頁要表達(dá)的信息有效地傳達(dá)給瀏覽者，以網(wǎng)站主題和頁面內(nèi)容為依據(jù)，以準(zhǔn)確、有效地表達(dá)信息為目標(biāo)，通過清晰的對(duì)比和簡(jiǎn)潔的說明完成形式上的布局，達(dá)到了形式與內(nèi)容的統(tǒng)一。

2.4 等待中的進(jìn)程設(shè)計(jì)

在進(jìn)入到首頁之前有一段簡(jiǎn)短的flash視頻動(dòng)畫廣告，這樣的一個(gè)動(dòng)畫相對(duì)其他程序來說是非常占網(wǎng)速的，相對(duì)于其他網(wǎng)站的不做提醒和數(shù)字提醒的過程設(shè)計(jì)，上海故事巧妙地運(yùn)用了圖形變化的形式來提醒，這樣用戶在等待過程中不再煩躁不安，而是好奇等待。

2.5 無動(dòng)畫廣告的煩擾

許多網(wǎng)站為了達(dá)到推廣網(wǎng)站和產(chǎn)品的目的，不斷地在頁面當(dāng)中添加浮動(dòng)廣告或者動(dòng)畫廣告，這不僅造成網(wǎng)速的極大受阻，同時(shí)也會(huì)使得用戶在操作過程中的困擾。而上海故事的網(wǎng)站當(dāng)中，很少有這些小廣告的出現(xiàn)。

2.6 圖片注釋

在很多網(wǎng)站上，我們都可以找到一個(gè)共同的缺點(diǎn)，當(dāng)網(wǎng)速慢時(shí)有很多圖片都無法顯示，又沒有注解時(shí)，會(huì)使得用戶反感，假如在注冊(cè)時(shí)的按鈕是圖片做的又沒加圖片注解，就會(huì)導(dǎo)致連注冊(cè)都找不到，而上海故事在每個(gè)圖片旁都增加了注解，很好地解決了這些問題。

3 同類家紡網(wǎng)站設(shè)計(jì)過程中信息引導(dǎo)誤區(qū)

雖然上海故事頗具自身企業(yè)的風(fēng)格，設(shè)計(jì)方面也有自己獨(dú)立的特點(diǎn)，但是不可否認(rèn)，整個(gè)網(wǎng)站設(shè)計(jì)當(dāng)中仍然存在不少問題，根據(jù)設(shè)計(jì)需求和設(shè)計(jì)合理性，發(fā)現(xiàn)存在以下幾個(gè)問題：

3.1 頁面色彩與生理特征上的矛盾

不可否認(rèn)，以上海故事為代表的網(wǎng)站設(shè)計(jì)風(fēng)格和自身企業(yè)的形象有著非常高的融合度，黑底紅頁的設(shè)計(jì)搭配雖然有著溫暖成熟的韻味。但是相關(guān)高純度、高亮度對(duì)比地使用純色實(shí)際上很容易造成用戶的視覺疲勞。

3.2 圖片數(shù)量與識(shí)別效果的矛盾

在產(chǎn)品展示頁面當(dāng)中，對(duì)于產(chǎn)品圖片的處理辦法一般是：圖片在左，數(shù)據(jù)在右。在有限的界面內(nèi)，數(shù)據(jù)和圖片地占據(jù)同樣大小的位置空間，可以看到對(duì)于文字剛好合適的空間中放入擁有細(xì)節(jié)的產(chǎn)品圖片，是難以體現(xiàn)產(chǎn)品的設(shè)計(jì)細(xì)節(jié)和獨(dú)特之處的，而對(duì)于意欲購買的客戶來說，對(duì)產(chǎn)品實(shí)物圖的關(guān)注程度通常會(huì)大于對(duì)數(shù)據(jù)的關(guān)注，因?yàn)榭蛻粼诖蟪潭壬希Ｍㄟ^對(duì)比實(shí)物來決定購買與否，這樣一張面積小同時(shí)像素不高的圖片，實(shí)在難以滿足挑選需求。

3.3 信息與表達(dá)方式的不協(xié)調(diào)

在整個(gè)頁面的排版當(dāng)中，有不少地方涉及了大量信息的羅列，如銷售分布部分，上海故事的處理是將所有的歷史事件按照時(shí)間順序列舉。而其實(shí)從用戶角度，一些表格、圖標(biāo)、地圖的形式的運(yùn)用會(huì)更好地提升閱讀速度與效果。

3.4 尺寸與操作性的矛盾

通過多次重復(fù)的使用和點(diǎn)擊發(fā)現(xiàn)，由于目標(biāo)點(diǎn)擊區(qū)域的尺寸過于窄小，鼠標(biāo)指向?qū)Ш綑跁r(shí)十分困難，這是因?yàn)闊狳c(diǎn)區(qū)域過小造成的操作性障礙。對(duì)于一個(gè)成熟的網(wǎng)站來說，便利舒適的操作是十分必要的，這不僅影響到用戶獲取信息的意愿，甚至?xí)斐蓪?duì)整個(gè)網(wǎng)站的消極的印象。因此，一些按鍵、按鈕及鏈接，其實(shí)適當(dāng)增大字體或尺寸是有益的。

3.5 導(dǎo)航欄層級(jí)區(qū)別不明顯

根據(jù)不少網(wǎng)站的瀏覽發(fā)現(xiàn)，如果導(dǎo)航欄在顏色、字體還是對(duì)比程度上，兩者都是非常接近的，這樣缺乏明顯區(qū)別的設(shè)計(jì)，將不利于用戶操作認(rèn)知，容易造成感知上的混亂和不解，往往會(huì)將重要信息誤導(dǎo)或忽略。

4 結(jié)語

整個(gè)切入點(diǎn)的目標(biāo)主體：以網(wǎng)站設(shè)計(jì)為中心，前鋪墊市場(chǎng)調(diào)研和分析，提出需求分析，隨后結(jié)合具體網(wǎng)站，經(jīng)過對(duì)“上海故事”等優(yōu)秀案例的分析補(bǔ)充，實(shí)現(xiàn)對(duì)目標(biāo)網(wǎng)站的全面分析，使得切入點(diǎn)的分析既具有廣度又具有深度。