如何用Photoshop 制作网页？该从哪里入手呢？

界面设计有一定的设计规范，在设计规范的基础上可以较快的入门和进阶。
页面构成
一个网页通常来说会有一个导航条（nav），一个页脚（footer）和一个内容区域（body）。各个页面（二级页面）通过导航条的链接来访问。通过内容区域的链接和列表来访问其他详细页面（三级页面）。因此，通常，一个简单的CMS（内容管理系统，也可简单称之为新闻系统或博客）,通常有首页indexhtml列表listhtml正文/详情showhtml三个页面组成。
页面模块区域
知道了页面的结构和组成，就可以在页面的内容上入手了。内容的设计和制作有一定的规范，简单说，就是链接看上去可以点击，按钮看上去像个按钮，文本框看上去可以输入，保留默认控件的识别性和可用性（单选、复选，手机端通常为左右滑动式，PC端则常委纽扣式，这种是符合设备 *** 作体验的变化和设计），注意观察网页范例，可以整理出诸如页面头部：logo+导航+其他主导航下拉菜单搜索框幻灯片文字列表列表选项卡/滑动门列表评论列表表单区域等多种展示方式的模块。
页面规划和设计
严格意义上讲，页面的设计除了根据设计师的创意来设计外，还包含一个需求分析设计。需求分析是根据实际的需求（假设我是做新闻的，我希望多以列表的形式展示；我是做商城的，我希望多以图文列表的形式展示等）分析来设计展示形式，以内容的权重（哪个模块更重要或更有意义）来布局。设计师创意则相对灵活，只需要把整理好的模块按照你的想法布局就可以。
页面的尺寸，严格说是没有限制的，但，常规布局的页面（如微博、腾讯等一些门户）都是按照显示器的实际尺寸（适应1024768的分辨率）来设计的，这个就是960grid栅格，flash整站则没有太多要求（它可以适时缩放，就像播放的），手机端的设备则需要考虑普通的分辨率尺寸（320480等）。
因此，设计师通常是建立一个尺寸比较适中的新文档，然后建立对应的尺寸的页面文档，后者作为辅助图形拖入第一个文档中，然后开始建立辅助线，比如：新建14403000的文档，保存之。再建立9603000的文档，按下V键，点击文档，不松开鼠标拖动到第一个文档中，使用对齐方式居中顶对齐，从标尺拖出辅助线即可。
细节和效果
页面设计不同于排版，页面的设计还是需要适当考虑到实际的制作的，有些效果看上去很炫很酷，但通过代码是无法实现的（网页通常都会书写程html文件使用），那么，我们就需要对一些效果有所了解，知己知彼，才能游刃有余。
良好的视觉效果，可以让站点看上去更有冲击力和亲和力（不同的风格有不同的感受），而视觉效果的设计除了活用素材混合模式、滤镜和调色外，还需要你有一定的审美情趣，以前是说眼高手低，而今，就要说眼低手高了，很多效果看到懂，就是想不到，总是看到别人的东西的时候大呼这样也可以啊？
细节的把握是比较锻炼的，这点推荐你去看一下图标和UI设计的一些案例iconfans，你可以学会如何使用铅笔调整像素级的细节，也可以学会使用钢笔画笔绘制天马行空的图形，还可以学会输出清晰、锐利的图形图像，还可以学会设计更有体验意义的模块和结构（不要小看体验和设计，试想，太小的文字或图标，看不清不说，相信你也点击不到，而这就是体验）。
其他
PS网页设计除了要求你具有设计的功底，还需要你有良好的工具使用习惯，这里主要说2点——素材整理和图层 *** 作。
素材整理，PS中比较灵活的素材就是字体笔刷样式图案，其中样式尤为重要，你出来使用网上下载的素材外，平时自己经常使用的也可以新建到样式列表中，并且，注意及时备份你的样式列表（偶尔重装一下系统或换一台电脑，你应该不想再建样式库吧）。图案通常可以快速的铺设一些复杂的背景纹路（如：古典图案和格子、像素点阵等）和背景（如：木纹背景），字体还用说吗？
图层 *** 作，图层 *** 作除了简单的图层样式控制外，你还要学会使用Ctrl+G，图层打组，图层打组可以很好的管理你的图层和设置（一个网页通常会有N多个图层，打组可以压缩图层列表的高度，还可以把相关的模块整合在一起），给予适当的命名，你大海捞针就变的轻松多了~~~
暂时这么多，大早晨的光给你码字了~~

我这样说，你应该能理解，你把你喜欢的网页截屏，然后打开PS，粘贴进去，用PS的各种工具修改为你喜欢的样式，然后用切片工具切成一块一块的，比如导航栏、菜单栏、滚动横幅等等如此，完了用dreamwaver或者其他网页制作工具，写点简单的代码把这些切片一块一块的连接起来，这样就完成了一个简单的静态页面，如果你学会了这一步，那么恭喜你你已经入门了！接下来就可以进一步学习网页制作的其他内容，一般从HTML+CSS+JAVASCRIPT学起，配合你的PS技术做网页前端比较容易入手！

根据楼主的提问可以把问题分成2块理解
第一层怎么用PS软件设计网页
这个的话，一般你看上好看的网站之后保存为格式
导入到PS软件，调整好网页的大小，针对性的地方进行修改便可。
第二层的理解是你不知道怎么把把设计好的网页导出为WEB所有格式。
简单的格式的保存为网页格式的话
第一、在PS里面设计好网页
第二、利用切片工具把网页切成一块一块，要想提高页面访问速度的话就切片切的小一点
第三、保存为WEB所有格式 （及HTML） 这样的话你直接打开HTML的话
就形成了页面访问的网页了。

---