(樂(lè)購(gòu)網(wǎng)專欄 作者:李學(xué)江)在B2B行業(yè)網(wǎng)站的框架設(shè)計(jì)制作過(guò)程中,標(biāo)題欄設(shè)計(jì)制作是工作量最大的,頁(yè)面框架中最多的。網(wǎng)站Logo和導(dǎo)航條的設(shè)計(jì),基本每個(gè)頁(yè)面都是和首頁(yè)一樣的,相比之下工作量會(huì)小很多。無(wú)論是網(wǎng)站首頁(yè)、二級(jí)欄目頁(yè),還是導(dǎo)航頁(yè)、內(nèi)容最終頁(yè),優(yōu)秀的標(biāo)題欄總能讓讀者方便快捷的找到想閱讀的內(nèi)容,又不會(huì)對(duì)頁(yè)面內(nèi)容產(chǎn)生干擾作用。
1 B2B行業(yè)網(wǎng)站標(biāo)題欄設(shè)計(jì)的一般標(biāo)準(zhǔn)
B2B行業(yè)網(wǎng)站與一般的商業(yè)門戶網(wǎng)站在標(biāo)題欄設(shè)計(jì)上大部分是相同的,但是由于B2B行業(yè)網(wǎng)站更多的訪問(wèn)者和使用者是在辦公室學(xué)習(xí)和工作的,需要更嚴(yán)肅的氛圍,他們需要的更多是商機(jī)信息、行業(yè)資訊、行業(yè)技術(shù)知識(shí)等內(nèi)容,而不是娛樂(lè)和休閑。同時(shí)和企業(yè)網(wǎng)站標(biāo)題欄設(shè)計(jì)具有很大的區(qū)別,頁(yè)面不需要通過(guò)標(biāo)題欄的顏色和外形來(lái)突出產(chǎn)品的特色及品牌文化,所以B2B行業(yè)網(wǎng)站要弱化標(biāo)題欄的圖片和顏色,不要對(duì)訪問(wèn)者獲得內(nèi)容造成影響,一般標(biāo)準(zhǔn)如下。
1.1 標(biāo)題欄上的字要比網(wǎng)頁(yè)上的大部分的內(nèi)容字號(hào)更大一些,加粗,要更突出一些
也許大家覺(jué)得這個(gè)標(biāo)準(zhǔn)誰(shuí)都知道,但是在我的實(shí)際工作中,以及接受很多人的咨詢過(guò)程中,看到過(guò)一些網(wǎng)站,以及一些設(shè)計(jì)師給我的頁(yè)面標(biāo)題欄上的字就和內(nèi)容上的字一樣大,都為12PX加粗,也許是他們無(wú)心,也許是他們覺(jué)得已經(jīng)加粗了,但是從這里看出,一些人還是沒(méi)有上升到理論的層面,憑感覺(jué)。一般為字號(hào)為:14PX,加粗。

圖(45) 中農(nóng)網(wǎng)首頁(yè)資訊部分標(biāo)題欄
如上圖所示,為中農(nóng)網(wǎng)(www.ap88.com)首頁(yè)資訊部分標(biāo)題欄,從標(biāo)題欄可以看出,農(nóng)業(yè)要聞、圖片新聞、農(nóng)資資訊幾個(gè)字,都要比下面的未推薦的文章標(biāo)題的字要大,當(dāng)前選中部分已加粗,讓訪問(wèn)者明白,現(xiàn)在所看到的是當(dāng)前加粗的農(nóng)業(yè)要聞部分。所以標(biāo)題欄加粗、字號(hào)更大是所有頁(yè)面設(shè)計(jì)者、網(wǎng)站測(cè)試者必須要明確的基本標(biāo)準(zhǔn)。當(dāng)然對(duì)內(nèi)容中重點(diǎn)推薦標(biāo)題,可以比標(biāo)題欄字號(hào)更大。

