web前端 静态网页制作步骤
web前端静态网页的制作流程：制作静态网页效果图——将制作好的静态网页效果图进行PS切片——使用HTML5和CSS3进行网页布局——使用JS代码制作特效——最后优化网页代码，删除冗余的文件。
第一步：制作一个静态网页之前，我们需要先制作一个网页1:1的效果图，又称静态网页效果图。制作静态网页效果图可以使用Photoshop CS4中文版制作。
第二步：将制作好的静态网页效果图进行PS切片。通过PS切片可将一张大的效果图切成多张小图片，以后可直接用在网页上。
第三步：使用HTML5和CSS3进行网页布局，网页布局遵从“先大后小，先外后里”的原则，先将整个静态网页大结构写出来，然后再按照效果图写各个部分的小版块。(这个部分需要有代码基础，可先学习HTML入门教程)
第四步：制作网页上的特效，例如轮播图，需要使用JS代码制作。再将PS切片出来的小图片通过代码插入网页中，并且使用测试数据填充各个小版块，达到与效果图一样的效果。
第五步：最后优化网页代码，删除冗余的文件，整理出一个简洁的静态网页，这样静态网页就制作好了。
web静态网页的特点
1、静态网页每个网页都有一个固定的url，以.html、.htm、.shtml等常见形式为后缀，url中通常不会带有“?、&、=”等参数。
2、每个静态网页都会生成一个服务器文件，一般是以.html、.htm、.shtml等常见形式为后缀的文件，无论有无用户访问都会存在，每个网页都是一个独立文件。
3、由于静态网页，不会调用数据库，不需要数据库作支撑，在我们维护的是时候，就需要针对每个页面做处理，或者是去修改模板信息，再去生成文件，还是比较麻烦的，网页数量少点还好，一旦网页数量过大，就非常麻烦了。
4、静态文件内容不会经常变动，相对稳定，页面加载速度快，利于搜索引擎检索，也就是对seo有好处。
5、静态网页交互性比较差，很多功能没法实现，但是能减少很多数据调用请求，减少服务器压力，降低了数据库的成本。
静态网页与动态网页的区别
1、网页制作语言上的区别
静态网页使用超文本标记语言(标准通用标记语言的一个应用)，也就是顶部会标记一个html。
动态网页使用语言：超文本标记语言+ASP或超文本标记语言+PHP或超文本标记语言+JSP等。
2、程序运行端口的差异
静态页面则在客户端就能直接运行，网页数据和信息，除非人为去更改，否则不会有变化。
动态网页需要在服务器端运行，直接调用服务器数据，根据不同用户，不同的行为返回不同的网页和数据。
3、关于两者区别简单的直接描述
(1)、静态页面是设计者把页面上所有内容都设定好、做死了，然后放在空间里，不管是谁在任何时候看到的页面内容都是一样的，一成不变(除非手动修改页面内容)。静态html页面文件，可以直接用本地的浏览器打开。
(2)、动态页面的内容一般都是依靠服务器端的程序来生成的，不同人、不同时候访问页面，显示的内容都可能不同。网页设计者在写好服务器端的页面程序后，不需要手工控制，页面内容会按照页面程序的安排自动更改变换。
