一、界面布局准备
首先咱们要准备一个合适的画布。我建议用1920×1080的尺寸，这样的比例最适合现代显示器啦。打开PS后按Ctrl+N，记得把分辨率调到72像素/英寸，颜色模式选RGB哦。
小贴士：为了方便对齐，记得打开“视图-显示-网格”，再按Ctrl+R显示标尺，这样我们设计起来就贼方便啦！
二、网格系统设置
很多小伙伴一开始都随便摆放元素，结果做出来的页面歪七扭八的。其实利用网格系统，分分钟搞定整齐布局：
按Alt+Ctrl+；调出参考线 把页面横向分成12栏（这是行业标准啦） 两边留白80px，中间区域平均分配
这样做出来的界面，那叫一个舒服~
三、配色方案选择
选色这件事可把好多小伙伴愁坏了。小智教你一招：
先选一个主色调（比如#2196F3这种蓝色） 用PS的“色彩和色调”面板（在窗口菜单里） 选择“单色”，瞬间就能生成一套完美配色！
记住一点：主色调不要超过3个，强调色不要超过2个。不然你的页面就像七彩棒棒糖一样花哨啦！
四、质感细节处理
想让界面看起来高端大气，关键在细节：
阴影效果：
* 右键图层-混合选项-投影
* 距离设为2px
* 大小设为4px
* 不透明度调到40%
这样的阴影才不会看起来太重！ 2. 渐变背景：
* 新建图层按Shift+F5填充
* 选择渐变工具
* 角度45度
* 透明度设置30%
就能做出特别舒服的底色。
五、字体处理
排版可是大有讲究的：
标题：
* 字号24-32px
* 行高1.5倍
* 字间距+50
正文：
* 字号14-16px
* 行高1.8倍
* 段落间距20px
小技巧：中文正文最好用微软雅黑，英文用Roboto，这样搭配起来超级专业！
六、响应式布局准备
现在的网页必须要考虑手机端，所以我们要：
新建3个画板：
* 电脑端 1920px
* 平板端 768px
* 手机端 375px
快速转换技巧：
* 选中要调整的元素
* 按住Alt拖动控制点
* 自动等比例缩放
这样三端布局分分钟搞定！
最后的小建议
多用图层组整理元素 养成给图层命名的好习惯 常用样式可以存成样式预设 多把玩混合模式，能做出意想不到的效果
优网科技，优秀企业首选的互联网供应服务商
优网科技秉承"专业团队、品质服务" 的经营理念，诚信务实的服务了近万家客户，成为众多世界500强、集团和上市公司的长期合作伙伴！
优网科技成立于2001年，擅长网站建设、网站与各类业务系统深度整合，致力于提供完善的企业互联网解决方案。优网科技提供PC端网站建设（品牌展示型、官方门户型、营销商务型、电子商务型、信息门户型、DIY体验、720全景展厅及3D虚拟仿真）、移动端应用（手机站、APP开发）、微信定制开发（微信官网、微信商城、企业微信）、微信小程序定制开发等一系列互联网应用服务。
公安局备案号：
专属顾问
