Question

Web网页设计尺寸，到底选哪个？

Answer 1

很多新手设计师都会面对一个问题，Web页面尺寸宽度到底选哪个？

其实答案并不是固定的，可以做成1920，也可以做1280。黑客认为最重要的决定因素在于你自己的工作电脑分辨率。

这是广告公司AdDuplex送出的统计大数据

市面上的电脑屏幕尺寸多种多样，不过大部分都集中在这几种：

1920-1080：目前常用设备中最大的尺寸（Mac 5K屏除外）

1440-900：15寸MacBook Pro为代表，很多UI设计师首选

1366-768：普通的PC电脑

1280-800：13寸MacBook Pro为代表

在以上设备中，13寸和15寸Mac Book，虽然实际分辨率非常大，但由于是Retina屏幕，视觉展示上还属于以上范围。

所以，网站的内容磨尘显示宽度大部分都在1200px以内，确保小的电脑屏幕能显示全网页内容。更早的时候很多都是960px，不过由于屏幕越来越大，目前比较少。

在了解过电脑屏幕尺寸后，网页设计尺寸（本文专指宽度，高度不限）选哪个也很清楚了：选哪个都不会错。

事实上很多设计师是这么做的：用小于1920的屏幕去设计1920的网页。

这样设计没错，而且是很多培训机构、学校的标准定义：网页设型游如计宽度尺寸是1920。

但是如果你用了这个神器的Sketch插件，就不会按照之前的结论来设计了。

以前黑客有介绍过。 点击查看

设计师在做界面的过程中需要经常查看设计稿，以便及时修改设计细节。除非你用1920的屏幕可以设计1920尺寸，否则我们的设计尺寸和屏幕尺寸不相同，就会导致预览的界面偏移，需手动调节居中。

如果设计的尺寸和屏幕尺寸保持一致，那么插件预览的效果就会完美，不用每次都要去调节。

本质上网页设计尺寸选哪个都是正确的，关键在于怎么方便、快捷地帮助我们预览、展示设计稿。

在利用sketch插件频繁预览的前提下，黑客建议网页设计尺寸等于你的工作电脑屏幕尺寸，这会节约你很多时间。在设计后台类的界面时卜启，这个方法的优势会更加明显。

最后有一点需要注意，在进行切图的时候，如果遇到全屏的图，需要把切图修改成1920，否则在1920电脑中切图宽度会不足。不过到了切图这一步，就属于设计工作的后期了，我们只需要花点时间把对应切图改成1920即可。

更多UI设计干货文章请关注UI黑客

微信公众号 uihacker

UI黑客官网 http://www.uihacker.com/

UI黑客论坛 http://bbs.uihacker.com/