网页设计与制作.pptVIP

第五章 网页设计与制作 教学要求： 了解网页设计中的相关概念与技术； 了解常用的网页制作软件； 掌握使用Dreamweaver进行网页设计的基本操作。 教学内容： 网页设计与制作概述 网页制作软件简介 Dreamweaver网页制作 Dreamweaver框架 Dreamweaver模板 网络测试和发布 5.1 网页设计与制作概述 网页、网站、主页、超链接和URL基本概念 网页设计与制作主要技术 网页设计与制作的主要原则 5.1.1基本概念 网页 网页是一个用超文本标记语言（HTML）描述的 文档，它是一个纯文本文件。HTML语言通过各式各 样的标记对页面上的文字、图片、表格、声音等元素 进行描述，并通过浏览器对这些标记进行解释以生成 实际的页面。网页有多种类型，分别用不同的后缀名 加以区分，如常见的“.htm”静态网页，以“.cgi”、 “.asp”、“.php”、“.jsp”等结尾的动态网页等。 网站 简单来说，网站就是一组逻辑上具有整体意义的 多个网页的集合，也就是说网站设计者事先规划好网 站构架，然后再分别制作出不同的网页，并通过超链 接实现网页间的彼此连通，这样完整的构架就称为 “网站”。网站通常有一个主题，如个人网站、音乐网 站、足球网站等。 5.1.1基本概念 主页 主页又叫首页，是用户进入一个网站时所看到的 第一个页面。主页的文件名通常为index或 default，扩展名依不同网页类型而定。与之对应， 和主页相链接的页面被称为“子页”。 超链接 超链接是WWW技术的核心，网页的出色之处就 在于能够把超链接嵌入其中，使用户能够从一个网页 方便地转移到另一个相关的网页。 URL URL是Uniform Resoure Locator的简写，被 译为“统一资源定位器”，主要用来定位网络信息资源 的地址或本地系统要访问的文件。 5.1.2 网页设计与制作主要技术 HTML语言 HTML是Hypertext Markup Language的缩写，它是一 种描述文档结构的语言。一个HTML文件中包含了所有将要显示 在网页上的内容信息，其中也包括对浏览器的指示，如文字应 放在何处，显示模式如何等。 一个用HTML语言描述的网页，其基本结构如下： !--网页的基本结构-- html head title第一个网页/title /head body centerfont size=4 color=blue这是我的第一个网页 /font/center /body /html 5.1.2 网页设计与制作主要技术 CSS CSS（Cascading Style Sheets）称为“层叠样 式表”，简称“样式表”，是一种设计网页样式的工 具。1997年，W3C颁布HTML4标准的同时也公布 了有关样式表的第一个标准CSS1，在CSS1版本之 后，又在1998年5月发布了CSS2版本。W3C把 DHTML（Dynamic HTML）分为三个部分来实现： 脚本语言（包括JavaScript、VBScript等）、支持 动态效果的浏览器（包括Internet Explorer、 Netscape Navigator等）和CSS样式表。 借助CSS的强大功能，可实现丰富的网页效果。 5.1.2 网页设计与制作主要技术 JavaScript JavaScript是由Netscape公司开发并随 Navigator2.0浏览器一起发布的。它是一种介于 Java与HTML之间、基于对象(Object)和事件驱动(Event Driven)、并具有安全性能的脚本语 言。 JS通常定义在页面头部，成为HTML文档的一部分。它是一种描述性语言，和HTML一样，用户可以用任何一种文本编辑工具对它进行编辑，并在浏览器中进行预览。同时，它也是一种解释性编程语言，即当用户向服务器请求页面资源时，其源代码在发往客户端前并不需经过编译，而是将文本格式的字符代码随HTML一起发送给客户端，完全由客户端浏览器来解释和执行。 5.1.2 网页设计与制作主要技术 图形图像处理技术 目前，常用的图形图像处理工具如Adobe公司的 Photoshop、Macromedia 公司的Fireworks等， 熟练掌握其中一种工具，对于制作漂亮的网页将起到 事半功倍的作用。 动画制作技术 目前，除传统的GIF