学做网站培训课程介绍

当前位置:

怎么做静态页面,静态网页制作方法

所谓静态页面(又称静态网页)是指通过HTML和CSS等纯静态建站语言编写的网页。相对而言,我们制作的网站叫做动态网站。静态网页与动态网站的区别在于静态网页没有后台,不需要编程语言,也不能实现用户交互(如:注册、登录、搜索、查询等)。(更多区别可参考:网站制作与网页设计的区别

制作静态网页的作用是为了制作动态网站打下基础,制作网站前先制作静态网页,然后再将静态网页转化成动态网站。

静态网页静态网页

下面学做网站论坛介绍一下怎么做一个静态网页,静态网页制作方法。

第一步:制作一个静态网页之前,我们需要先制作一个网页1:1的效果图,又称静态网页效果图。制作静态网页效果图可以使用Photoshop CS4中文版制作。

第二步:将制作好的静态网页效果图进行PS切片。通过PS切片可将一张大的效果图切成多张小图片,以后可直接用在网页上。

第三步:使用HTML5和CSS3进行网页布局,网页布局遵从“先大后小,先外后里”的原则,先将整个静态网页大结构写出来,然后再按照效果图写各个部分的小版块。(这个部分需要有代码基础,可先学习HTML入门教程

第三:制作网页上的特效,例如轮播图,需要使用JS代码制作。再将PS切片出来的小图片通过代码插入网页中,并且使用测试数据填充各个小版块,达到与效果图一样的效果。

第四:最后优化网页代码,删除冗余的文件,整理出一个简洁的静态网页,这样静态网页就制作好了。

 

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

相关教程

  • 静态网页不显示图片 (119350 次浏览)
    作者: 脉动Email: 511039684@qq.com详细内容:今天听了老师讲的课程第九节:什么是网站静态页面,然后自己就动手去照着做,文字什么的都可以显
  • 在建站课程中,我们讲到网页设计和网站制作的区别,它们其实是两个不同的职业。其中一个操作就是把网页设计师设计好的图片转变成程序员可以用的代码,
  • 在课程我们讲到,我们在建站时,可以建立页面和分类目录,然后在网站导航上调用页面与分类目录。更换页面的顺序,我们可以在后台修改每个页面的排
  • DW中插入文字是最简单的操作,我们可以像在word一样随意的打出自己想要的文字。打开DW后,点击“设计”模式,在文字框中就可以打字了。插入文字可以是
  • 纯代码Wordpress前台投稿功能制作方法,很多建网站学员学习了Wordpress教程后,使用Wordpress 程序建了网站。但如果每天都是自己更新文章,感觉会有点
  • 很多网站都有对联广告,当我们打开它的网站的时候,会在屏幕的两边自动的出现二个对联广告,显的很醒目。网站对联广告对于做cpa,cps的朋友有很大