13964452023
谢邀，以前回答过类似九游娱乐的问题，由于具体设计的风格会影响到尺寸的选择，所以请根据具体的需要来做尺寸选择。
由于移动端的web和APP的设计规范不一样，web统一按照72dpi分辨率设计，具体移动端小屏幕的设计尺寸的宽度断点按照320px还是640px还是750px（我的PSD设计稿一般是按照750宽度，iphone6的尺寸，但是是按照72dpi来设计，前端一般能轻易支持320宽的小屏幕），要让你的设计能够被前端采纳，总之， 你的设计要能满足前端开发的需要，更多时候的响应式，前端可以直接在你的大分辨率下解决。（你的设计要尽量遵从前端标准，要尽可能满足前端开发的需要）
当然你现在需要考虑retina屏幕，设计尽量用矢量，如果是照片，请考虑@2x的图片切图。（让然大部分中国的web没那么高要求，retina的适应很多时候用户都不会去要求）
根据比较新的数据整理收集，适应于2014~2015+，自己经过多次实践整理和调整后的一些数据，非严格数据，仅供参考使用。
设计规范需要学习，设计时需要作为一个参考，根据具体的设计，目标用户，访问设备等去约束自己的设计，有了规范才能将设计的细节价值体现出来，才能更好的符合W3C的标准。当然题主只是问了尺寸的相关东西，web设计还有很多必须掌握而且有难度的规范，比如中英文字体，色彩等。
规范并不是命令，不是说你必须按照这些数值来设计，而是作为一个参考更好的拟定自己设计时的数值。
▇ 设计稿（photoshop文件）常用分辨率参照，自己整理的常用的数值 ▇
自己以前的一套web设计得公开课，对响应式等分辨率做了详细的一些操作和总结。有需要可以参考一下
补充：2022年了，也许大家会认为2016年的答案，可能易经过时了。其实并不是，设计的东西，都脱离不了基础，设计的东西，无非就是工具的演变和效率提升(比如Figma)。本质上的基础是不会变的。所以不论我提供的的视频教程还是参考资料，都是不限年限的，并没有实时性，它们并不会过期。设计并不等于设计软件，软件运用只是工具。代码的时效性稍微会强一些（编程语言的基础、数据结构等知识并不会过时，但是框架，代码规范和风格等等很容易过时）
如果你觉得2016年的教程已经过时了，你大可以直接跳过Photoshop做设计稿，直接学Figma在线工具去做一套界面，它提供了非常便捷丰富的设计组件，快速高效。当你脱离了这种生产工具的时候，你会发现Photoshop你啥也不会，更别说去思考一个设计，去实现一个设计。可能用一张纸笔去绘制设计稿，都会成为阻碍。就目前2022年来说，大多时候web做一套1920的稿件，再做一套移动端的稿件，比如1334x750(72dpi)的就足够用了（前端可以将它缩小一半作为常规尺寸参考，同时使用设计稿尺寸满足Retina的要求，WEB是需要前端来输出的，设计稿尺寸并不能决定实际项目的尺寸，但是设计稿换算成72dpi的像素参考是需要前端使用的数值），要学会节约时间提高效率，一味追求多种尺寸的不同布局的设计，是浪费，做好适配性就可以。APP的建议做大一点，比如按照iPhone X或12的标准去做，APP要考虑3x甚至4x的图片，这个只要和你的开发伙伴交流一下确定下尺寸就可以了。而且现在大量常规的App，是可以直接使用figma这种工具快速成型的，而无需考虑尺寸。比较复杂的界面设计，还是需要Photoshop能手细化图形。至于APP的设计，APP的切图规则和web是不一样的，你可以去找APP相关的规范。web现在几乎不需要切图，前端熟练的话直接代码成型，取设计稿里面的素材图片就行，字体大小可以看看设计稿数值。有时候一个1920的web稿件就够用了，无需花时间再给一个移动设计稿，当然前端如果不懂设计，那还是需要提供一个移动搞给他。最后，如果做的App是混合开发技术或者渐进式 Web 应用(PWA)，不是纯原生，按照web标准做稿就可以,现在做APP成本越来越低，大部分公司都会选择成本低周期短的方式去开发（大金主无所谓，几百万开发一个原生的都很正常）。总之，参考资料需要你根据实际工作经验灵活判断选择，完全可以只提供1~2个尺寸作为自己的标准稿件，我这两个参考尺寸也是国外项目大多数稿件的web交付尺寸。当然如果你要求很细，时间很多，你大可以做四五种不同尺寸不同布局的设计稿，当然我觉得完全没有必要，PC端一种布局，移动端一种布局就可以了，开发用代码能力去做好适配性即可。我自己做开发的话，如果稿件不复杂，我只需要设计师提供一个1920的给我即可，移动端根据自己的经验直接代码响应或者自适应化。如果内容复杂，还是需要提供一个移动端的界面给我参考，节约代码输出时间。
目前的响应式设计一般考虑四类尺寸（宽度，高度一般按照 9:16 的比例进行推算，再减掉浏览器上下的导航栏高度）：
手机：360px（5寸左右的手机，最小一般兼容到320px即可，再往下的机子基本都是淘汰的差不多了，可以不用管了）
平板：361 - 1024 px（现在即便11寸的笔记本也不大会用到1024的分辨率了，所以直接划入平板）
主流PC显示器：1025 - 1920 px（1080P是目前桌面显示器的主流）
超清PC显示器：1921 - 5120 px（主要考虑2K、4K、5K等超高分辨率，为未来考虑）
响应式设计的正确流程，应该是移动优先的，然后逐渐放大到更大的尺寸，因此应该优先设计手机端的样式，而不是设计好传统的桌面网站之后再去尝试压缩到手机上。至于如何设计移动Web的界面这里就不细述了，相信各位设计师朋友们都有自己的创意。
平板端基本就是放大版的移动端，直接照搬即可完成75%的工作，但直接照搬的话单个元素会显得太大，毕竟页面分辨率是之前的差不多 3 倍。因此平板端的布局可以比在手机端多划分几列，比如在手机端直接一个 ListView 下来的设计，到平板端可以分成 2~3 列，在手机端全屏宽度的按钮，在平板端会显得太长，可以考虑适当缩短，保留足够的高度以供手指点按即可，在移动端必须要隐藏的导航、菜单等可以考虑直接展示出来，以填补多出来的空间。
这个没什么好讲的，传统的 Web 设计想必大家早已经轻车熟路了。这里唯一要注意的是保持布局的连贯性，响应式设计的 PC 端是由平板端放大和适配而来的，可以展示更多的内容，但不应该和平板端差别太多，要确保用户能够识别出两者是同一个网站。
这在过去是不需要考虑的，那时候 1080P 还是个很火热的概念，1024px 还是笔记本的分辨率。但现在随着 2K/4K 屏的逐渐普及，这部分用户的占比开始一点点多起来，问题逐渐凸显，变得不可忽视了。没有特别适配方案的网页在这些环境下看起来会有两种变化：原本适配全屏的页面会被拉伸得太宽，原本固定宽度的页面两侧会留下大片的空白。面对这样的事实，需要设计师们在设计适配方案的时候考虑到页面在这些设备上的样子。
注意视网膜屏的 Pixel Ratio 是非视网膜屏的 2 倍，同样一个像素在视网膜屏上会用九游娱乐4倍的像素数量来显示，因此如果要为视网膜屏优化的话，需要额外为所有图片素材再准备一份 2 倍尺寸稿给前端同学。但是界面的布局不用改，依然按照 1 倍尺寸去设计，只要把 2 种分辨率的图片素材都给到前端同学就好，他们知道怎么做的。（对技术原理感兴趣的可以找身边的前端同学沟通下感情，这里就不赘述了）
现在的移动设备都支持横竖屏，因此要考虑到这个问题，通常两种解决办法：一种是在响应式的设计中添加横屏对应的分辨率的断点，单独去适配。另一种是只考虑一种方向，当设备切换到另一种方向时提示当前页面不支持在这种方向下查看，引导用户将设备调整到期望的方向。两种方案都很常见，大家根据业务需要进行选择。
移动端的 WebView 基本是 Webkit 的天下，无论 Android 还是 iOS 都是，因此对现代 Web 技术的支持度都还不错（移动版的 Firefox 和 Edge 只占了极少部分的市场，除非和 Mozilla / Microsoft 有业务上的合作，否则可以不用管）。但是鉴于众多第三方浏览器客观上的存在，在一些技术细节上还是会有差异，具体细节需要和前端同学多沟通，有些效果在特定的环境下可能会无法实现。
桌面端其实也差不多，Chrome 占领了半壁江山，Safari 和 Firefox 也有不少用户但大差不差，以上这些对于现代 Web 技术的支持度都非常不错，国产浏览器的极速/高速内核基本就是1年前的Chrome，没有落后太多。问题主要出在 IE 身上，由于 Win7/XP 庞大的遗留用户群导致还有很多小白用户依然在使用 IE8 —— XP用户能够升级到的最高版本，Win7的默认浏览器，一个对现代 Web 技术支持度极差的浏览器（当然这个要结合时代背景来看，在发布当时其实还凑合，但放到现在来说，整个 IE 系列都是过时的，连微软自己都已经彻底放弃转投 Edge 了），但事实摆在这里，如果一定要兼容的话前端同学会比较头大，需要些一大堆 Hack Code，很多现代化的框架和新技术都早就不再支持 IE8 了。个人建议为这个世界做点贡献，不要再支持 IE 11及更早的版本了，引导这部分用户去升级他们的浏览器（甚至操作系统），从大局来讲这是一项对大家都有利的事情，开发者和用户都可以充分享受新技术带来的好处。
哦对了，这个世界上还有一种浏览器叫 Opera，曾经一度辉煌但现在基本没声音了，市场占有率可以忽略，抱了 Blink 的大腿之后完全可以当它就是 Chrome。
服务热线 13964452023 