网页设计与制作研究与探讨.docVIP

网页设计与制作研究与探讨 　　摘 要:如今的互联网正如火如荼地发展着。伴随着上网人数的增长,网络技术应用特别是网页制作技术得到了很多人的青睐,网页制作软件Dreamweaver是使用最为广泛,也是最为优秀的可视化网页设计工具。在Dreamweaver中,使用表格、层、框架、布局视图和布局工具作网页排版,使用表单、超级链接制作交互网页。在网页中插入图形和图像,插入Flash动画,使网页图文并茂,五彩缤纷。 　　关键词:静态网页 动态网页 超级链接 表单 网站 事件 行为 　　中图分类号:G434文献标识码:A 文章编号:1673-1875(2009)14-038-01 　　 　　如今的互联网正如火如荼地发展着。伴随着上网人数的增长,像网上影院、网上书店以及电子商务等新生事物给人们的生活、工作和学习带来了极大的便捷,正在影响和改变着人们的生活方式。现代人掌握网络方面的知识不但是一种时尚,更是生活中必需的、基本的技能。在这一浪潮中,网络技术应用特别是网页制作技术得到了很多人的青睐。网页制作软件Dreamweaver CS3是使用最为广泛,也是最为优秀的可视化网页设计工具。 　　 　　一、基本概念 　　 　　网站是信息交流的载体或空间,而网页则是人与人之间交流的直接窗口。网站也叫站点,是提供各种信息和服务的基地。很多网页链接在一起就组成了一个网站。网页是一种可以在互联网上传输,能被浏览器认识和翻译成页面并显示出来的文件,网页是网站的基本构成元素。在网站设计中,纯粹HTML格式的网页通常称为“静态网页”。这里说的动态网页,与网页上的各种动画、滚动字幕等视觉上的“动态效果”没有直接关系,动态网页可以是纯文字内容的,也可以包含各种动画的内容,这些只是网页具体内容的表现形式,无论网页是否具有动态效果,采用动态网站技术生成的网页都称为动态网页。 　　 　　二、网页的布局与定位 　　 　　网页布局也称为网页排版,也是网页设计中的一项基本的工作之一。 　　(一)使用表格布局 　　表格是网页设计与制作时不可缺少的重要元素,它可以简洁明了和高效快捷的方式,将数据、文本、图像、表单等元素有序地显示在页面上,从而设计出版式漂亮的网页[2]。 　　(二)布局工具和布局视图 　　Dreamweaver提供了专门的布局工具和布局视图。进入布局视图后,点取布局工具在页面上拖动,可以随意的在页面上划出单元格,避免了采用表格布局时对单元格的合并、拆分操作,使定位布局更加方便。 　　(三)利用层进行布局 　　Dreamweaver中除了使用布局工具进行布局外,层也可以作为一种更加灵活的布局工具。一个层相当于一个单元格,而且可以非常灵活地在页面上移动。一个网页中可以有多个层,层与层之间可以相互重叠。有了层就使网页的布局工作变得更加随心所欲。层的用途不仅仅限于布局,还可以在层中输入文字或图像,用来在网页中制作漂浮的动画[3]。 　　层是一种网页元素的定位技术,使用层可以以像素为单元精确定位页面元素。层可以放置在页面的任意位置,把页面元素放入层可以对页面的布局更加轻松。简单地说,层就是网页内容的容器。它同表格一样,可以容纳网页中的所有内容,还可以实现层的嵌套。层最主要的特性是可以在网页中任意浮动。在层内可以包含文本、图像、表单、插件。层可以重叠,所以在网页中可以实现网页内容的重叠效果,使网页从二维平面拓展到三维立体。层可以被显示或隐藏,总之,使用层可以更方便地美化网页。 　　(四)使用框架布局 　　框架也可以被认为是另一种布局工具。框架可以将一个浏览器窗口分割成几个相互独立的窗口,在不同的窗口中输入和显示不同的内容,框架中的不同窗口,又分为“导航窗口”和“内容窗口”。“导航窗口”通常容纳的内容较少,不提供滚动条,并且窗口较小;“内容窗口”供显示内容之用,提供滚动条,而且窗口较大。 　　 　　三、事件与行为 　　 　　行为是为响应某一具体事件而采用的一个或多个动作,行为是由对象、事件、事件和动作构成,当指定的事件触发时,将运行相应的Java Script程序,执行相应的动作。Dreamweaver提供了丰富的内置行为,利用这些行为,不需要编写任何代码就可以实现一些强大的交互性功能。再来了解一下三个词语:1、事件:是浏览器对每一个网页元素的响应途径,与具体的网页对象相关。2、动作:是一段事先编辑好的脚本,可用来选择某些特殊的任务,如播放声音、打开浏览器窗口、弹出菜单等。3、行为:实质上是事件和动作的合成体。事件是触发动作的原因,它可以被附加到各种页面元素上,也可以被附加到HTML标记中。一个事件总是针对页面元素或标记而言[1]。 　　在Dreamweaver CS3中,无需编写触发事件及动作脚本代码,直接利用行为面板中的各项