歡迎來到合肥浪訊網(wǎng)絡(luò)科技有限公司官網(wǎng)
  咨詢服務(wù)熱線:400-099-8848

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

發(fā)布時(shí)間:2019-07-16 文章來源:本站  瀏覽次數(shù):2728

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

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

  1)導(dǎo)航不多的狀況下,一般是一排,反正都可以,其實(shí)欄目超越6個(gè)就可以考慮用兩排。

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

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

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

  5)圖片式導(dǎo)航,很漂亮,占用頁面空間比較大。如圖2中每一個(gè)孩子圖畫便是一個(gè)點(diǎn)擊熱門。

  6)我推薦我們多用Flash制造導(dǎo)航,其體積小、改變多。

  7)內(nèi)容很豐厚的站點(diǎn),可以考慮運(yùn)用方便導(dǎo)航,即Frame 結(jié)構(gòu)方便導(dǎo)航,是因?yàn)椴还苣氵M(jìn)入哪個(gè)頁面都可以快速跳躍到別的的欄目,不會(huì)失掉方向。

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

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

  2.LOGO(標(biāo)志)
  關(guān)于LOGO的規(guī)劃我會(huì)在以后的“CI行銷”一文中詳細(xì)解說。這里我暫歸納下列兩個(gè)規(guī)劃關(guān)鍵:

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

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

  3.BANNER(廣告條)類型
  幾種世界尺度的Banner如下:468×60(全尺度Banner)、392×72(全尺度帶導(dǎo)航條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

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

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

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

  2)88×31的Banner

  (1)我們俗稱它為LOGO。

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

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

  3)Banner規(guī)劃留意點(diǎn):

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

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

  4)規(guī)劃關(guān)鍵:

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

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

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

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

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

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

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

  按鈕規(guī)劃關(guān)鍵:

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

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

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

  4)很長的按鈕或許便是結(jié)構(gòu)的分界,盡量要纖細(xì)一些,否則頁面會(huì)顯臃腫。

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

  圖片運(yùn)用關(guān)鍵:

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  3.規(guī)劃的各部分,要配合全體風(fēng)格,夸大一點(diǎn)如同VI。

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

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

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

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

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

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

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

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

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

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

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

上一條:網(wǎng)站LOGO簡論...

下一條:特性網(wǎng)頁規(guī)劃之色彩調(diào)配...