來(lái)源:無(wú)錫網(wǎng)站建設(shè)阿凡達(dá) 瀏覽次數(shù):338 發(fā)表日期:2023-05-16
網(wǎng)頁(yè)具有可塑性,無(wú)論是水平方向還是垂直方向,這是紙質(zhì)頁(yè)面所不具有的。因此,即便是在確定頁(yè)面網(wǎng)格之前,你也需要確定*適合網(wǎng)站的基本頁(yè)面框架:固定寬度的頁(yè)面還是彈性寬度的頁(yè)面。
確定頁(yè)面長(zhǎng)度要容易一些。*好的方式便是適用于內(nèi)容的常識(shí)性方式。“網(wǎng)絡(luò)讀者不會(huì)滾動(dòng)”這一老話或許適用于10年前或者更久之前的新用戶,但是到了現(xiàn)在就不再是那么回事了。隨著讀者更習(xí)慣于將網(wǎng)頁(yè)作為一個(gè)閱讀媒介,頁(yè)面長(zhǎng)度的設(shè)計(jì)限制減少了??捎眯匝芯勘砻?,網(wǎng)頁(yè)讀者必定會(huì)通過(guò)屏幕滾動(dòng)來(lái)閱讀他們感興趣的內(nèi)容。
固定頁(yè)面寬度
固定寬度頁(yè)面設(shè)計(jì)使用普遍,尤其是在進(jìn)行包含很多頁(yè)面功能子區(qū)域的復(fù)雜而面設(shè)計(jì)時(shí),諸如新聞網(wǎng)站。將內(nèi)容放置在固定寬度的列意味著你的頁(yè)面布局將不會(huì)因?yàn)橛脩舻钠聊换驗(yàn)g覽器窗口的大小不同而改變。在一個(gè)不變的環(huán)境中進(jìn)行設(shè)計(jì)音味著,你可以固定頁(yè)面元素的位置并控制行長(zhǎng)和間距等版式特性。固定的布局還可以保持有關(guān)頁(yè)面布局中的不同組成部分之間是如何關(guān)聯(lián)的Gestalt視覺(jué)和空間邏輯。固定寬度的布局存在一些不利因素。在大的顯示屏上,會(huì)有較大比例的屏幕外于非使用狀態(tài),而在狹窄的瀏覽窗口中,用戶或許會(huì)需要水平滾動(dòng)才能看到完整雷度的頁(yè)面。此外,在瀏覽放大的文本時(shí),固定寬度布局不會(huì)總是那么完美地作出反應(yīng)。
如果讀者選擇放大文本,那么固定寬度的設(shè)計(jì)或許會(huì)產(chǎn)生視覺(jué)上的分離常見(jiàn)的混合式替代設(shè)計(jì)就是將一個(gè)或者更多的固定寬度欄與一個(gè)彈性寬度的中間欄進(jìn)行組合,其中中間欄擁有相對(duì)簡(jiǎn)單的內(nèi)容結(jié)構(gòu)并且可以延伸以填滿瀏覽器窗口的整個(gè)寬度。
“安全的”頁(yè)面寬度是一個(gè)不斷變換的目標(biāo),因?yàn)殡娔X屏幕的平均大小~直在增長(zhǎng)。決定**頁(yè)面寬度的*好方式就是使用網(wǎng)絡(luò)分析學(xué)來(lái)確定網(wǎng)站瀏覽者的平均屏幕大小。
固定布局對(duì)絕大多數(shù)網(wǎng)頁(yè)瀏覽環(huán)境(臺(tái)式電腦或筆記本電腦顯示屏)而言是**的選擇,其還可以適用于掌上設(shè)備以及其他形式的含移動(dòng)樣式表的移動(dòng)電腦。不過(guò)固定布局將會(huì)變得比彈性布局更脆弱并且更容易出現(xiàn)通用可用性問(wèn)題。因此,我們強(qiáng)烈推薦在設(shè)計(jì)時(shí)選擇靈活頁(yè)面布局。
靈活頁(yè)面寬度
由于顯示屏大小不一,從小型的手機(jī)到寬的電影屏幕,要設(shè)計(jì)成一個(gè)標(biāo)準(zhǔn)安全的大小的打算往往是不現(xiàn)實(shí)的。網(wǎng)頁(yè)是一個(gè)靈活的媒介,用于適應(yīng)不同的用戶以及各不相同的顯示設(shè)備。與打印的固定于紙質(zhì)上的文檔不-樣的是,網(wǎng)頁(yè)的外觀取決于顯示大小、分辨率以及顏色設(shè)置、瀏覽器窗口的高度和寬度、軟件參數(shù)選擇(諸如鏈接和背景顏色設(shè)置)以及可用的字體等這類元素。往往**的方式就是接受媒介的靈活性,設(shè)計(jì)出清晰的、可適用于很多現(xiàn)實(shí)設(shè)備且能被所有用戶采用的頁(yè)面。靈活或;彈性的頁(yè)面設(shè)計(jì)在很多方面都比固定設(shè)計(jì)更具挑戰(zhàn)性,因?yàn)殪`活的頁(yè)面設(shè)計(jì)要求對(duì)HTML和其在平臺(tái)和瀏覽器中的使用有一個(gè)很深的了解。靈活的頁(yè)面設(shè)計(jì)還要求設(shè)計(jì)者能跳出自身的結(jié)構(gòu)并想出能夠在不同環(huán)境中發(fā)揮功效的圖形和布局。在定義靈活性頁(yè)面寬度時(shí)有很多種方法。*常用的方法就是使用百分比來(lái)定義頁(yè)面上不同元素的寬度。例如,對(duì)一個(gè)兩欄布局而言,內(nèi)容可以占據(jù)頁(yè)面寬度的75%,而區(qū)域?qū)Ш秸柬?yè)面剩余的25%。同一頁(yè)面在打印時(shí)將會(huì)隱藏導(dǎo)航欄,因?yàn)槠湓诩堎|(zhì)頁(yè)面。上的用處不大,同時(shí)將頁(yè)面寬度調(diào)至一個(gè)適宜閱讀的數(shù)值。而在移動(dòng)設(shè)備上,導(dǎo)航是必要的,但狹窄的屏幕寬度不會(huì)支持多欄,我們會(huì)將兩欄折疊為一欄。并將屏幕上的可用空間*大化。
靈活的網(wǎng)站設(shè)計(jì)在適應(yīng)不同的顯示設(shè)備(臺(tái)式電腦、筆記本電腦、手機(jī)、iPod,等等)方面具有很多的優(yōu)勢(shì)。此外,靈活性設(shè)計(jì)更具有通用使用性,因?yàn)槠淇梢暂p易用于增加文本大小、提升顯示顏色和對(duì)比,以及增加閱讀參數(shù)。靈活的頁(yè)面或許對(duì)于依賴于頁(yè)面大小、版式以及圖形之間相對(duì)固定的視覺(jué)關(guān)系的復(fù)雜頁(yè)面布局而言,不是*好的方式。
免費(fèi)答疑熱線
400-189-1319
添加微信