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)肅性的特點(diǎ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)，一般很少采用，因為沒有層次感，太呆板。
B 左中右結(jié)構(gòu)
左中右結(jié)構(gòu)也是頁面設(shè)計中最常用的，根據(jù)實際情況，又分為左邊和右邊窄，中間寬；左邊和中間一樣寬，右邊窄；左邊窄，中間和右邊一樣寬，這3種情況使用的比較多。在按1024的頁面分辨率來設(shè)計網(wǎng)頁時，左中右結(jié)構(gòu)是用的最多的，因為大部分的內(nèi)容，并不需要象左右結(jié)構(gòu)一樣，占用那么寬的距離，尤其是導(dǎo)航頁面，每個位置都很重要。
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)容都是一個整體。
2 B2B行業(yè)門戶網(wǎng)站如何綜合應(yīng)用各種頁面結(jié)構(gòu)
在日常的頁面設(shè)計中，我們都是要綜合運(yùn)用各種頁面結(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ù)摹２荒馨褕D片斜放、用很大的橢圓形、用很大的圖標(biāo)、用卡通的圖標(biāo)等來設(shè)計網(wǎng)站的結(jié)構(gòu)，與平面設(shè)計、企業(yè)網(wǎng)站的設(shè)計有很大的差別。
雖然是寫給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)站頁面。
推薦閱讀
盤點(diǎn)2011中小企業(yè)年度關(guān)鍵詞
>>>詳細(xì)閱讀
本文標(biāo)題：B2B行業(yè)網(wǎng)站“頁面結(jié)構(gòu)”分析及應(yīng)用
地址：http://www.geekbao.cn/a/b2b/20120211/29782.html
網(wǎng)友點(diǎn)評
精彩導(dǎo)讀
科技快報
品牌展示