1、先用Photeshop类制图软件，设计出版面和风格。2、按照设计的放个裁切出使用的图片元素。3、用dreamweaver网页编辑软件进行html页面生成。主要使用DIV+CSS设计。首页*为主要，栏目页 和内容也一般保留首页的顶部和底部。侧面导航和相关信息也基本统一形式。如果是学习，多参考其他网站的切图和CSS样式的设计。本回答由提问者推荐

1 屏幕布局1）内容应占据网页的大部分空间，至少应占一半，好接近80%，导航部分应不超过20%。2）使用空白区而不是粗线条或广告来分隔不同内容。3）颜色选择•除了图片和图像之外，不要使用太多的颜色来修饰某个对象。
•正文和背景色的对比度要大。•正文区和其它的功能区（如工具条、菜单条等）应使用不同的背景色。4）可读性•标题区、标题行和正文区应使用不同大小的字体。•使用静止的正文，而不要用移动、闪烁或变焦的文字。
•字体应足够大，字体太小（小于10个像素单位）会降低可读性。•不要将字体设置成*尺寸，应尽量使用相对尺寸。•使用统一的字体，不要混合使用多种字体，否则会降低阅读速度。5）可浏览性•每个网页都应该有标题，且网页标题应该清楚地表明网页的内容。
•句子/段落应简短，每句不超过20个词，每段不超过5个句子。•每个网页都应按照“倒金字塔”原则进行编写，即从一个简单的结论开始渐次展开。•使用排版印刷的设计风格，横向排列信息，以符合用户的阅读习惯。
2 内容设计1）范围•网站的内容应既能达到网站设计目标，又能满足用户的期望。•网站的内容应及时更新，以反映当前的*新状态。2）准确性•写作质量要高，没有语法、拼写和排版错误。•文章应该分段，这样用户容易理解。
•那些既向用户提供信息，又允许用户进行评论的网页，应明确区分信息区和评论区。3）著作权•每篇文章或文档应标明作者姓名等相关信息。•应提供相应的参考文献。•应介绍站点拥有者的背景资料，如公司图标、名字、地址、电话号码和email地址等。
4）实效性•应标明网站所用资源的产生日期。•应指出网页的*近修改时间。5）提供选择功能•应该有输出或打印的格式选择。•让不同的用户选择不同的语言来显示网页。6）链接•指明哪些链接指向本页面，哪些链接指向本站点的其它页面，哪些链接指向其它站点。
•应有指向相关网站的链接。•应有指向网站主办单位的链接。3 网页设计1）网页的大小网页的大小不应超过30000字节，以使用户在10秒钟之内能打开网页。2）链接•为链接加上描述信息。
•当一个链接被点击后，要把所有指向同一目标的链接都表示成已被访问过。•在链接旁注明下载文件的大小，帮助用户预测下载时间。3）框架只有在必要时才使用框架。4）在每一页的相同位置放置本网站标志。4 可访问性1）下载速度•下载网页的时间应使用户能够接受，一般来说在10-20秒之间。
2）浏览器的兼容性•保证网页能被所有主要的浏览器兼容。•保证网页能被同一浏览器的不同版本兼容。•保证网页能被不同类型的显示器（如单色显示器和数字电视等）兼容。3）搜索功能•提供本网站内的搜索能帮助用户更快地查找到所需的信息。
4）网站的可访问性•利用META标记为搜索引擎提供本网页的关键词和描述信息。•按照规范向搜索引擎提交信息以保证站点能够被搜索到。5）网站内容的可访问性• 为多媒体（声音、动画等）提供等价的文本形式，以便使那些只能使用纯文本浏览器的用户能够获得网页的内容。
同样，应为那些不能阅读和阅读困难的用户（如盲人）提供与文字等价的内容（如声音文件等）。5 媒体的使用1）音频，动画和视频 •只有在必要时（如示范、教学、演讲等）才使用。•避免循环播放。•下载时应显示文件的类型和大小，以便让用户决定是否有必要等待。
2）图形和图像•只有当图形或图像真正有助于用户对信息的理解时才使用它。•使用图像的缩略图技术。•不要在搜索页面中使用图形。•在必须使用图形的时候，可多次使用同一个图形。6 与用户的沟通（交互性）•在网站上提供网站所有者的email地址和联机表单，以便获取用户对网站的反馈意见。
•提供网上论坛、网络会议等功能，让用户能够共享观点和进行讨论。7 导航•每页中都应设有返回主页的链接。•应该把站点的内容按类别分组（一般应为7组左右）。•用户找到所需内容的点击链接次数要尽可能少（一般不应超过3次）。
•应该保证用户点击链接时不会出现网页不存在的情况。•应提供站点结构图以帮助用户更快地找到所需的信息。•为用户提供反馈信息，告诉他目前在站点中的位置。8 一致性•网页布局应一致。
•文本的字型、字体和颜色应保持一致。•导航帮助（如菜单条、按钮等）应一致。更详细的可以参看原文。