網(wǎng)站設(shè)計頁面布局的形式和原則
1.頁面布局的形式
(1)"T”形結(jié)構(gòu)布局
"T”形結(jié)構(gòu)布局是網(wǎng)貞設(shè)計中應(yīng)用較廣泛的一種布局方式.通常頁面頂部為網(wǎng)站的標(biāo)志、廣告條、主菜單等,右側(cè)或左側(cè)有一列邊欄,然后另一側(cè)是很寬的正文.這種布局形式的頁面結(jié)構(gòu)清晰.主次分明.但容易給人一種規(guī)矩呆板的感覺。
(2)“口"形布局
通常貞面最上邊是網(wǎng)站的標(biāo)題以及橫幅廣告條,接下來就是網(wǎng)站的毛要內(nèi)容,左右分列兒小條內(nèi)容,中間是主要部分,最下邊是網(wǎng)站的一些基本信息、聯(lián)系方式、版權(quán)聲明等。這種布局形式充分利用了版面.信息量大,但頁面往往比較擁擠,不夠靈活。
(3)“川"形或"三"布局
“川’形布局頁面被垂直劃分為若干欄.一般分為三欄或四欄,在頁面的項部是標(biāo)志欄或廣告欄等。而“三.形布局頁面被水平劃分為若千欄,色塊中大多放廣告條。
(4) POP布局
POP布局形式的頁面大部分內(nèi)容為精美的圖片和一些小的動畫.再放置兒個簡單的鏈接:或梁用Flash動畫形式作為貞面的設(shè)計中心。這種布局形式漂亮吸引人.但瀏覽速度較慢.常用于時尚類網(wǎng)站。
(5)標(biāo)題正文型布局
標(biāo)題正文型布局通常在頁面最上邊是標(biāo)題或類似的一錢內(nèi)容.下邊則是正文內(nèi)容。商務(wù)網(wǎng)站的一些政策或面、幫助文章頁面或注冊頁面等常采用這種類取。
(6)框架型布局
框架型布局形式包括左右框架型布局、上卜框架型布局及綜合框架嗽布局等形式.在左右框架型布局中,一般左側(cè)是導(dǎo)航鏈接.有時最上邊會有一個小的標(biāo)題或標(biāo)志,右
側(cè)是正文內(nèi)容。這種布局形式結(jié)構(gòu)清晰、·L!了然,常川f大獄論壇及企業(yè)網(wǎng)站的頁面。
上下框架型布局形式與左右框架型布局類似,Ix.別僅僅在于是一種LF分為兩頁的框架。綜合框架吧布局是一種相對復(fù)雜的框架結(jié)構(gòu).通常結(jié)合了左右框架烈和上卜框架烈的布局形式。
具體采用什么類型的布局結(jié)構(gòu).要依據(jù)實際情況具體分析。如果內(nèi)容較多,可選川“T”形布局或“口”形布局形式:如果需要展示企業(yè)形象或個人風(fēng)采,可以選用POP布局形式:如果是具體的內(nèi)容頁面.則可以選用標(biāo)題正文型布局形式。
2.頁面布局的原則
(1)重點突出
應(yīng)考慮頁面的視覺中心.即屏幕的中央或中間偏上的位置處。通常-代j要的文章和圖片可以安排在這個位置.稍微次要的內(nèi)容叮以安排在視覺中心以外的位置。
(2)平衡請調(diào)
應(yīng)充分考慮受眾視覺的接受度,和諧地運用頁面色塊、顏色、文字、圖片等信息形式,力求達到種穩(wěn)定、誠實、信籟的貞面效染。
(3)圖文并茂
應(yīng)注意文字與圖片的和漪統(tǒng)一。文字’于圖片互為襯托.既能活躍頁面,又能豐富頁面內(nèi)容。
(4)簡潔清晰
網(wǎng)頁內(nèi)容的編排應(yīng)便于閱讀。通過使川解目的標(biāo)毯.限制所用的字體和顏色的數(shù)目.來保持版面的簡沽。
3、頁面色彩搭配
在網(wǎng)頁設(shè)計中.應(yīng)根據(jù)和諧、均衡和重點突出的原則,將不同的色彩進行組合、搭配以構(gòu)成視覺舒適的頁面.在網(wǎng)頁設(shè)計中通常主要內(nèi)容文字采用黑色.而邊框、背景、圖像應(yīng)用彩色.在進行網(wǎng)頁色彩設(shè)計時.切記不要將所有的顏色都用到.t般情況下.網(wǎng)頁色彩措配的技巧有:運用相同色系色彩:運用對比色和互補色:使川過渡色:用然色和·種色彩:背景和文字的對比要盡量大等。
4、頁面鏈接形式
網(wǎng)頁的組織結(jié)構(gòu)形式主要是指9i面之間的關(guān)系,可以采用以卜形式:
(1)樹狀結(jié)構(gòu)
樹狀結(jié)構(gòu)的網(wǎng)頁組織形式如圖1-7所示.是目前網(wǎng)站所采用的主要形式之一。其特點是條理清晰.瀏覽者可以根據(jù)路徑清楚地了解自己所在的位置,不容易迷路.同時也使于內(nèi)容的擴充.但是該結(jié)構(gòu)的瀏覽效率較低。

