網頁(ye)可(ke)以說是網站構成的(de)(de)(de)基本元(yuan)素(su)(su)。當我們(men)(men)輕點鼠標,在網海中遨(ao)游,一副(fu)副(fu)精(jing)彩的(de)(de)(de)網頁(ye)會呈現(xian)在我們(men)(men)面(mian)前,那么(me),網頁(ye)的(de)(de)(de)精(jing)彩與(yu)否的(de)(de)(de)因素(su)(su)是什么(me)呢?色彩的(de)(de)(de)搭配、文字(zi)的(de)(de)(de)變化、圖片的(de)(de)(de)處理等,這(zhe)些(xie)(xie)當然(ran)是不可(ke)忽略的(de)(de)(de)因素(su)(su),除了(le)這(zhe)些(xie)(xie),還有一個非常(chang)重要(yao)的(de)(de)(de)因素(su)(su)——網頁(ye)的(de)(de)(de)布(bu)局(ju)。下(xia)面(mian),我們(men)(men)就有關(guan)網頁(ye)布(bu)局(ju)談論一下(xia)。
網(wang)頁布(bu)局類型(xing)
網頁布局大(da)致可分(fen)為“國”字型(xing)、拐角(jiao)型(xing)、標(biao)題正文型(xing)、左右框(kuang)(kuang)架(jia)(jia)型(xing)、上下框(kuang)(kuang)架(jia)(jia)型(xing)、綜合框(kuang)(kuang)架(jia)(jia)型(xing)、封面型(xing)、Flash型(xing)、變(bian)化型(xing),下面分(fen)別(bie)論述(shu)。
1、“國”字型:
也(ye)可以稱為“同(tong)”字型,是(shi)(shi)一(yi)些(xie)大型網(wang)(wang)(wang)站(zhan)所喜歡的(de)類(lei)型,即最上(shang)(shang)面是(shi)(shi)網(wang)(wang)(wang)站(zhan)的(de)標(biao)題以及橫幅廣告條(tiao),接下來就是(shi)(shi)網(wang)(wang)(wang)站(zhan)的(de)主要(yao)內容,左右分(fen)(fen)列一(yi)些(xie)兩小條(tiao)內容,中(zhong)間(jian)是(shi)(shi)主要(yao)部分(fen)(fen),與左右一(yi)起羅(luo)列到底(di),最下面是(shi)(shi)網(wang)(wang)(wang)站(zhan)的(de)一(yi)些(xie)基(ji)本信息、聯系方式(shi)、版(ban)權(quan)聲明等。這種結構是(shi)(shi)我們在網(wang)(wang)(wang)上(shang)(shang)見到的(de)差不多最多的(de)一(yi)種結構類(lei)型。
2、拐角型:
這(zhe)種結構(gou)與上一(yi)(yi)種其(qi)實只是(shi)(shi)形式上的區別,其(qi)實是(shi)(shi)很(hen)相近的,上面(mian)(mian)是(shi)(shi)標題及廣(guang)告橫幅,接(jie)下(xia)(xia)來(lai)的左側(ce)是(shi)(shi)一(yi)(yi)窄列(lie)鏈接(jie)等,右列(lie)是(shi)(shi)很(hen)寬的正文,下(xia)(xia)面(mian)(mian)也(ye)是(shi)(shi)一(yi)(yi)些(xie)網站的輔助信息。在這(zhe)種類型(xing)中,一(yi)(yi)種很(hen)常見的類型(xing)是(shi)(shi)最(zui)上面(mian)(mian)是(shi)(shi)標題及廣(guang)告,左側(ce)是(shi)(shi)導航鏈接(jie)。
3、標題正文型:
這(zhe)種(zhong)類型即(ji)最上面是(shi)標題(ti)或(huo)類似的(de)一(yi)些東西,下面是(shi)正文,比如一(yi)些文章(zhang)頁(ye)面或(huo)注冊頁(ye)面等(deng)就是(shi)這(zhe)種(zhong)類。
4、左右框架型:
這(zhe)是(shi)一(yi)種(zhong)左右為分別兩頁(ye)的框架結構(gou),一(yi)般左面是(shi)導航鏈接(jie),有(you)(you)時最上面會有(you)(you)一(yi)個小的標(biao)題(ti)或(huo)標(biao)致,右面是(shi)正文(wen)。我(wo)們見到(dao)的大(da)部分的大(da)型論壇都(dou)是(shi)這(zhe)種(zhong)結構(gou)的,有(you)(you)一(yi)些企業網站也喜歡(huan)采用。這(zhe)種(zhong)類型結構(gou)非(fei)常清晰,一(yi)目了(le)然(ran)。
5、上下框架型:
與上(shang)面(mian)類似,區(qu)別僅(jin)(jin)僅(jin)(jin)在于是(shi)一(yi)種(zhong)上(shang)下分為兩頁的框架。
6、綜合框架型:
上頁兩(liang)種結構(gou)的(de)結合(he),相對(dui)復雜的(de)一種框(kuang)架結構(gou),較為常見(jian)的(de)是類(lei)似于“拐角型”結構(gou)的(de),只是采(cai)用了(le)框(kuang)架結構(gou)。
7、封面(mian)型:
這(zhe)種類型基本(ben)上(shang)是出(chu)現在(zai)一(yi)(yi)些(xie)(xie)網(wang)站(zhan)的(de)首頁,大部分(fen)為一(yi)(yi)些(xie)(xie)精(jing)美的(de)平(ping)面設計結合一(yi)(yi)些(xie)(xie)小的(de)動(dong)畫,放(fang)上(shang)幾個簡單的(de)鏈接或者僅是一(yi)(yi)個“進入”的(de)鏈接甚至直接在(zai)首頁的(de)圖片(pian)上(shang)做鏈接而沒有任何提示。這(zhe)種類型大部分(fen)出(chu)現在(zai)企業網(wang)站(zhan)和個人主頁,如果說處理(li)的(de)好(hao),會給人帶(dai)來賞心悅目的(de)感覺。
8、Flash型:
其實這(zhe)與封(feng)面型(xing)結構是(shi)類似的(de)(de),只是(shi)這(zhe)種類型(xing)采用了目前非(fei)常游戲行的(de)(de)Flash,與封(feng)面型(xing)不同(tong)的(de)(de)是(shi),由于Flash強大(da)的(de)(de)功能,頁面所表(biao)達(da)的(de)(de)信息更豐富(fu),其視覺(jue)效果(guo)(guo)及聽覺(jue)效果(guo)(guo)如果(guo)(guo)處(chu)理得(de)當(dang),絕不差于傳統的(de)(de)多媒體。
9、變化型:
即上面幾種(zhong)(zhong)類型的(de)結(jie)合(he)與(yu)變化,比如本站在視(shi)覺上是很接近拐(guai)角型的(de),但所實(shi)現的(de)功能的(de)實(shi)質是那(nei)種(zhong)(zhong)上、左、右(you)結(jie)構(gou)的(de)綜(zong)合(he)框(kuang)架型。
關于第一(yi)屏
所(suo)謂第一(yi)屏,是指(zhi)我們到(dao)達一(yi)個網(wang)站在(zai)不拖動滾(gun)動條(tiao)時能夠看到(dao)的部分。那么第一(yi)屏有(you)多(duo)“大”呢(ni)?其實這(zhe)是未(wei)知的。一(yi)般(ban)來講,在(zai)800*600的屏幕顯示模式(shi)(這(zhe)也是最常用的)下(xia)(xia),在(zai)IE安裝后默認的狀態(即工具(ju)欄(lan)地址欄(lan)等沒有(you)改變(bian))下(xia)(xia),IE窗口內能看到(dao)的部分為(wei)778px*435px,一(yi)般(ban)來講,我們以這(zhe)個大小為(wei)標準(zhun)就行了(le),畢竟,在(zai)無法適合所(suo)有(you)人的情況下(xia)(xia),我們只(zhi)能為(wei)大多(duo)數考慮了(le)。
說(shuo)(shuo)了那么多,無非是一個(ge)標準的(de)問題,其(qi)實(shi)接下(xia)來不(bu)用(yong)我說(shuo)(shuo)大家也(ye)能想到,第(di)一屏當然要放最主要的(de)內容,關鍵要知道的(de)是,我們要對第(di)一屏能顯示的(de)面積要有個(ge)估計,而不(bu)要僅僅以自己的(de)機(ji)器為準。其(qi)實(shi)網頁制作的(de)一個(ge)很麻煩的(de)地方就(jiu)是瀏覽者的(de)機(ji)器是未知的(de)。
有關導航(hang)欄的(de)位置
導航欄(lan)能讓我們在瀏覽(lan)時(shi)容易的到(dao)達不(bu)同的頁面(mian),是網(wang)頁元素非常重(zhong)要的部(bu)分(fen),所(suo)以導航欄(lan)一(yi)定要清(qing)晰、醒目,一(yi)般來講,導航欄(lan)要在“第一(yi)屏”能顯(xian)示(shi)出來,但(dan)是有時(shi)第一(yi)屏可(ke)能會(hui)小于(yu)上面(mian)所(suo)說的435px,積于(yu)這點(dian)考慮,那種(zhong)橫向放(fang)置的導航欄(lan)要優(you)于(yu)縱向的導航欄(lan)考慮,原因很簡單(dan):如(ru)果瀏覽(lan)者的第一(yi)屏很矮,橫向的仍能全部(bu)看到(dao),而縱向的就很難說了,因為窗口(kou)的寬(kuan)度(du)一(yi)般是不(bu)會(hui)受(shou)瀏覽(lan)器設(she)置影響的,而縱向的則不(bu)確定性(xing)要大的多(duo)。
什么(me)樣的布(bu)局是最好(hao)的
這(zhe)是(shi)初(chu)學者(zhe)可(ke)能(neng)會問的(de)問題(ti)。其實這(zhe)要(yao)具體情況具體分析的(de):比如(ru)(ru)如(ru)(ru)果內容(rong)(rong)非常多,就要(yao)考慮用“國字(zi)型(xing)(xing)”或拐角(jiao)型(xing)(xing);而(er)如(ru)(ru)果內容(rong)(rong)不(bu)算太(tai)多而(er)一(yi)些說明性的(de)東西(xi)比較多,則可(ke)以考慮標題(ti)正文型(xing)(xing);那幾種框架結(jie)構(gou)的(de)一(yi)個(ge)共同特點就是(shi)瀏(liu)覽方便,速度快,但結(jie)構(gou)變(bian)(bian)(bian)化(hua)不(bu)靈活;而(er)如(ru)(ru)果是(shi)一(yi)個(ge)企業網(wang)站想(xiang)展(zhan)示一(yi)下企業形象或個(ge)人(ren)(ren)主頁(ye)想(xiang)展(zhan)示個(ge)人(ren)(ren)風(feng)采,封面性是(shi)優選;Flash型(xing)(xing)更(geng)靈活一(yi)些,好(hao)的(de)Flash大大豐富了(le)網(wang)頁(ye),但是(shi)它不(bu)能(neng)表達(da)過多的(de)文字(zi)信息。還沒有提到的(de)就是(shi)變(bian)(bian)(bian)化(hua)型(xing)(xing)了(le),我只(zhi)是(shi)想(xiang)把(ba)這(zhe)個(ge)留給(gei)讀者(zhe)了(le),因(yin)為,只(zhi)有不(bu)斷(duan)(duan)的(de)變(bian)(bian)(bian)化(hua)才(cai)會提高(gao),才(cai)會不(bu)斷(duan)(duan)豐富我們的(de)網(wang)頁(ye)。
|