B2B行業(yè)網(wǎng)站策劃提供給網(wǎng)站設(shè)計師的策劃文檔里，一般都表明了每個部份的內(nèi)容和功能所采用的頁面結(jié)構(gòu)，但是并不代表設(shè)計師就能理解策劃者在頁面結(jié)構(gòu)方面的考慮，以及由于有的策劃者對網(wǎng)絡(luò)了解不太深入，或者說有一些疏忽，從而在頁面結(jié)構(gòu)上考慮的不周全，這個時候設(shè)計師和網(wǎng)站管理者就要對策劃文檔進(jìn)行糾正，所以無論是網(wǎng)站管理者、產(chǎn)品經(jīng)理、設(shè)計師、頁面制作人員，都要對B2B行業(yè)網(wǎng)站的頁面結(jié)構(gòu)進(jìn)行簡要的了解，我們可以不知道怎么去做，但是一定要知道，這樣做是不是對的。下面就B2B行業(yè)網(wǎng)站常用的幾種頁面結(jié)構(gòu)，以及如何綜合使用頁面結(jié)構(gòu)進(jìn)行簡要的講解。
1 B2B行業(yè)門戶網(wǎng)站常用的幾種頁面結(jié)構(gòu)
B2B行業(yè)門戶網(wǎng)站不是企業(yè)網(wǎng)站，也不是全Flash的品牌型網(wǎng)站，具有商業(yè)性、嚴(yán)肅性的特點，一般布局都是中規(guī)中矩的，并不是無規(guī)律排列的排版結(jié)構(gòu)。本研究報告認(rèn)為有如下幾種常用的排版結(jié)構(gòu)：
A 左右結(jié)構(gòu)
左右結(jié)構(gòu)是頁面結(jié)構(gòu)中最常用的，根據(jù)實際情況，又分為左右欄一樣寬、左邊寬、右邊寬幾種結(jié)構(gòu)，具體的尺寸根據(jù)要展示的內(nèi)容來決定，正所謂內(nèi)容決定形式嘛。但是并不是說沒有一定的規(guī)律，一般常用的是左邊寬，因為從用戶和搜索引擎優(yōu)化來講，要把重要的內(nèi)容放在左邊，方便用戶和搜索引擎蜘蛛優(yōu)先找到，尤其是內(nèi)容最終頁，絕大部分的網(wǎng)站都是采用左邊寬，右邊窄的欄目結(jié)構(gòu)。當(dāng)然有時根據(jù)實際情況，比如放左邊的重要內(nèi)容占的空間只能是很窄的，那就只能左邊窄，右邊寬。左右一樣寬的結(jié)構(gòu)，一般很少采用，因為沒有層次感，太呆板。
圖(4) 中國服裝網(wǎng)首頁行業(yè)快訊左右結(jié)構(gòu)顯示(截圖：2011-11-5)
B 左中右結(jié)構(gòu)
左中右結(jié)構(gòu)也是頁面設(shè)計中最常用的，根據(jù)實際情況，又分為左邊和右邊窄，中間寬;左邊和中間一樣寬，右邊窄;左邊窄，中間和右邊一樣寬，這3種情況使用的比較多。在按1024的頁面分辨率來設(shè)計網(wǎng)頁時，左中右結(jié)構(gòu)是用的最多的，因為大部分的內(nèi)容，并不需要象左右結(jié)構(gòu)一樣，占用那么寬的距離，尤其是導(dǎo)航頁面，每個位置都很重要。
圖(5)空調(diào)制冷大市場首頁第一屏左中右結(jié)構(gòu)顯示(截圖：2011-10-5)
C 通欄結(jié)構(gòu)
通欄結(jié)構(gòu)也是最常用的頁面結(jié)構(gòu)，多使用在頁面的頂部和底部，以及導(dǎo)航欄、內(nèi)容需要而采用的B2B行業(yè)網(wǎng)站頁面結(jié)構(gòu)中。比如：在網(wǎng)站頂部的導(dǎo)航欄，即使導(dǎo)航欄的內(nèi)容比較少，我們也是采用通欄的，常常是網(wǎng)站Logo和導(dǎo)航欄成一個整體，以通欄的形式展現(xiàn)，這個就是前面講的習(xí)慣用法。其意義大概是希望讓訪問者將導(dǎo)航欄的內(nèi)容看成一個整體，在視覺上形成一個區(qū)分。底部通欄也是一個道理，在視覺上形成一個整體，保證整站的統(tǒng)一性和完整性。還有一些網(wǎng)站的廣告，希望更突出，吸引用戶的關(guān)注，采用了通欄結(jié)構(gòu)。以及某些內(nèi)容，需要采用通欄來展示，比如圖片展示，滾動展示的內(nèi)容，通欄里的內(nèi)容都是一個整體。
圖(6) 中國服裝網(wǎng)圖庫欄目T臺通欄顯示(截圖：2011-2-6)
2 B2B行業(yè)門戶網(wǎng)站如何綜合應(yīng)用各種頁面結(jié)構(gòu)
在日常的頁面設(shè)計中，我們都是要綜合運用各種頁面結(jié)構(gòu)，把各種標(biāo)題欄根據(jù)不同的實際情況來排版布局，完成頁面的設(shè)計。究竟在何時何處需要采用那種頁面結(jié)構(gòu)，絕大部分的時候，我們都是要根據(jù)頁面的內(nèi)容和功能，綜合采用左右、左中右、通欄結(jié)構(gòu)中至少2種結(jié)構(gòu)的。
A 頂部導(dǎo)航欄下方第一屏重要位置不適宜使用通欄結(jié)構(gòu)
網(wǎng)站策劃者一般都非常重視首頁、一級欄目首頁的第一屏位置規(guī)劃布局，由于用戶的眼球都是從上到下，從左到右往下看的，頁面第一屏離最左邊和頂部45度角的位置以下，是最重要的位置。這些位置由于很重要，用戶很容易看到這些內(nèi)容，希望能多展示一些內(nèi)容，常采用左中右結(jié)構(gòu)，或左右結(jié)構(gòu)，不推薦使用通欄這種占有太多空間的結(jié)構(gòu)，要在左上方將最重要的內(nèi)容和功能推薦給用戶閱讀和使用。
B 網(wǎng)站首頁或二級欄目首頁等導(dǎo)航頁，各種結(jié)構(gòu)要和諧統(tǒng)一
我不贊同使用的框架太多，且要保證上下、左右和諧統(tǒng)一，雖然既有通欄，又有左中右，還有左右結(jié)構(gòu)，但是不必要采用太多不一樣的結(jié)構(gòu)，比如：既有左右結(jié)構(gòu)，又有左中右結(jié)構(gòu)，可以在上下幾個結(jié)構(gòu)之間保持左邊寬度統(tǒng)一，或右邊寬度統(tǒng)一，上下統(tǒng)一的不僅是寬度，標(biāo)題欄的外形也可以是一樣的，看起來不至于太亂。只要是寬度統(tǒng)一的標(biāo)題欄，都可以設(shè)計成一樣的，一個頁面，本報告認(rèn)為外觀效果不一樣的標(biāo)題欄，不超過4個，3個最合適，弱化標(biāo)題欄對用戶視覺上的沖擊，讓它變的更安靜一些。所以我常常對設(shè)計師講，B2B行業(yè)網(wǎng)站的美工其實比做企業(yè)網(wǎng)站要簡單，重要的是你要理解其需要表達(dá)什么。
C 頁面的標(biāo)題欄更多要設(shè)計為方形圓角或直角，但是必須要規(guī)則的
這個在《B2B行業(yè)門戶網(wǎng)站設(shè)計開發(fā)實戰(zhàn)研究報告》前面“設(shè)計基礎(chǔ)”部分已經(jīng)講過了，再簡要講解下。作為企業(yè)網(wǎng)站、時尚類型網(wǎng)站，或者為了表達(dá)時尚、活潑的主題，網(wǎng)站標(biāo)題欄的設(shè)計可以比較活潑一些，多采用圓形或不規(guī)則的排版方式，但是作為B2B行業(yè)網(wǎng)站，就不能這樣去設(shè)計。無論是左右、上下的區(qū)域，每個部分都應(yīng)該是規(guī)則的，使用的圖片、背景都是嚴(yán)謹(jǐn)?shù)?。不能把圖片斜放、用很大的橢圓形、用很大的圖標(biāo)、用卡通的圖標(biāo)等來設(shè)計網(wǎng)站的結(jié)構(gòu)，與平面設(shè)計、企業(yè)網(wǎng)站的設(shè)計有很大的差別。
本小節(jié)雖然是寫給B2B行業(yè)網(wǎng)站的設(shè)計師看的，但是我認(rèn)為一些對網(wǎng)絡(luò)不怎么了解的策劃者，尤其是從事傳統(tǒng)行業(yè)的，也需要學(xué)習(xí)這個內(nèi)容，而且也能看的懂。設(shè)計師一般對我講的這些內(nèi)容，反而都很熟悉了，都懂，但是我們需要的是網(wǎng)站策劃者和網(wǎng)頁設(shè)計師都能透徹理解網(wǎng)站頁面結(jié)構(gòu)與網(wǎng)站頁面設(shè)計的關(guān)系，才能更好的溝通，做出符合用戶需求的網(wǎng)站頁面。
本文原創(chuàng)作者：李學(xué)江，歡迎交流指導(dǎo)咨詢，交流QQ：1580658565。
申請創(chuàng)業(yè)報道，分享創(chuàng)業(yè)好點子。點擊此處，共同探討創(chuàng)業(yè)新機遇！
