传统的PS网页设计已经跟不上当下流式布局趋势的发展。PS无法制作适用于所有移动设备尺寸的版本。如果PS页面太多，期间修改一个普通的东西就会牵一发而动全身。网页效果设计新思路：用html+css+less来完成你的任务！老流程：P图在网页设计过程中，效果图通常是用Photoshop制作的。几十上百层和各种PS效果确实做出了网页的风格效果，也很容易将图片分块或者直接从中获取一些图片素材。新思路：P图太多，需要修改的小地方很多怎么办？如果用在响应式网站的设计中，内容必须采用流体布局，就需要针对每种情况做PS渲染，工作量巨大，显得不切实际。另外，当你需要修改网页中某个元素的大小或背景时，手动逐个修改PS效果图是一场噩梦。这引发了对设计过程和工具使用的新思考：能否在尽可能贴近和覆盖各种真实使用环境的同时方便修改？答：网页效果图设计的新思路答案是放弃原来用PS制作效果图的方法，改用HTML和CSS构建真正的基础网页效果，最终以截图的形式得到效果图给客户看。当客户对某个地方提出修改时，你回去实施修改会非常容易。只需要修改CSS中的一两行代码；如果少用，有时只需要改变一个变量值就可以达到预期的效果。影响。也许你会批评这是混淆了样式设计和前端代码构建的功能？其实HTML、CSS等只是制作效果图的工具。当然网站效果的轮廓前后差不多，但这不是最终的前端代码，只是用于基本的效果展示。最后，网站前端实现的代码结构还关系到后台输出、适配组件复用、浏览器兼容性等。可以说，它们是完全不同的东西。不要害怕学习改变，这对网页设计师提出了更高的要求，不用Photoshop就可以学习基本的前端语言。在新时代，网页设计已经不可能像平面设计那样专攻图形图像了。还需要结合web技术，让设计更贴近浏览器的真实环境，同时也减少不必要的重复劳动。也许Photoshop仍然是固定布局设计的最佳工具，但响应式设计和流体布局的浪潮正在到来。只有突破传统设计，结合网页技术，才能走在前列，才能赢在未来。很多年前我就开始尝试混合使用PS和前端技术，收到的效果非常好。尤其是对于独立开发者来说，我们往往要同时做UI设计和前端开发。如果在UI端使用HTML和CSS，后续的开发过程会更简单。你会发现在前端开发的时候可以参考或者复用它们。有很多，省去你反复敲Emmet的时间。
