淺談理解靈活布局

2022-08-08 分類(lèi)：網(wǎng)站建設(shè)

一、布局類(lèi)型

我們可以根據(jù)網(wǎng)頁(yè)布局的寬度設(shè)置將其分為3種類(lèi)型：固定寬度、可變（或不固定）寬度和彈性寬度。還可以通過(guò)混合不同的度量單位將這些布局合并為混合布局，設(shè)計(jì)的每一個(gè)分欄都可以使用不同的單位。這4種布局類(lèi)型中的任何一種都可以使用任意數(shù)量的分欄或者美化主題，布局類(lèi)型直接地決定了瀏覽設(shè)備如何在用戶(hù)面前展現(xiàn)布局的寬度。

固定寬度布局(fixed-widthlayout)是以前最常見(jiàn)和最常采用的設(shè)計(jì)，固定寬度設(shè)計(jì)的整體布局寬度以像素為單位來(lái)設(shè)置，具體值由設(shè)計(jì)者決定。通常，設(shè)計(jì)者基于最常見(jiàn)的屏幕分辨率(例如，800×600和1024×768)來(lái)選擇寬度。

固定寬度設(shè)計(jì)是固定不變的，它們的尺寸不會(huì)隨著用戶(hù)的設(shè)置而變化。這樣一來(lái)，即便是存在不同的用戶(hù)設(shè)置，你也可以創(chuàng)建一個(gè)包含豐富圖像的網(wǎng)頁(yè)，并且能讓它看上去緊湊一致。如果你對(duì)站點(diǎn)的目標(biāo)用戶(hù)進(jìn)行了調(diào)查，那么你就能設(shè)計(jì)出符合大多數(shù)用戶(hù)瀏覽器窗口的布局，并且可以確保將文本行之間的寬度設(shè)置為一個(gè)便于閱讀的理想值。

1．屏幕分辨率并不等同于瀏覽器窗口大小

固定寬度布局的大問(wèn)題在于，它們本質(zhì)上取決于你估計(jì)何種寬度會(huì)最適合大多數(shù)用戶(hù)。即便是你的網(wǎng)頁(yè)統(tǒng)計(jì)軟件可以告知每個(gè)用戶(hù)屏幕分辨率——即便是你正在制作一個(gè)內(nèi)聯(lián)網(wǎng)并且確定只會(huì)使用單一的分辨率——屏幕的分辨率也并非總是能夠與瀏覽器窗口相匹配。有一些人不會(huì)使用大化的瀏覽器窗口進(jìn)行瀏覽（不能否認(rèn)，這是很少的一部分人，但是隨著顯示器和分辨率大小的增加，這類(lèi)人的數(shù)量也在增加）。另外，還有一些人會(huì)使用占用了可用寬度數(shù)百像素的瀏覽器工具條。固定寬度設(shè)計(jì)帶來(lái)的后果往往是，相對(duì)于瀏覽者的窗口而言，某些瀏覽者看到的設(shè)計(jì)不是過(guò)寬（迫使他們不停地拖動(dòng)水平滾動(dòng)條）就是過(guò)窄（使得布局的一側(cè)或者兩側(cè)留下大量空白）。根據(jù)我對(duì)用戶(hù)所做的測(cè)試，很多人幾乎都對(duì)瀏覽器中“被浪費(fèi)的空間”或者費(fèi)勁地拖動(dòng)水平滾動(dòng)條表示苦惱不堪！

2．并非所有人都使用16像素的文本

如果你知道所處理文本的大小，那么你可以選擇一個(gè)固定的寬度來(lái)優(yōu)化每行的字符數(shù)或者行長(zhǎng)以提高易讀性。印刷設(shè)計(jì)師們一直都在做這一工作：RobertBringhurst的名作《印刷樣式元素(TheElementsofTypographicStyle)推薦的行長(zhǎng)為45至75個(gè)字符。這是基于數(shù)年對(duì)印刷文本易讀性的調(diào)查研究所得出的結(jié)論。根據(jù)對(duì)屏幕顯示文本易讀性的最新調(diào)查研究表明，75到100個(gè)字符之內(nèi)，行長(zhǎng)越長(zhǎng)，閱讀速度越快（盡管很多受測(cè)試用戶(hù)表示他們更喜歡短一些的文本）。

不過(guò)，在網(wǎng)絡(luò)中，我們無(wú)法知道用戶(hù)的文本大小，瀏覽器默認(rèn)值為16像素，絕大多數(shù)用戶(hù)會(huì)對(duì)其文本使用該默認(rèn)值。然而，有些用戶(hù)還是會(huì)更改該默認(rèn)值，或者將用戶(hù)樣式表設(shè)置成格式文本以便更易閱讀。甚至，如果文本的某一頁(yè)讀起來(lái)很費(fèi)勁（即便是像素可調(diào)的文本，InternetExplorer6以及更早版本的瀏覽器中的文本除外），那些對(duì)該文本使用默認(rèn)值的用戶(hù)也會(huì)增加每頁(yè)文本的大小。因此，如果你為16像素大小的文本進(jìn)行行長(zhǎng)優(yōu)化，你或許是在為絕大多數(shù)訪(fǎng)問(wèn)者進(jìn)行易讀性?xún)?yōu)化工作，但并不是為所有的訪(fǎng)問(wèn)者。不要誤解我的意思；為絕大多數(shù)人設(shè)計(jì)是一件好事。只是不要錯(cuò)誤地認(rèn)為“絕大多數(shù)”等同于“所有“。

另一個(gè)問(wèn)題是，這些對(duì)行長(zhǎng)的研究并未考慮到會(huì)促使特定群體更傾向于更短或是更長(zhǎng)行長(zhǎng)的各種不利條件。盡管我認(rèn)同設(shè)計(jì)師的工作多半是圍繞用戶(hù)需求并以最有利于用戶(hù)的方式而展開(kāi)（因?yàn)橛脩?hù)自己并不知道什么是的），但是有時(shí)候還是需要讓用戶(hù)自己而不是我們，去更好地了解什么才能好地滿(mǎn)足他們的需求。至少，我們可以根據(jù)自己認(rèn)為的能夠幫助絕大多數(shù)用戶(hù)的考慮來(lái)優(yōu)化設(shè)計(jì)，不過(guò)要告知用戶(hù)為了更好地滿(mǎn)足其需求而需適應(yīng)我們的設(shè)計(jì)的可能性一——這是印刷以及更為固定的媒介無(wú)法獲得的一大優(yōu)勢(shì)。

網(wǎng)站標(biāo)題：淺談理解靈活布局
分享URL：http://www.bm7419.com/news32/187032.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁(yè)設(shè)計(jì)公司、外貿(mào)建站、搜索引擎優(yōu)化、網(wǎng)站維護(hù)、品牌網(wǎng)站建設(shè)、企業(yè)建站

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容