你们好，最近小活发现有诸多的小伙伴们对于ps做网页设计教程，ps网页设计这个问题都颇为感兴趣的，今天小活为大家梳理了下，一起往下看看吧。
1、打开PS，新建一个名为飞飞工作室的空白文档，在预设大小下拉列表中选择“1024 x 768”，设置模式为“RGB颜色”，内容为“白色”，点击“确定”完成文档创建。
2、新建一个图层，命名为“框架”，用这个图层实现整个网页的整体布局。首先选择“矩形选择工具”，然后将矩形的宽度设置为1024，高度设置为80，在文档的上下框中选择一部分内容，用黑色填充。
(资料图片仅供参考)
3、从而使整个网页呈现“宽屏”效果。
4、在背景层上面新建一层，命名为“背景色”。单击矩形选择工具，将宽度设置为400，高度设置为768，然后在窗口的左框架中选择一个部分，并用深绿色填充。然后点击“矩形选择工具”，
5、将宽度设置为624，高度设置为768，然后选择窗口右边框的一部分内容，用浅绿色填充。用两种颜色饱和度稍有差异的颜色填充，以便产生更明显的对比。
6、在“框架”层的顶部创建一个名为“主体元素”的新层。打开一张事先准备好的百合图片，双击“背景”图层转换为“0层”，点击“魔棒”工具，在图片的白色区域点击，选中白色区域。
7、按DEL键删除白色区域。然后将图片拖放到图层“body element”上，如图。
8、然后选择矩形选择工具，设置宽度为624，高度为768，然后在窗口中选择花朵右侧的一部分，调整其亮度和对比度，使花朵左右两侧呈现明显的对比。
9、调整页面细节，添加一些导航栏、信息提示和版权信息，最后做出如图所示的成品页面。
10、选择切片工具，然后对内容进行切片。分割的好处是有利于文件在网络上的传输，同时在使用切片工具分割内容时，最好将需要替换为文本内容的部分独立分割出来。分割后的效果如图。
11、找到保存文件的位置，打开" feifeistudio.html "文件，然后在内容区点击右键，选择“查看源文件”，就会发现对应的网页内容已经生成。至此，使用PS设计网页内容完成。
以上就是ps网页设计这篇文章的一些介绍，希望对大家有所帮助。
