HTML5移動(dòng)網(wǎng)頁(yè)的設(shè)計(jì)稿尺寸應(yīng)該是多少？HTML5的移動(dòng)端網(wǎng)頁(yè)設(shè)計(jì)稿，通常情況下，內(nèi)容區(qū)為750px或960px或者1080px的，一般不小于750px像素大?。▽挾龋┰O(shè)計(jì)稿可以比750px大，但是

HTML5移動(dòng)網(wǎng)頁(yè)的設(shè)計(jì)稿尺寸應(yīng)該是多少？

HTML5的移動(dòng)端網(wǎng)頁(yè)設(shè)計(jì)稿，通常情況下，內(nèi)容區(qū)為750px或960px或者1080px的，一般不小于750px像素大小（寬度）

設(shè)計(jì)稿可以比750px大，但是絕對(duì)不能比750px小，這個(gè)主要是由于當(dāng)前手機(jī)的分辨率相對(duì)較高（iPhone 6是375物理像素，但實(shí)際像素為其兩倍，也就是750，這個(gè)750就是這么來(lái)的）

如果設(shè)計(jì)圖稿過(guò)小，前端在實(shí)現(xiàn)圖稿的時(shí)候里面的圖片大小在高分辨率的情況下會(huì)顯得模糊不清，所以這也是為何要“大”分辨率

此外需要注意的是，要保證頁(yè)面的基準(zhǔn)字體大小，在320px的設(shè)計(jì)稿當(dāng)中，最小字體不宜小于12像素，其他像素的設(shè)計(jì)稿當(dāng)中，等比例換算即可（12/320px*設(shè)計(jì)稿像素值）

網(wǎng)頁(yè)設(shè)計(jì)最合適的頁(yè)面尺寸是多少？

很多新手設(shè)計(jì)師都會(huì)面對(duì)一個(gè)問(wèn)題，Web頁(yè)面尺寸寬度到底選哪個(gè)？其實(shí)答案并不是固定的，可以做成1920，也可以做1280。黑客認(rèn)為最重要的決定因素在于你自己的工作電腦分辨率。電腦屏幕尺寸這是廣告公司AdDuplex送出的統(tǒng)計(jì)大數(shù)據(jù)市面上的電腦屏幕尺寸多種多樣，不過(guò)大部分都集中在這幾種：1920-1080：目前常用設(shè)備中最大的尺寸（Mac 5K屏除外）1440-900：15寸MacBook Pro為代表，很多UI設(shè)計(jì)師首選1366-768：普通的PC電腦1280-800：13寸MacBook Pro為代表在以上設(shè)備中，13寸和15寸Mac Book，雖然實(shí)際分辨率非常大，但由于是Retina屏幕，視覺展示上還屬于以上范圍。所以，網(wǎng)站的內(nèi)容顯示寬度大部分都在1200px以內(nèi)，確保小的電腦屏幕能顯示全網(wǎng)頁(yè)內(nèi)容。更早的時(shí)候很多都是960px，不過(guò)由于屏幕越來(lái)越大，目前比較少。網(wǎng)頁(yè)設(shè)計(jì)尺寸在了解過(guò)電腦屏幕尺寸后，網(wǎng)頁(yè)設(shè)計(jì)尺寸（本文專指寬度，高度不限）選哪個(gè)也很清楚了：選哪個(gè)都不會(huì)錯(cuò)。事實(shí)上很多設(shè)計(jì)師是這么做的：用小于1920的屏幕去設(shè)計(jì)1920的網(wǎng)頁(yè)。這樣設(shè)計(jì)沒錯(cuò)，而且是很多培訓(xùn)機(jī)構(gòu)、學(xué)校的標(biāo)準(zhǔn)定義：網(wǎng)頁(yè)設(shè)計(jì)寬度尺寸是1920。結(jié)合插件定義設(shè)計(jì)尺寸但是如果你用了這個(gè)神器的Sketch插件，就不會(huì)按照之前的結(jié)論來(lái)設(shè)計(jì)了。以前黑客有介紹過(guò)。 點(diǎn)擊查看 設(shè)計(jì)師在做界面的過(guò)程中需要經(jīng)常查看設(shè)計(jì)稿，以便及時(shí)修改設(shè)計(jì)細(xì)節(jié)。除非你用1920的屏幕可以設(shè)計(jì)1920尺寸，否則我們的設(shè)計(jì)尺寸和屏幕尺寸不相同，就會(huì)導(dǎo)致預(yù)覽的界面偏移，需手動(dòng)調(diào)節(jié)居中。如果設(shè)計(jì)的尺寸和屏幕尺寸保持一致，那么插件預(yù)覽的效果就會(huì)完美，不用每次都要去調(diào)節(jié)。總結(jié)本質(zhì)上網(wǎng)頁(yè)設(shè)計(jì)尺寸選哪個(gè)都是正確的，關(guān)鍵在于怎么方便、快捷地幫助我們預(yù)覽、展示設(shè)計(jì)稿。在利用sketch插件頻繁預(yù)覽的前提下，黑客建議網(wǎng)頁(yè)設(shè)計(jì)尺寸等于你的工作電腦屏幕尺寸，這會(huì)節(jié)約你很多時(shí)間。在設(shè)計(jì)后臺(tái)類的界面時(shí)，這個(gè)方法的優(yōu)勢(shì)會(huì)更加明顯。最后有一點(diǎn)需要注意，在進(jìn)行切圖的時(shí)候，如果遇到全屏的圖，需要把切圖修改成1920，否則在1920電腦中切圖寬度會(huì)不足。不過(guò)到了切圖這一步，就屬于設(shè)計(jì)工作的后期了，我們只需要花點(diǎn)時(shí)間把對(duì)應(yīng)切圖改成1920即可。