線性結(jié)構(gòu)的網(wǎng)頁組織形式如圖1-8所示,一般用于信息量較少的小型網(wǎng)站、索引站點,或用來組織網(wǎng)站中的一部分內(nèi)容。

網(wǎng)狀結(jié)構(gòu)的網(wǎng)頁組織形式如圖1-9所示.便于瀏覽者獲取信息.隨時可以到達自己喜歡的頁面。但是由于鏈接太多.容易使瀏覽者迷路。

建站流程
-
網(wǎng)站需求
-
網(wǎng)站策劃方案
-
頁面設(shè)計風(fēng)格
-
確認(rèn)交付使用
-
資料錄入優(yōu)化
-
程序設(shè)計開發(fā)
-
后續(xù)跟蹤服務(wù)
-
聯(lián)系電話
010-60259772
熱門標(biāo)簽
- 網(wǎng)站建設(shè)
- 食品網(wǎng)站建設(shè)
- 微信小程序開發(fā)
- 小程序開發(fā)
- 無錫網(wǎng)站建設(shè)
- 研究所網(wǎng)站建設(shè)
- 沈陽網(wǎng)站建設(shè)
- 廊坊網(wǎng)站建設(shè)
- 鄭州網(wǎng)站建設(shè)
- 婚紗攝影網(wǎng)站建設(shè)
- 手機端網(wǎng)站建設(shè)
- 高校網(wǎng)站制作
- 天津網(wǎng)站建設(shè)
- 教育網(wǎng)站建設(shè)
- 品牌網(wǎng)站建設(shè)
- 政府網(wǎng)站建設(shè)
- 北京網(wǎng)站建設(shè)
- 網(wǎng)站設(shè)計
- 網(wǎng)站制作
最新文章
推薦新聞
更多行業(yè)-
“網(wǎng)上賺錢”—企業(yè)新概念
目前,對企業(yè)來說,網(wǎng)絡(luò)是一種跨越時空、高效率的競爭手段,對提高競爭力是...
2014-11-21 -
SEO網(wǎng)站快照落后是什么原因
一、論壇外鏈新手們一般從論壇開始做起,比較簡單。論壇一般是兩種方式,一...
2012-11-14 -
網(wǎng)站建設(shè)美觀性保障:幾點關(guān)鍵問題!
網(wǎng)站已經(jīng)成為公司展示品牌形象、吸引客戶、促進銷售的重要平臺。然而,一個...
2024-04-23 -
萬物互聯(lián)時代來臨,物聯(lián)網(wǎng)引發(fā)服務(wù)業(yè)標(biāo)準(zhǔn)化轉(zhuǎn)型
“萬物互聯(lián)”再次成為大會關(guān)鍵詞,物聯(lián)網(wǎng)技術(shù)蘊含的廣闊市場前景令人矚目。...
2018-01-10 -
搜索引擎優(yōu)化與用戶體驗的關(guān)系是怎樣的
在準(zhǔn)備寫這篇文章的時候,我們先祈禱一下馬航失聯(lián)到今天已經(jīng)剛好10天時間...
2014-03-20 -
北京網(wǎng)站建設(shè)告訴你建站里易被忽視的要素有哪些?
北京網(wǎng)站建設(shè)的開發(fā)設(shè)計要盡量簡潔,讓用戶有很好的體驗感,盡量使用一種字...
2022-03-14
預(yù)約專業(yè)咨詢顧問溝通!
免責(zé)聲明
非常感謝您訪問我們的網(wǎng)站。在您使用本網(wǎng)站之前,請您仔細閱讀本聲明的所有條款。
1、本站部分內(nèi)容來源自網(wǎng)絡(luò),涉及到的部分文章和圖片版權(quán)屬于原作者,本站轉(zhuǎn)載僅供大家學(xué)習(xí)和交流,切勿用于任何商業(yè)活動。
2、本站不承擔(dān)用戶因使用這些資源對自己和他人造成任何形式的損失或傷害。
3、本聲明未涉及的問題參見國家有關(guān)法律法規(guī),當(dāng)本聲明與國家法律法規(guī)沖突時,以國家法律法規(guī)為準(zhǔn)。
4、如果侵害了您的合法權(quán)益,請您及時與我們,我們會在第一時間刪除相關(guān)內(nèi)容!
聯(lián)系方式:010-60259772
電子郵件:394588593@qq.com