電子商務(wù)行業(yè)網(wǎng)站，更多的服務(wù)于企業(yè)的交易需求、了解行業(yè)知識的學(xué)習需求及交流需求，本文作者李學(xué)江認為，這些需求更多還是要通過(guò)文字來(lái)表達和傳遞，不同的字號、顏色、粗細、行距，代表了產(chǎn)品策劃者、網(wǎng)站設計者所期望向網(wǎng)站訪(fǎng)問(wèn)者傳遞的信息。下面來(lái)簡(jiǎn)要講解下在電子商務(wù)行業(yè)網(wǎng)站設計制作時(shí)具有的基準特點(diǎn)。

1 電子商務(wù)行業(yè)網(wǎng)站導航欄文字字體、字號、粗細、顏色的一般標準

導航欄是一個(gè)用戶(hù)來(lái)到頁(yè)面最先看到的部分，要引導用戶(hù)到不同的欄目訪(fǎng)問(wèn)，所以文字要力求突出，這個(gè)在前面效果圖設計時(shí)也講了。

一般標準為：

A 字體：默認字體宋體，導航欄不能采用圖片制作，不利于搜索引擎優(yōu)化，所以只能使用宋體。

B 字號：14PX及以上，由于電子商務(wù)行業(yè)網(wǎng)站的欄目一般不多，大部分不適合像新浪、網(wǎng)易那樣做導航欄，一排欄目，是大部分電子商務(wù)行業(yè)網(wǎng)站設計的習慣。部分也有兩排欄目、三排欄目的，最多2排導航更合理。所以絕大多數情況下，字號要大于等于14PX，放二排時(shí)一部分有一級欄目導航和二級欄目導航，二級欄目的字號可以小一些，最小13PX。

C 粗細：如果導航欄只有一排，絕大部分情況下，都要加粗，如果把一級欄目和二級欄目都寫(xiě)在導航條上，用二排顯示，一般只加粗一級欄目。

D 顏色：根據頁(yè)面效果圖來(lái)制作，如果導航欄有背景，文字顏色必須要用與背景有很強對比的顏色。

圖（92） 華人螺絲網(wǎng)（www.luosi.com）二排導航欄

上面網(wǎng)站二排導航欄，字號為14PX，一級導航欄已加粗，重點(diǎn)欄目用了更吸引眼球的橙色，一部分的電子商務(wù)行業(yè)網(wǎng)站也是采用的是這種導航方式。

圖（93） 醫藥網(wǎng)（www.pharmnet.com.cn）導航欄

上面網(wǎng)站的導航欄，字號為14PX，加粗，顏色為與背景色對比很強的白色，重點(diǎn)欄目變色顯示，這樣的導航方式是絕大部分電子商務(wù)行業(yè)網(wǎng)站采用的方式。

2 電子商務(wù)行業(yè)網(wǎng)站標題欄文字字體、字號、粗細、顏色的一般標準

標題欄是一個(gè)頁(yè)面框架設計中最重要的部分，也是需要設計最多的地方，我們設計一個(gè)頁(yè)面，除了內容設計，基本都是在設計標題欄，在頁(yè)面效果圖設計部分也講的很詳細了，這里從標題欄上的文字入手，精確到字體、字號、粗細、顏色來(lái)簡(jiǎn)要講解。

一般標準為：

A 字體：大部分時(shí)候都默認為宋體，因為現在設計網(wǎng)頁(yè)，大家都喜歡在標題欄的文字上加鏈接，直接鏈接到二級或一級欄目的更多內容，文字都不是圖片表達的，有的也用CSS來(lái)設計一些效果。所以除了一些對效果要求比較高的標題欄以外，我們都只使用所有瀏覽器都能正常顯示的宋體。如果要制作標題欄圖片，可以用一些嚴肅的、商業(yè)化一些的字體。

B 字號：14PX，基本沒(méi)有多少例外，絕大部分的標題欄文字大小都不能低于14PX，有時(shí)會(huì )更大一些，但是絕大多數情況下都不能小于14PX。曾經(jīng)一個(gè)設計師給我他設計的網(wǎng)頁(yè)，我怎么看都覺(jué)得不對，后來(lái)才發(fā)現，原來(lái)他的標題欄都是使用12PX加粗的，看起來(lái)沒(méi)有層次感，每一個(gè)內容塊之間區分度不夠。

