《网页设计与制作》教学课件[优质ppt]
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
无论是文本还是图像都可以加上超链接标记，当鼠标指上超 链接对象时会变成小手形状，单击鼠标左键即可链接到相应 地址（URL）的网页。超链接包括站内链接和站外链接。
站内链接：若网站规划了多个主题版块，需要给网站的首页 加入超链接，让浏览者可以快速地转到感兴趣的页面。在各 个子页面也要有超级链接，并设有能够回到主页的链接。
1.什么是网页？
浏览Web时所看到的文件称为Web页，又称 为网页。网页可以将不同类型的多媒体信息 （包括文字、图像、动画、声音、视频等） 组合在一个文档中。由于这些文档是用超文 本标记语言表示的，其文件名一般是以.html 或.htm结尾，因此又称为HTML文档或超文本。
2.什么是主页？
9.HTML的基本结构
9.HTML的基本结构
<body>…</body>：用来指明文档的主体区域， <h始t网 结m和页 束l>结…所标束<要记/的h显<t/位mb示ol置>d的：y，>内告指其容诉明中都浏主包放览体括在器区h这eH域a个Td的部M标结分L记文束和内档b，o开d其y
提示：在网页中应用了某种字体样式后，如果浏览者的计 算机中没有安装该种样式的字体，字体就以计算机系统默认 的字体显示出来，此时就无法显示出网页的效果了。
图像在网页中可以起到提供信息、展示作品、美化 网页以及体现风格等功效。图像可以用作网页的标 题、网站Logo、网页背景、链接按钮、导航栏、网 页主图等。图像给人的视觉效果要比文字强烈得多， 在网页中灵活应用图像可以起到点缀的效果。虽然 图像在网页中不可或缺，但也不能太多，因为图像 的下载速度较慢，而且网页上如果放置了过多的图 片，会显得很乱，有喧宾夺主之势。
网站是提供各种信息和服务的基地，如用户熟悉的 搜狐、新浪、雅虎等。网站是由很多网页链接在一 起组成的。用户浏览到一个网站时看到的第一个页 面叫做主页。从主页出发，可以访问到本网站的每 一个页面，也可以链接到其他网站，方便地共享网 站资源。
注意
网站由若干网页组合而成。实质上就是一个 文件夹，用来存放站点相关信息资源的文件 夹。
在网页上点击鼠标右键，选择“查看源文 件”，就能很清楚地看到网页的代码结构。 用户可以使用记事本对网页中的文字、图片、 表格、多媒体等页面内容进行编辑，并通过 标记语言HTML对这些元素进行描述和控制， 最后由浏览器对这些标记进行解释并生成最 终呈现在用户眼前丰富多彩的网页。
4.什么是网站？
根据提供服务的不同，通常把提供网页服务的服务 器称为Web服务器，相关网站称为Web站点。一个 Web站点由一个或多个Web页组成，这些Web页相 互连接在一起，存放在Web服务器上，以供浏览者 访问。
站外链接：在个人网站上放置一些与网站主题有关的对外链 接，不但可以把好的网站介绍给浏览者，而且能使浏览者乐 意再度光临该网站。(友情链接)
表格是网页中的一种用于控制网页页面布局的有效 方法。为了达到理想的视觉效果，通常不显示表格 的边框。使用表格辅助布局，可以实现网页横竖分 明的风格。
表单是ຫໍສະໝຸດ Baidu种特殊的网页元素，通常用于收集信息或 实现一些交互式的效果。表单的主要功能是接收浏 览者在浏览器的输入信息，然后将这些信息发送到 服务器端。
当我们浏览网站时看到的第一个页面。它是 整个站点的入口和门面，通常这样命名： index.html。
3.什么是超文本？
包含文字、图像、视频、声音等媒体的文本， 网页就是一个超文本文件，并且可以实现链 接操作。
超文本可以给浏览者带来视觉和听觉的享受， 所以Web技术又称为超媒体技术。
注意
动态网页和静态网页不是从视觉上区分的， 比如动画效果，网页中包含可以动的元素并 不意味着就是动态网页，静态网页也可以有 动画。
请自行阅读课本中它们各自的特点
7.常用的网页设计软件有哪些？
FrontPage Dreamweaver
8.网页图像与网页动画制作软件
Photoshop Fireworks（.gif） Flash(.swf)
5.网页基本元素有哪些？都有什么作用？设计的时候要注意什 么？
网页包括的主要元素有：文本、图像、动画、 导航栏、超链接、表格、表单等。
文本是人类最重要的信息载体和交流工具，网页的 主体一般以文本为主。制作网页时，可以根据需要 设置文本的字体、字号、颜色、样式等属性，风格 独特的网页文本设置会给浏览者赏心悦目的感觉。
网页上的图像文件大部分都是使用JPG和GIF格式， 因为，它们除了具有压缩比例高外，还具有跨平台 特性。
动画是网页上最活跃的元素，通常制作优秀、 创意出众的动画是吸引浏览者的最有效的方 法。如果网页中存有太多的动画，会使浏览 者眼花缭乱，无心细看。所以，对动画制作 的要求越来越高。在网页中加入的动画一般 是GIF格式的动画和Flash（.swf）动画等。
6.动态网页和静态网页的区别
在网站设计中，纯粹HTML格式的网页通常称 为“静态网页”，它运行于客户端， 以.htm、.html、.shtml和.xml等为扩展名。静 态网页的内容仅仅是标准的HTML代码，静态 网页上也可以出现各种动态效果，如GIF格式 的动画、Flash动画等，这些“动态效果”只 是视觉上的，与下面将要介绍的动态网页是 不同的概念。
采用了动态网页技术，在服务器端运行的网 页和程序属于动态网页，它们会根据编写的
程序访问数据库动态地生成页面。动态网页
文件的后缀一般都 是.asp、.aspx、.php、.jsp。动态网页的优 点是效率高、更新快、移植性强，可以根据 先前所制定好的程序页面，根据用户的不同
请求返回其相应的数据，从而达到资源的最 大利用和节省服务器上的物理资源。
导航栏是网站设计者在规划网站结构时必须 考虑的一个问题，站点的每个网页上均应设 置导航栏，并且应将其放置在网页中比较明 显的位置。设置导航栏的目的是使浏览者能 够顺利地浏览网页，方便地返回主页或继续 下一页的访问。导航栏可以是文本、按钮或 图像的样式。
超链接是网页中最为有用的功能之一。超链接是从一个网页 指向另一个网页的链接，该链接既可以指向本地网站的另一 个网页，也可以指向世界各地的其他网页。
站内链接：若网站规划了多个主题版块，需要给网站的首页 加入超链接，让浏览者可以快速地转到感兴趣的页面。在各 个子页面也要有超级链接，并设有能够回到主页的链接。
1.什么是网页？
浏览Web时所看到的文件称为Web页，又称 为网页。网页可以将不同类型的多媒体信息 （包括文字、图像、动画、声音、视频等） 组合在一个文档中。由于这些文档是用超文 本标记语言表示的，其文件名一般是以.html 或.htm结尾，因此又称为HTML文档或超文本。
2.什么是主页？
9.HTML的基本结构
9.HTML的基本结构
<body>…</body>：用来指明文档的主体区域， <h始t网 结m和页 束l>结…所标束<要记/的h显<t/位mb示ol置>d的：y，>内告指其容诉明中都浏主包放览体括在器区h这eH域a个Td的部M标结分L记文束和内档b，o开d其y
提示：在网页中应用了某种字体样式后，如果浏览者的计 算机中没有安装该种样式的字体，字体就以计算机系统默认 的字体显示出来，此时就无法显示出网页的效果了。
图像在网页中可以起到提供信息、展示作品、美化 网页以及体现风格等功效。图像可以用作网页的标 题、网站Logo、网页背景、链接按钮、导航栏、网 页主图等。图像给人的视觉效果要比文字强烈得多， 在网页中灵活应用图像可以起到点缀的效果。虽然 图像在网页中不可或缺，但也不能太多，因为图像 的下载速度较慢，而且网页上如果放置了过多的图 片，会显得很乱，有喧宾夺主之势。
网站是提供各种信息和服务的基地，如用户熟悉的 搜狐、新浪、雅虎等。网站是由很多网页链接在一 起组成的。用户浏览到一个网站时看到的第一个页 面叫做主页。从主页出发，可以访问到本网站的每 一个页面，也可以链接到其他网站，方便地共享网 站资源。
注意
网站由若干网页组合而成。实质上就是一个 文件夹，用来存放站点相关信息资源的文件 夹。
在网页上点击鼠标右键，选择“查看源文 件”，就能很清楚地看到网页的代码结构。 用户可以使用记事本对网页中的文字、图片、 表格、多媒体等页面内容进行编辑，并通过 标记语言HTML对这些元素进行描述和控制， 最后由浏览器对这些标记进行解释并生成最 终呈现在用户眼前丰富多彩的网页。
4.什么是网站？
根据提供服务的不同，通常把提供网页服务的服务 器称为Web服务器，相关网站称为Web站点。一个 Web站点由一个或多个Web页组成，这些Web页相 互连接在一起，存放在Web服务器上，以供浏览者 访问。
站外链接：在个人网站上放置一些与网站主题有关的对外链 接，不但可以把好的网站介绍给浏览者，而且能使浏览者乐 意再度光临该网站。(友情链接)
表格是网页中的一种用于控制网页页面布局的有效 方法。为了达到理想的视觉效果，通常不显示表格 的边框。使用表格辅助布局，可以实现网页横竖分 明的风格。
表单是ຫໍສະໝຸດ Baidu种特殊的网页元素，通常用于收集信息或 实现一些交互式的效果。表单的主要功能是接收浏 览者在浏览器的输入信息，然后将这些信息发送到 服务器端。
当我们浏览网站时看到的第一个页面。它是 整个站点的入口和门面，通常这样命名： index.html。
3.什么是超文本？
包含文字、图像、视频、声音等媒体的文本， 网页就是一个超文本文件，并且可以实现链 接操作。
超文本可以给浏览者带来视觉和听觉的享受， 所以Web技术又称为超媒体技术。
注意
动态网页和静态网页不是从视觉上区分的， 比如动画效果，网页中包含可以动的元素并 不意味着就是动态网页，静态网页也可以有 动画。
请自行阅读课本中它们各自的特点
7.常用的网页设计软件有哪些？
FrontPage Dreamweaver
8.网页图像与网页动画制作软件
Photoshop Fireworks（.gif） Flash(.swf)
5.网页基本元素有哪些？都有什么作用？设计的时候要注意什 么？
网页包括的主要元素有：文本、图像、动画、 导航栏、超链接、表格、表单等。
文本是人类最重要的信息载体和交流工具，网页的 主体一般以文本为主。制作网页时，可以根据需要 设置文本的字体、字号、颜色、样式等属性，风格 独特的网页文本设置会给浏览者赏心悦目的感觉。
网页上的图像文件大部分都是使用JPG和GIF格式， 因为，它们除了具有压缩比例高外，还具有跨平台 特性。
动画是网页上最活跃的元素，通常制作优秀、 创意出众的动画是吸引浏览者的最有效的方 法。如果网页中存有太多的动画，会使浏览 者眼花缭乱，无心细看。所以，对动画制作 的要求越来越高。在网页中加入的动画一般 是GIF格式的动画和Flash（.swf）动画等。
6.动态网页和静态网页的区别
在网站设计中，纯粹HTML格式的网页通常称 为“静态网页”，它运行于客户端， 以.htm、.html、.shtml和.xml等为扩展名。静 态网页的内容仅仅是标准的HTML代码，静态 网页上也可以出现各种动态效果，如GIF格式 的动画、Flash动画等，这些“动态效果”只 是视觉上的，与下面将要介绍的动态网页是 不同的概念。
采用了动态网页技术，在服务器端运行的网 页和程序属于动态网页，它们会根据编写的
程序访问数据库动态地生成页面。动态网页
文件的后缀一般都 是.asp、.aspx、.php、.jsp。动态网页的优 点是效率高、更新快、移植性强，可以根据 先前所制定好的程序页面，根据用户的不同
请求返回其相应的数据，从而达到资源的最 大利用和节省服务器上的物理资源。
导航栏是网站设计者在规划网站结构时必须 考虑的一个问题，站点的每个网页上均应设 置导航栏，并且应将其放置在网页中比较明 显的位置。设置导航栏的目的是使浏览者能 够顺利地浏览网页，方便地返回主页或继续 下一页的访问。导航栏可以是文本、按钮或 图像的样式。
超链接是网页中最为有用的功能之一。超链接是从一个网页 指向另一个网页的链接，该链接既可以指向本地网站的另一 个网页，也可以指向世界各地的其他网页。