網(wǎng)頁(yè)寬度到底該怎么定？

網(wǎng)頁(yè)寬度到底該怎么定?了解網(wǎng)頁(yè)設(shè)計(jì)的寬度定義，勢(shì)必要理解它們的底層原因，因?yàn)閷挾鹊脑O(shè)置:只有合適的寬度，沒(méi)有正確的寬度。今天小編主要給大家分享網(wǎng)頁(yè)寬度到底該怎么定，希望對(duì)你們有幫助!

1.瀏覽設(shè)備

瀏覽設(shè)備是Web用戶使用的屏幕類型。主要考量的標(biāo)準(zhǔn)是屏幕的分辨率(長(zhǎng)度和寬度、像素)。

常見(jiàn)的PC端屏幕分辨率為1280×800、1600×900、1440×800、1366×768、1920×1080、2560×1440等，加上一些不太常見(jiàn)的(如

surfacebook的3000×2000)。這些是比較常見(jiàn)的。所以基于這個(gè)前提，很多人會(huì)在屏幕的分辨率上查找統(tǒng)計(jì)表。

對(duì)于網(wǎng)頁(yè)設(shè)計(jì)，我們首先要確定的是——較小適配屏幕。

因?yàn)樵谝话銏?chǎng)景下，如果顯示器分辨率大于畫布，則我們可以正常訪問(wèn)內(nèi)容;如果小于畫布，則內(nèi)容將不完整顯示出來(lái)，這相當(dāng)于放棄了低于此分辨率的用戶。

因此，我們做了簡(jiǎn)單的計(jì)算，如果基于1920×1080，則支持的用戶數(shù)量為27.38%;

如果是800×600，則支持的用戶數(shù)小于3%。考慮到這一點(diǎn)，我們是否支持做較小的分辨率?當(dāng)然不是。

今天，寬度低于1024的設(shè)備非常罕見(jiàn)。即使使用1024，主流設(shè)備也是平板電腦而不是普通電腦。當(dāng)這些設(shè)備的數(shù)量低以至于它們變得非主流時(shí)，可以選擇忽略它們以滿足更多人的需求。

通常，我們支持的分辨率至少不是1024×768就是1280×800。

如果大家不相信，可以訪問(wèn)各種網(wǎng)站并使用QQ屏幕截圖工具來(lái)測(cè)量主要內(nèi)容區(qū)域的寬度。

⒉展示類型

可能有很多人已經(jīng)聽(tīng)過(guò)響應(yīng)式布局和自適應(yīng)設(shè)計(jì)。首先，無(wú)論它們有何不同，它們都代表了隨著瀏覽器窗口大小的變化而改變網(wǎng)頁(yè)大小的技術(shù)。

比如星巴克網(wǎng)站的Bootstrap架構(gòu)，在更改瀏覽器窗口的寬度后，可以獲得不同的結(jié)果。

如果仍需要通過(guò)此內(nèi)容了解頁(yè)面的寬度，我不建議在實(shí)際項(xiàng)目中使用響應(yīng)式布局和自適應(yīng)設(shè)計(jì)，因?yàn)槎夹枰煜で岸思軜?gòu)和對(duì)CSS屬性的基本認(rèn)識(shí)，否則就無(wú)法直接考慮其它分辨率下的顯示器顯示效果以及在設(shè)計(jì)過(guò)程中制定不同元素的自適應(yīng)設(shè)計(jì)。

前端開(kāi)發(fā)變得越來(lái)越后端化

前端新手學(xué)習(xí)交流群，如果有想學(xué)習(xí)前端或者交流經(jīng)驗(yàn)的都可以加入，一起互相學(xué)習(xí)交流：→→→點(diǎn)擊我即可加入圈子

從技術(shù)發(fā)展趨勢(shì)來(lái)看，前端開(kāi)發(fā)逐漸從純前端走向后端，html+css+js+jquery開(kāi)發(fā)者的生存空間不斷被壓縮。隨著大前端技術(shù)的日趨流行，通過(guò)前端開(kāi)發(fā)技術(shù)構(gòu)建出一個(gè)完整的應(yīng)用也變得不再?gòu)?fù)雜，這也是前端開(kāi)發(fā)越來(lái)越火熱的重要原因之一。現(xiàn)在很多前端開(kāi)發(fā)與后端開(kāi)發(fā)界限也越來(lái)越不明顯，前端全棧化，也逐漸成為高級(jí)前端開(kāi)發(fā)者的標(biāo)準(zhǔn)之一。