特性網(wǎng)頁規(guī)劃之頁面規(guī)劃

　頁面規(guī)劃包含甚多，可大可小，我分以下幾個關鍵與我們討論：頁面平鋪、全體規(guī)劃、功能易用性、氣氛情感表達。 
　　一、頁面平鋪
　　把頁面平鋪開，主要的物件有：導航欄、LOGO、Banner、按鈕、圖片、文字。下面我就針對最主要的幾個部分詳細解說。

　　1.導航欄
　　導航欄假如規(guī)劃得恰到好處，是會給網(wǎng)頁自身增色許多(千萬不要太花哨，它歸于功能物件，喧賓奪主就欠好了)。導航欄有一排、兩排、多排、圖片導航和Frame 結構方便導航等等各種狀況的規(guī)劃。有時分是橫排，有時分則是豎排。別的還有一些動態(tài)的導航欄，如很精彩的Flash導航。導航欄規(guī)劃關鍵歸納如下：

　　1)導航不多的狀況下，一般是一排，反正都可以，其實欄目超越6個就可以考慮用兩排。

　　2)導航欄目許多的狀況，也可以多排，乃至不規(guī)則地多排(一排個數(shù)不同，或長度不同)。商業(yè)規(guī)劃或門戶站點一般都會有許多頻道，規(guī)劃起來，就要考慮橫向雙排。運用豎排，會占用太大空間。

　　3)一般內(nèi)容不多的狀況下，或許無所謂欄目，站點就包含了導航的詳細內(nèi)容，如圖1所示。

　　4)雙排導航未必要挨在一起，可以自在一些，如圖2所示：上排有導航欄，圖片分隔開后則另起一排。

　　5)圖片式導航，很漂亮，占用頁面空間比較大。如圖2中每一個孩子圖畫便是一個點擊熱門。

　　6)我推薦我們多用Flash制造導航，其體積小、改變多。

　　7)內(nèi)容很豐厚的站點，可以考慮運用方便導航，即Frame 結構方便導航，是因為不管你進入哪個頁面都可以快速跳躍到別的的欄目，不會失掉方向。

　　8)利用DHTML、JS、動態(tài)躲藏層等技能實現(xiàn)的多改變的導航，都有閱覽器的支撐問題。我主張我們不要給信息許多的站點作此導航。

　　9)不是一切的網(wǎng)站都有導航的。我們可依據(jù)自己狀況而定。

　　2.LOGO(標志)
　　關于LOGO的規(guī)劃我會在以后的“CI行銷”一文中詳細解說。這里我暫歸納下列兩個規(guī)劃關鍵：

　　1)LOGO的方位一般在頁面的左上角。依據(jù)你的規(guī)劃，它不是原封不動的，所謂特性的規(guī)劃，不論商業(yè)或個人，都要去斗膽嘗試。這里為我們列出LOGO在頁面上常見的布局狀況(圖3)，以作參閱。

　　2)網(wǎng)站的LOGO，盡管有動態(tài)的，可是絕對不適宜過火的動感，且不是一切的網(wǎng)站標志都合適選用動態(tài)。

　　3.BANNER(廣告條)類型
　　幾種世界尺度的Banner如下：468×60(全尺度Banner)、392×72(全尺度帶導航條Banner)、234×60(半尺度Banner)、125×125(方形按鈕)、120×90(按鈕類型1)、120×60(按鈕類型2)、88×31(小按鈕)、120×240(筆直Banner)，其間468×60的和88×31最多用，下面就常用的為我們解說一下。

　　1)468×60 全尺度Banner

　　盡管尺度為世界標準，可是在規(guī)劃頁面的時分，完全可以依據(jù)你的頁面占用空間來制定Banner廣告位和廣告條大小。

　　(1)一個頁面內(nèi)不易超出兩個468×60 全尺度Banner。兩個條的時分，一般是上面一個，下面一個，如圖4所示。

　　(2)規(guī)劃Banner配合頁面的兩種狀況：單看Banner很丑陋，可是放入網(wǎng)頁中，卻會使網(wǎng)頁規(guī)劃豐厚而奪目，一般也便是468×60的Banner有這本事了。還有規(guī)劃的時分必須要考慮LOGO跟別站交換時如何更合適他人網(wǎng)頁的風格，所以該多做一些不同色彩不同狀況的Banner。

　　2)88×31的Banner

　　(1)我們俗稱它為LOGO。

　　(2)好的Banner也要符合網(wǎng)站的風格。常常遇到一個很棒的Banner點開卻是很丑陋的主頁。盡管有被欺騙的感覺，可是從行銷的角度講，它規(guī)劃越好，點擊率越高，也就越成功。

　　(3)如圖4中，區(qū)域7內(nèi)的一般的廣告條， 88×31 Banner也可以用來豐厚頁面。這樣的狀況很少見，值得留意。

　　3)Banner規(guī)劃留意點：

　　(1)Banner有動態(tài)和靜態(tài)兩種。在閱覽網(wǎng)頁的過程中，盡管閃耀的圖案會發(fā)生瞬間回憶刺激，引起留意，但這種回憶往往為壓榨性的，久之易發(fā)生負面效應，從而含糊回憶。而穩(wěn)定的畫面不易引發(fā)特別的重視，但假如有良好的界面引導和內(nèi)容，可發(fā)生良性的回憶，持久而牢固。依據(jù)大略統(tǒng)計，100個Banner里邊有1/3是靜態(tài)的�？磥砦覀儗�動態(tài)的Banner更加看好。

