喬巍

[摘要]本文主要闡述了在電子商務(wù)網(wǎng)站開發(fā)設(shè)計(jì)過(guò)程中，優(yōu)秀的導(dǎo)航條設(shè)計(jì)能夠通過(guò)顏色、排版、形狀和一些圖片來(lái)幫助網(wǎng)站創(chuàng)造更好的視覺(jué)和感受。同時(shí)，筆者也探討了基于CSS的導(dǎo)航條設(shè)計(jì)的幾個(gè)優(yōu)點(diǎn)，并舉例說(shuō)明了幾種常見的CSS導(dǎo)航菜單的設(shè)計(jì)。

[關(guān)鍵詞]CSS商務(wù)網(wǎng)站導(dǎo)航條

電子商務(wù)網(wǎng)站按照商務(wù)目的和業(yè)務(wù)功能可以分為四類：基本型商務(wù)網(wǎng)站、宣傳型商務(wù)網(wǎng)站、客戶服務(wù)型商務(wù)萬(wàn)展、完全電子商務(wù)運(yùn)作型網(wǎng)站，不管是哪種類型的電子商務(wù)網(wǎng)站，其目的都是為了宣傳企業(yè)形象，提升品牌價(jià)值，從而實(shí)現(xiàn)企業(yè)價(jià)值最大化。而導(dǎo)航條的設(shè)計(jì)在網(wǎng)站設(shè)計(jì)中是起到?jīng)Q定性作用的，它是網(wǎng)站設(shè)計(jì)的關(guān)鍵元素。

一、電子商務(wù)網(wǎng)站的基本特點(diǎn)

1.網(wǎng)站的信息量大

在傳統(tǒng)的宣傳方式中，企業(yè)一般都會(huì)制作相應(yīng)的宣傳冊(cè)或在報(bào)刊、雜志、電視等媒體上做廣告，但若大面積地宣傳覆蓋，則會(huì)受限于成本、精力等因素。而這些，在網(wǎng)絡(luò)上只要主機(jī)空間和訪問(wèn)速度滿足的前提下，理論上可以放入無(wú)限的跟企業(yè)相關(guān)的信息，譬如，企業(yè)的產(chǎn)品信息、服務(wù)信息、品牌文化等等。

2.內(nèi)容及版面的更新需及時(shí)

商務(wù)網(wǎng)站必須保持經(jīng)常性的更新，這里所指的更新，包括版面的更新和內(nèi)容的更新。內(nèi)容的更新可以不斷吸引瀏覽者再次光臨，使?jié)撛诘南M(fèi)者變成客戶，增強(qiáng)客戶對(duì)企業(yè)網(wǎng)站的粘性，提高客戶的忠誠(chéng)度；版面的更新可以針對(duì)某次新產(chǎn)品的發(fā)布或者某次重大的活動(dòng)，如果網(wǎng)站一成不變，是無(wú)法獲得更多的瀏覽者的關(guān)注，也就無(wú)法獲得更多的商業(yè)機(jī)會(huì)的。因此，企業(yè)網(wǎng)站的更新維護(hù)是一個(gè)很重要的網(wǎng)絡(luò)營(yíng)銷手段，必須高度重視這一點(diǎn)，保持網(wǎng)站的持續(xù)更新。

3.突破了時(shí)間和空間的限制

從時(shí)間概念上看，在企業(yè)的電子商務(wù)網(wǎng)站上，客戶每天24小時(shí)都可以獲取他們需要的產(chǎn)品或服務(wù)，而這些，傳統(tǒng)的的八小時(shí)工作制根本沒(méi)有辦法滿足他們的要求。

從空間概念上看，傳統(tǒng)的商務(wù)活動(dòng)受限于地域位置，而電子商務(wù)網(wǎng)站依存于Internet虛擬的空間，即使處于不同國(guó)家的企業(yè)和消費(fèi)者，都可以通過(guò)這個(gè)平臺(tái)實(shí)現(xiàn)聯(lián)系。

二、優(yōu)秀導(dǎo)航設(shè)計(jì)的基本特征

1.結(jié)構(gòu)清晰、瀏覽者能夠迅速定位信息

電子商務(wù)網(wǎng)站的信息量大，分類繁雜，因此，好的導(dǎo)航設(shè)計(jì)，就必須是結(jié)構(gòu)清晰的，使得消費(fèi)者在海量的信息中能夠迅速地定位他們所需要的信息，那么，這樣才能使這些潛在的客戶逐漸轉(zhuǎn)變成你的目標(biāo)客戶，同時(shí)，結(jié)構(gòu)清晰的導(dǎo)航設(shè)計(jì)也能體現(xiàn)一定的專業(yè)性，提高客戶的信任度。