圖(46) 某服裝網(wǎng)站的標(biāo)題欄,字號(hào)未變大,未加粗,沒(méi)有層次感
如上圖所示,為某服裝網(wǎng)站的標(biāo)題欄,就是不規(guī)范的,標(biāo)題欄上的字既沒(méi)有加粗,也沒(méi)有變大,頁(yè)面看起來(lái)沒(méi)有層次感。這個(gè)方面報(bào)紙、期刊、書(shū)籍的排版做的最好,要向他們學(xué)習(xí),讓訪問(wèn)者更好的尋找內(nèi)容,有更好的閱讀體驗(yàn)。
1.2 標(biāo)題欄無(wú)論怎么設(shè)計(jì),字無(wú)論采用了什么效果,都必須非常清晰,不能花哨
根據(jù)網(wǎng)頁(yè)的主題,內(nèi)容的種類,不同頁(yè)面的標(biāo)題欄會(huì)設(shè)計(jì)成不同的效果,但是無(wú)論我們?cè)趺丛O(shè)計(jì),都必須要使標(biāo)題欄上的字看起來(lái)很清楚、明白,使訪問(wèn)者一目了然,不能為了更好看,更有藝術(shù)效果,而使字看起來(lái)不清楚、不突出。
更重要的是,由于B2B行業(yè)網(wǎng)站的頁(yè)面要更嚴(yán)肅,標(biāo)題欄的字,圖片和顏色,都要看起來(lái)更嚴(yán)肅一些,不能太花哨,太漂亮,簡(jiǎn)潔大方更好。

圖(47) 某行業(yè)網(wǎng)站首頁(yè)會(huì)員推薦標(biāo)題欄
如圖(47)是某行業(yè)網(wǎng)站首頁(yè)會(huì)員推薦標(biāo)題欄,標(biāo)題欄上“會(huì)員推薦”幾個(gè)字就不清楚,其實(shí)只要做一些簡(jiǎn)單的調(diào)整,把字上下居中顯示,把背景顏色再深一些,字做點(diǎn)效果,就會(huì)更清楚一些。
1.3 標(biāo)題欄上不能大面積使用刺眼的顏色,不能太突出,干擾用戶尋找內(nèi)容
B2B行業(yè)網(wǎng)站的首頁(yè)、一級(jí)欄目、二級(jí)欄目、內(nèi)容頁(yè)等頁(yè)面,訪問(wèn)者需要從頁(yè)面里尋找大量自己感興趣的內(nèi)容,與專題頁(yè)面、企業(yè)網(wǎng)站等不同,尤其是品牌企業(yè)網(wǎng)站的內(nèi)容不多,需要通過(guò)顏色、字體、外形等來(lái)渲染產(chǎn)品的品牌特色,可以大面積使用顏色作為標(biāo)題欄的背景色,采用很大的字號(hào),不會(huì)喧賓奪主,會(huì)給訪問(wèn)者建立一個(gè)氛圍。

圖(48) 中國(guó)服裝網(wǎng)資訊欄目標(biāo)題欄
從圖(48)可以看出,標(biāo)題欄使用了藍(lán)色,由于標(biāo)題欄太長(zhǎng),所以不能使用很深的藍(lán)色,而是采用了藍(lán)色的漸變色,這樣就弱化了標(biāo)題欄的視覺(jué)沖擊力,讓訪問(wèn)者更關(guān)注內(nèi)容。正如我在《B2B行業(yè)門戶網(wǎng)站策劃實(shí)戰(zhàn)研究報(bào)告》里講過(guò),凡是成功的B2B行業(yè)網(wǎng)站,絕大部分都有很好的頁(yè)面設(shè)計(jì)功底,我們要多學(xué)習(xí)成功的行業(yè)網(wǎng)站。
1.4 標(biāo)題欄應(yīng)與所包含的內(nèi)容形成一個(gè)整體,在視覺(jué)上形成區(qū)別
每一個(gè)標(biāo)題欄下面所屬的內(nèi)容都代表一個(gè)細(xì)分的內(nèi)容,標(biāo)題欄起到的作用就是希望訪問(wèn)者能盡快找到自己感興趣的內(nèi)容,要達(dá)到這個(gè)目的,就要用標(biāo)題欄和邊框?qū)?nèi)容包圍起來(lái),形成一個(gè)整體,讓訪問(wèn)者從視覺(jué)上更能區(qū)分自己正在看的是什么種類的信息。