　　(2)Banner的“重量”要輕！以468×60的Banner為例，最好是15K左右，不要超越22K。而88×31的Banner最好在5K左右，不要超越7K。

　　4)規(guī)劃關鍵：

　　(1)Banner的文字不能太多，用一兩句話來表達即可。

　　(2)廣告語要朗朗上口。

　　(3)圖形無須太繁雜，文字盡量運用黑體等粗大健壯的字體，否則在視覺上很簡單被網(wǎng)頁其他內(nèi)容吞沒。

　　(4)圖形盡量挑選色彩數(shù)少，可以闡明問題的事物。

　　(5)假如挑選色彩很雜亂的物體，要考慮一下在低色彩數(shù)狀況下，是否會有顯著的色斑。

　　(6)盡量不要運用彩虹色、暈邊等雜亂的特技圖形效果，這樣做會大大添加圖形所占據(jù)的色彩數(shù)，增大體積。

　　4.按鈕
　　網(wǎng)頁規(guī)劃是新的職業(yè)，沒有好久的歷史和標準的教本，長期以來對按鈕的定義也不是很明晰。哪些算是按鈕呢？如圖5頂用圈作記的地方：其間“用戶登錄”、“登錄按鈕”“More按鈕”、“個股推薦”等等類似物件，一般都統(tǒng)稱為按鈕。某種意義上導航的存在方式也是按鈕，僅僅它的功能很特別。假如常常做網(wǎng)頁，就會感覺到按鈕規(guī)劃的要求已越來越高。

　　按鈕規(guī)劃關鍵：

　　1)規(guī)劃按鈕要同頁面的全體協(xié)調(diào)，不能太搶眼。

　　2)有的頁面很單調(diào)，還要依靠花哨的按鈕來提一下。

　　3)選用的字體，選用的插圖，或插圖及字體搭配，都要考慮字跡清楚，色彩簡略一些，不要超越四種。

　　4)很長的按鈕或許便是結構的分界，盡量要纖細一些，否則頁面會顯臃腫。

　　5.圖片
　　為了美化頁面，圖片是任何一個頁面都要用到的，但要考慮網(wǎng)速，主張我們能不必就不必，圖片的運用要合理。

　　圖片運用關鍵：

　　1)圖形的主體最好明晰可見。

　　2)圖形的含義最好簡略明了。

　　3)圖片內(nèi)所含文字應該明晰簡單辨認。

　　4)布景與主體明度對比比例應為3∶1到5∶1之間為宜。

　　5)淡色系列的布景有助于全體調(diào)和。

　　6)淡色材質(zhì)布景最佳，能與主題分離之淡色標志或文字布景亦可。

　　6.文字
　　文字也是規(guī)劃的。這里給我們列出幾個規(guī)劃關鍵：

　　1)每一行文字的長度最好20到30個中文字(40到60個英文字母)。

　　2)行距與字距已由軟件內(nèi)定。規(guī)劃時留意段落與段落間空行及首行縮排方式以輔佐閱覽。

　　3)標題以H1到H3字號為佳，內(nèi)文Font size=3到4級為佳。

　　4)同版面字型最好在三種以內(nèi)。

　　5)文字的色彩最好也是三種以內(nèi)。

　　6)文字在色彩上要與布景區(qū)別。

　　7)內(nèi)文的擺放向左對齊并與左邊界保持恰當間隔�？梢杂帽砀裉钊胛淖忠赃_此效果。

　　8)表格或清單內(nèi)的字運用相同字型與字體大小，以利辨別。這些都是為用戶服務的規(guī)劃，很重要哦！

　　二、全體規(guī)劃
　　1.有共性，才有一致，有細節(jié)區(qū)別，就有層次。

　　2.避免規(guī)劃與實現(xiàn)過程中的誤差，不要定死詳細要放多少條信息。

　　3.規(guī)劃的各部分，要配合全體風格，夸大一點如同VI。

　　4.不僅頁面上各項規(guī)劃要一致，并且網(wǎng)站的各等級頁面也要一致。

　　5.頁面要“透氣”，便是信息不要過分會集，以免文字編列太緊密。

　　6.不要有太多渙散留意力的點。動態(tài)閃耀要適中。

　　7.頁面留白部分，要依據(jù)平面規(guī)劃原理來規(guī)劃，請留意，分欄式結構不宜留白。

　　8.還要考慮到閱覽器上部占用的屏幕空間，避免圖片切斷等造成視覺效果欠好。

　　9.首頁留白布局部分我為我們預備了一個例圖(圖6)供參閱。

　　三、功能易用性
　　任何網(wǎng)站都要把這個問題放在第一位。不過我們請留意以下幾點：

　　1.導航欄應最早調(diào)入，以便常客快速前往所需信息空間。

　　2.頁面長度要短，使得用戶在信息空間內(nèi)可敏捷移動。

　　3.導航規(guī)劃方向要一致。支撐導航的層次按鈕應當從上到下或從左到右，但不要兩者都用，不要混用方向。

　　四、氣氛情感表達
　　氣氛會自然地激宣布一種情感，不管它來自圖片、色彩、標題或者是動態(tài)的廣告，只要是來自頁面，自身就具有了一種表達思想。舉個對比很明顯的例子：閱覽恐懼站點和閱覽圣誕節(jié)慶祝頁面，你會有怎樣的感覺呢？這便是特性。