網(wǎng)站頁面框架的制作設(shè)計

網(wǎng)頁具有可塑性，無論是水平方向還是垂直方向，這是紙質(zhì)頁面所不具有的。因此，即便是在確定頁面網(wǎng)格之前，你也需要確定最適合網(wǎng)站的基本頁面框架:固定寬度的頁面還是彈性寬度的頁面。

確定頁面長度要容易一些。最好的方式便是適用于內(nèi)容的常識性方式?！熬W(wǎng)絡(luò)讀者不會滾動”這一老話或許適用于10年前或者更久之前的新用戶，但是到了現(xiàn)在就不再是那么回事了。隨著讀者更習(xí)慣于將網(wǎng)頁作為一個閱讀媒介，頁面長度的設(shè)計限制減少了?？捎眯匝芯勘砻?，網(wǎng)頁讀者必定會通過屏幕滾動來閱讀他們感興趣的內(nèi)容。

固定頁面寬度

固定寬度頁面設(shè)計使用普遍，尤其是在進(jìn)行包含很多頁面功能子區(qū)域的復(fù)雜而面設(shè)計時，諸如新聞網(wǎng)站。將內(nèi)容放置在固定寬度的列意味著你的頁面布局將不會因為用戶的屏幕或瀏覽器窗口的大小不同而改變。在一個不變的環(huán)境中進(jìn)行設(shè)計音味著，你可以固定頁面元素的位置并控制行長和間距等版式特性。固定的布局還可以保持有關(guān)頁面布局中的不同組成部分之間是如何關(guān)聯(lián)的Gestalt視覺和空間邏輯。固定寬度的布局存在一些不利因素。在大的顯示屏上，會有較大比例的屏幕外于非使用狀態(tài)，而在狹窄的瀏覽窗口中，用戶或許會需要水平滾動才能看到完整雷度的頁面。此外，在瀏覽放大的文本時，固定寬度布局不會總是那么完美地作出反應(yīng)。

如果讀者選擇放大文本，那么固定寬度的設(shè)計或許會產(chǎn)生視覺上的分離常見的混合式替代設(shè)計就是將一個或者更多的固定寬度欄與一個彈性寬度的中間欄進(jìn)行組合，其中中間欄擁有相對簡單的內(nèi)容結(jié)構(gòu)并且可以延伸以填滿瀏覽器窗口的整個寬度。

“安全的”頁面寬度是一個不斷變換的目標(biāo)，因為電腦屏幕的平均大小~直在增長。決定最佳頁面寬度的最好方式就是使用網(wǎng)絡(luò)分析學(xué)來確定網(wǎng)站瀏覽者的平均屏幕大小。

固定布局對絕大多數(shù)網(wǎng)頁瀏覽環(huán)境(臺式電腦或筆記本電腦顯示屏)而言是最佳的選擇，其還可以適用于掌上設(shè)備以及其他形式的含移動樣式表的移動電腦。不過固定布局將會變得比彈性布局更脆弱并且更容易出現(xiàn)通用可用性問題。因此，我們強(qiáng)烈推薦在設(shè)計時選擇靈活頁面布局。

靈活頁面寬度

由于顯示屏大小不一，從小型的手機(jī)到寬的電影屏幕，要設(shè)計成一個標(biāo)準(zhǔn)“安全的”大小的打算往往是不現(xiàn)實的。網(wǎng)頁是一個靈活的媒介，用于適應(yīng)不同的用戶以及各不相同的顯示設(shè)備。與打印的固定于紙質(zhì)上的文檔不-樣的是，網(wǎng)頁的外觀取決于顯示大小、分辨率以及顏色設(shè)置、瀏覽器窗口的高度和寬度、軟件參數(shù)選擇(諸如鏈接和背景顏色設(shè)置)以及可用的字體等這類元素。往往最佳的方式就是接受媒介的靈活性，設(shè)計出清晰的、可適用于很多現(xiàn)實設(shè)備且能被所有用戶采用的頁面。靈活或“彈性”的頁面設(shè)計在很多方面都比固定設(shè)計更具挑戰(zhàn)性，因為靈活的頁面設(shè)計要求對HTML和其在平臺和瀏覽器中的使用有一個很深的了解。靈活的頁面設(shè)計還要求設(shè)計者能跳出自身的結(jié)構(gòu)并想出能夠在不同環(huán)境中發(fā)揮功效的圖形和布局。在定義靈活性頁面寬度時有很多種方法。最常用的方法就是使用百分比來定義頁面上不同元素的寬度。例如，對一個兩欄布局而言，內(nèi)容可以占據(jù)頁面寬度的75%，而區(qū)域?qū)Ш秸柬撁媸Ｓ嗟?5%。同一頁面在打印時將會隱藏導(dǎo)航欄，因為其在紙質(zhì)頁面。上的用處不大，同時將頁面寬度調(diào)至一個適宜閱讀的數(shù)值。而在移動設(shè)備上，導(dǎo)航是必要的，但狹窄的屏幕寬度不會支持多欄，我們會將兩欄折疊為一欄。并將屏幕上的可用空間最大化。

靈活的網(wǎng)站設(shè)計在適應(yīng)不同的顯示設(shè)備(臺式電腦、筆記本電腦、手機(jī)、iPod，等等)方面具有很多的優(yōu)勢。此外，靈活性設(shè)計更具有通用使用性，因為其可以輕易用于增加文本大小、提升顯示顏色和對比，以及增加閱讀參數(shù)。靈活的頁面或許對于依賴于頁面大小、版式以及圖形之間相對固定的視覺關(guān)系的復(fù)雜頁面布局而言，不是最好的方式。