圖(49) 新浪網(wǎng)財(cái)經(jīng)欄目首頁(yè)切換的標(biāo)題欄
如圖(49)新浪網(wǎng)財(cái)經(jīng)欄目首頁(yè)切換的標(biāo)題欄,從“商品-貨幣”部分切換到“滾動(dòng)新聞”部分,不僅文字變了,文字下的背景也變成了白色,和下面的內(nèi)容形成封閉的整體。如果切換過(guò)去,文字下面的顏色還是淺藍(lán)色,就形成不了一個(gè)整體。
1.5 標(biāo)題欄的角不能太圓、太卡通,背景不能用太鮮艷的花紋,不能用橢圓形
B2B行業(yè)網(wǎng)站需要更嚴(yán)肅一些的風(fēng)格,所以標(biāo)題欄切忌圓角太圓,也不能用太鮮艷的花紋作為背景,甚至使用橢圓形的。在我多年的工作經(jīng)驗(yàn)中,看到過(guò)一些設(shè)計(jì)師提供的B2B行業(yè)網(wǎng)站頁(yè)面標(biāo)題欄圓角太圓,這種設(shè)計(jì)給人很不嚴(yán)肅的氛圍,有一點(diǎn)圓角就可以了。在設(shè)計(jì)一些比較有特點(diǎn)的企業(yè)網(wǎng)站或品牌網(wǎng)站時(shí),以及大家看到的QQ空間、51空間等個(gè)人主頁(yè)可以使用一些個(gè)性化的標(biāo)題欄,但是在B2B行業(yè)網(wǎng)站不能使用。這個(gè)就是網(wǎng)站定位與設(shè)計(jì)的聯(lián)系所在。
以上講的幾點(diǎn),雖然道理很淺顯,大家一看都覺(jué)得很簡(jiǎn)單,大部分的設(shè)計(jì)師在設(shè)計(jì)的時(shí)候都能在潛意識(shí)里遵守這些標(biāo)準(zhǔn)。但是《B2B行業(yè)門戶網(wǎng)站設(shè)計(jì)開(kāi)發(fā)實(shí)戰(zhàn)研究報(bào)告》認(rèn)為,總有一些設(shè)計(jì)師他有時(shí)會(huì)犯以上錯(cuò)誤中的一個(gè)或幾個(gè),作為網(wǎng)站的產(chǎn)品經(jīng)理、產(chǎn)品測(cè)試者、網(wǎng)站管理人員,必須要能懂得這些細(xì)節(jié),在產(chǎn)品開(kāi)發(fā)過(guò)程中及時(shí)的糾正這些問(wèn)題。
推薦閱讀
甲骨文CEO薪酬高達(dá)9600萬(wàn)美元 大部分來(lái)自期權(quán)
甲骨文CEO 拉里·埃里森 9月24日消息,據(jù)國(guó)外媒體報(bào)道,甲骨文創(chuàng)始人兼CEO拉里·埃里森(Larry Ellison)是世界是最富有的人之一。據(jù)公司向美國(guó)證券交易委員會(huì)(SEC)提交的文件顯示,埃里森2012財(cái)年的薪酬達(dá)到了9620萬(wàn)美>>>詳細(xì)閱讀
本文標(biāo)題:B2B行業(yè)網(wǎng)站標(biāo)題欄設(shè)計(jì)的一般標(biāo)準(zhǔn)
地址:http://m.sdlzkt.com/a/b2b/20120924/86781.html