C 粗細：必須加粗，基本沒(méi)有例外。

D 顏色：根據頁(yè)面效果圖的顏色而定，文字顏色仍然必須要用與背景有很強對比的顏色。

3 電子商務(wù)行業(yè)網(wǎng)站導航頁(yè)“普通內容”鏈接字號、粗細、行距、顏色的一般標準

導航頁(yè)一般指網(wǎng)站首頁(yè)，一級欄目首頁(yè)等頁(yè)面，導航頁(yè)內絕大部分的內容都有超鏈接，訪(fǎng)問(wèn)者根據鏈接標題尋找自己感興趣的內容，所以?xún)热萱溄拥脑O計就變的非常重要。

一般標準為：

A 字號：12PX，也可以采用13PX，絕大部分時(shí)候是12PX。

B 粗細：細體，不加粗。

C 行距：一般是20PX，最高不超過(guò)23PX，最低不低于18PX，否則要么太高，要么太低。

D 顏色：絕大部分情況為黑色，代碼為：#000000—#333333，為了保護視覺(jué)，也有采用灰色的，顏色代碼為#444444或#555555。

4 電子商務(wù)行業(yè)網(wǎng)站導航頁(yè)“推薦內容”鏈接字號、粗細、行距、顏色一般標準

為了讓內容有主次之分，將重點(diǎn)的內容，讀者可能感興趣的內容讓讀者優(yōu)先發(fā)現，節省用戶(hù)去尋找內容的時(shí)間，提高網(wǎng)站黏性，對于資訊、技術(shù)文章、博客、問(wèn)答等內容，在網(wǎng)站首頁(yè)、一級欄目首頁(yè)都要有編輯推送的內容，這些推薦內容與普通的內容鏈接樣式是具有很大不同的。

一般標準為：

A 字號：大部分都是14PX，對于某個(gè)欄目每天或一段時(shí)間重點(diǎn)推薦的一條內容，標題會(huì )更大，一般是16PX-20PX。

B 粗細：絕大部分情況下，絕對是加粗的，我曾經(jīng)見(jiàn)到一個(gè)設計師設計的網(wǎng)站，推薦的資訊，雖然字號比較大，但是卻沒(méi)有加粗，沒(méi)有達到引起訪(fǎng)問(wèn)者重點(diǎn)關(guān)注的效果。

C 行距：120%以上，一般為150%，否則字大了，上下的距離太緊了，甚至顯示不完全。

D 顏色：與普通內容鏈接的顏色一般是不一樣的，使用黑色、紅色、藍色等，為了達到更突出的效果，不僅從字號、粗細等角度突出，還會(huì )使用更吸引眼球的亮色（紅色、橙色、藍色等顏色）。

5 電子商務(wù)行業(yè)網(wǎng)站列表頁(yè)“產(chǎn)品名稱(chēng)”鏈接字號、粗細、行距、顏色一般標準

在列表頁(yè)，產(chǎn)品名稱(chēng)、公司名稱(chēng)都會(huì )比頁(yè)面其他字體顯眼一些，在前面效果圖設計時(shí)也講過(guò)，主要是針對采購商會(huì )優(yōu)先關(guān)注產(chǎn)品名稱(chēng)，挑選到自己想要的產(chǎn)品，才會(huì )進(jìn)一步去看產(chǎn)品的介紹、產(chǎn)地等詳情，那么除產(chǎn)品名稱(chēng)以外的內容就需要弱化。

一般標準為：

A 字號：大部分都是14PX，也可為13PX。

B 粗細：加粗。

C 行距：150%。

D 顏色：與輔助內容顏色不一樣，一般不用黑色，用藍色比較多一些。

圖（94） 阿里巴巴產(chǎn)品列表頁(yè)

圖（94）為阿里巴巴產(chǎn)品列表頁(yè)面截圖，產(chǎn)品名稱(chēng)字號為14PX，藍色，加粗，標題以外的大部分內容都是灰色，弱化了。

寶雞世紀網(wǎng)絡(luò )