现在好看的网页很多，他们都是怎么做出来的呢？你想不想学做一张精美的网页图呢？其实制作网页的方式很多，下面我用PS的方式来跟大家简单分享下（一个完整的网页制作内部结构有一定的逻辑性，以一个网站页面制作为例接单介绍下）：
（1）首先打开PS软件，新建一个画布，设置尺寸是宽度1920像素，高度要根据需求设置，暂时设置为6000像素（注意单位要是像素）。
（2）网页图分为三部分：Head（头部）、Body（banner+内容）、foot(结尾），Head包含logo、公司名称、导航栏（网站 首页 关于我们 企业文化 联系我们）、联系电话、二维码等内容；Body部分包含banner图、详情内容介绍；foot(结尾）指的是更下面的索引部分。
（3）在作图的时候，要做好分组（ctrl+G），编辑好名称(双击图层文字即可编辑)，从上到下完成，便于及时修改。
（4）整体页面颜色步调一致。在作图时整个颜色不宜太多，一般不超过3个颜色，颜色差别也不宜太大，整体给人的感觉舒服、美观。
（5）参照线辅助。参考线作图比较常用，便于辅助图片文字对齐，达到整体的协调。
（6）做好切图。切图有两种方式，上次已经分享过不做赘述。切图是为了图片切成一张张小图，便于导出。
（7）页面存储。页面做好后点击新建-存储为web所用格式-存储-格式（选择HEML和图像），这样打开的图形就是切图的内容及网页的图，便于用户查看。
（8）查看代码。一个网页图查看代码只需要打开网页图右键点击“审查元素”就可以看到后台的代码组成了。
网页效果图成品如下：
成品
直接开始：
在Photoshop中新建文件
新建文档
使用矩形选区，选中工作区，再使用油漆桶工具填充颜色灰色，颜色的十六进制值为#e0dbdb
灰色
借助标尺来辅助工作区的分割：Ctrl+R（或者视图菜单里的“标尺”），从标尺上拖动得到参考线，放在计划位置（离左右边距200像素）
标尺辅助
header区域制作
•新建header图层组， –在图层组离新建图层“背景” –在背景顶部绘制矩形选区，高度 110像素 –填充颜色 #111111
•对header图层组里的背景图层设置样式 –内发光，杂色 100，大小 62，不透明度 10
header图层组里背景图层样式设置
•在背景底部添加阴影 –使用矩形选区工具绘制矩形选区，高度33像素 –使用渐变工具（ 左边颜色为黑色，右边不透明度为100% ），对矩形选区填充渐变。
底部阴影渐变填充
•添加LOGO图层
好了，网页图的制作就分享到这里啦，祝君好运~