Web Design
Mobile Internet
Brand Design
Innovative
News
Encyclopedias

網(wǎng)站頁(yè)面設(shè)計(jì)的版式有哪些?

Date:2015-12-23 Aource:尚品中國(guó) Type:網(wǎng)站百科
Word Size:small  medium  big

網(wǎng)站頁(yè)面的布局版式、展示形式直接形晌用戶(hù)使用網(wǎng)站的方便性。合理的頁(yè)面布局可以使用戶(hù)快速發(fā)現(xiàn)網(wǎng)站建設(shè)的核心內(nèi)容和服務(wù):如果頁(yè)面布局不合理,用戶(hù)不知道怎樣獲取所需的信息,或者很難找到相應(yīng)的信息,那么他們就會(huì)離開(kāi)這個(gè)網(wǎng)站,甚至以后都不會(huì)再訪問(wèn)這個(gè)網(wǎng)站。常見(jiàn)的網(wǎng)頁(yè)布局形式大致有“國(guó)”字形、“廠”字形、框架型、封面型、Flash型布局和標(biāo)題正文型等。

一、“國(guó)”字形布局

“國(guó)”字形布局如下圖所示。最上面是網(wǎng)站的標(biāo)志、廣告以及導(dǎo)骯欄,接下來(lái)是網(wǎng)站的主耍內(nèi)容,左右分別列出一些欄目,中間是主要部分,最下部是網(wǎng)站的一些基本信息。這種結(jié)構(gòu)是國(guó)內(nèi)一些大中型網(wǎng)站常見(jiàn)的布局方式。優(yōu)點(diǎn)是充分利用版面,信息量大:缺點(diǎn)是頁(yè)面顯得擁擠,不夠靈活。

“國(guó)”字形布局

二、“廠”字形布局

“廠"字形布局,是指頁(yè)面頂部為標(biāo)志+廣告條,下方左面為主菜單,右面顯示正文信息,如下圖所示。這是網(wǎng)頁(yè)設(shè)計(jì)中使用廣泛的一種布局方式,一般應(yīng)用于企業(yè)網(wǎng)站中的二級(jí)頁(yè)面。這種布局的優(yōu)點(diǎn)是頁(yè)面結(jié)構(gòu)請(qǐng)晰、主次分明,是初學(xué)者最容易上手的布局方法。在這種類(lèi)型中,一種很常見(jiàn)的類(lèi)型是最上面是標(biāo)題及廣告,左側(cè)是導(dǎo)航鏈接。

“廠”字形布局

三、框架型布局

框架型布局一般分成上下或左右布局,一欄是導(dǎo)航欄目,一欄是正文信息。復(fù)雜的框架結(jié)構(gòu)可以將頁(yè)面分成許多部分,常見(jiàn)的是三欄布局,如下圖所示。上邊一欄放置圖像廣告,左邊一欄顯示導(dǎo)航欄,右邊顯示正文信息。

框架型布局

四、封面型布局

封面型布局一般應(yīng)用在網(wǎng)站的主頁(yè)成廣告宣傳頁(yè)上,為精共的圖像加上簡(jiǎn)單的文字鏈接,指向網(wǎng)頁(yè)中的主要欄目,或通過(guò)進(jìn)入鏈接到下一個(gè)頁(yè)面。如下圖是封面型布局的網(wǎng)頁(yè)。

封面型布局


五、Flash型布局

這種布局與封面型的布局結(jié)構(gòu)類(lèi)似,不同的是頁(yè)面采用了Flash技術(shù),動(dòng)感十足,可以大大增強(qiáng)頁(yè)面的視覺(jué)效果,如下圖所示采用的Flash型網(wǎng)頁(yè)布局。

Flash型布局

六、標(biāo)題正文型布局

這種類(lèi)型即最上面是標(biāo)題或類(lèi)似的一些東西,下面是正文,如一些文章頁(yè)面或注冊(cè)頁(yè)面等就是這種類(lèi)型的。如下圖所示采用的即為標(biāo)題正文型網(wǎng)頁(yè)布局。

標(biāo)題正文型布局
?

Please contact our consultant

+86 10-60259772

Please provide your contact number. The project manager of shangpin China will contact you as soon as possible.