2.便于更改或者添加新的網(wǎng)站模塊

對(duì)于企業(yè)的每次版面更新，好的導(dǎo)航設(shè)計(jì)能夠在不破壞網(wǎng)站整體風(fēng)格的前提下，非常方便地進(jìn)行諸如更改導(dǎo)航設(shè)計(jì)，添加新的導(dǎo)航項(xiàng)目等操作。

3.智能地適應(yīng)消費(fèi)者不同的瀏覽環(huán)境

電子商務(wù)活動(dòng)突破了時(shí)間和空間的限制，好的導(dǎo)航設(shè)計(jì)需要真實(shí)地還原設(shè)計(jì)者的思想，需要它是智能的，對(duì)于不同瀏覽環(huán)境的消費(fèi)者而言，都顯示同一個(gè)效果。不能因?yàn)樵O(shè)備屏幕或者瀏覽平臺(tái)的不同，而產(chǎn)生不同的瀏覽效果。

三、CSS概念及其制作導(dǎo)航條優(yōu)勢(shì)分析

1.CSS的概念

CSS，稱之為層疊樣式表（Cascading Stylesheet），用以格式化網(wǎng)頁(yè)的格式。在網(wǎng)頁(yè)制作時(shí)采用CSS技術(shù)，可以有效地對(duì)頁(yè)面的布局、字體、顏色、背景和其他效果實(shí)現(xiàn)更加精確的控制。只要對(duì)相應(yīng)的代碼做一些簡(jiǎn)單的修改，就可以改變外鏈該CSS文件的一個(gè)或者多個(gè)頁(yè)面的樣式。

2.CSS制作導(dǎo)航條的優(yōu)勢(shì)分析

（1）代碼冗余少，更快下載速度。利用CSS和XHTML制作的導(dǎo)航菜單，其代碼冗余少，同時(shí)，純代碼的下載速度肯定比使用Javascrip或圖片來(lái)實(shí)現(xiàn)的要快得多。另外，因?yàn)榫W(wǎng)絡(luò)蜘蛛對(duì)文本的興趣要遠(yuǎn)高于圖片，它會(huì)更有益于搜索引擎的索引排名，提高網(wǎng)站被訪問(wèn)的命中率。

（2）適應(yīng)力強(qiáng)，更多人文關(guān)懷?；贑SS的導(dǎo)航菜單適應(yīng)力強(qiáng)，可以應(yīng)付不同用戶的瀏覽平臺(tái)。同時(shí)，如果用戶關(guān)閉讀取圖片和(或)CSS的功能，網(wǎng)站仍然可以以簡(jiǎn)潔的方式瀏覽，網(wǎng)站的訪問(wèn)不會(huì)受到影響。

（3）網(wǎng)絡(luò)資源多，更多設(shè)計(jì)選擇。對(duì)于初次使用CSS進(jìn)行導(dǎo)航設(shè)計(jì)的設(shè)計(jì)師來(lái)講，如果不想從零開始編寫CSS菜單代碼，則可以在網(wǎng)絡(luò)上搜索設(shè)計(jì)好的基于CSS的導(dǎo)航菜單，然后再加以修改部分代碼以適應(yīng)自己開發(fā)網(wǎng)站的總體風(fēng)格。同時(shí)，還有一些專門設(shè)計(jì)CSS菜單的工具，譬如，CSS MENU就可以通過(guò)修改一些自定義樣式來(lái)快速生成專業(yè)的CSS菜單。

四、利用CSS來(lái)制作幾種常見的導(dǎo)航條

導(dǎo)航條的制作標(biāo)簽一般采用無(wú)序列表，形如

• 超鏈接文本

；在

標(biāo)簽里面設(shè)置好各導(dǎo)航項(xiàng)后，就可以用CSS去描述導(dǎo)航超鏈接的各種狀態(tài)，通用的代碼如下所示（本例僅用了1KB不到的GIF圖片）。

在上面通用代碼的基礎(chǔ)上，再稍加變化，就可以制作出二級(jí)菜單、多級(jí)菜單，以下是幾種常見的導(dǎo)航條樣式。

參考文獻(xiàn)：

[1] Dan Cederholm.Web標(biāo)準(zhǔn)實(shí)戰(zhàn).人民郵電出版社，2008，（5）

[2]Dan Cederholm.無(wú)懈可擊的Web設(shè)計(jì).清華大學(xué)出版社，2009，（4）