《可视化网页设计》由会员分享，可在线阅读，更多相关《可视化网页设计（30页珍藏版）》请在金锄头文库上搜索。
1、第第5章章 可视化网页设计可视化网页设计内容概要Web组件的使用2交互表单3网站发布4框架网页布局1多媒体网页设计教程多媒体网页设计教程复习：网站的创建与管理vFrontPage网站包含特定于网站包含特定于FrontPage的信的信息。与其他网站相同的是，它也包含网页、图形、息。与其他网站相同的是，它也包含网页、图形、文档以及多媒体文档以及多媒体几乎包括您需要的所有类型的几乎包括您需要的所有类型的文件。文件。v新建站点（演示创建新建站点（演示创建”走遍中国走遍中国“站点）站点）v使用使用“文件夹文件夹”视图管理站点内的所有文件视图管理站点内的所有文件多媒体网页设计教程多媒体网页设计教程复习：网
2、站管理功能与作用v添加、重命名、删除或移动文件（无需在添加、重命名、删除或移动文件（无需在MicrosoftWindows资源管理器中执行这些资源管理器中执行这些操作）操作）v使用特殊报告改正问题，如无效超链接报告使用特殊报告改正问题，如无效超链接报告v发布网站发布网站多媒体网页设计教程多媒体网页设计教程复习：网页布局表格v表格是网页设计中使用最频繁、最重要的元素之一，表格是网页设计中使用最频繁、最重要的元素之一，通常使用表格来排列数据、布局版面。用表格布局通常使用表格来排列数据、布局版面。用表格布局网页，便于网页元素的编辑和插入，提高网页的有网页，便于网页元素的编辑和插入，提高网页的有序性、
3、条理性、规划性；没有用表格布局的页面，序性、条理性、规划性；没有用表格布局的页面，在向页面中添加网页元素的时候往往会出现定位错在向页面中添加网页元素的时候往往会出现定位错误；使用表格布局还具有随意性，可以根据自己的误；使用表格布局还具有随意性，可以根据自己的喜好，自由地将表格拆分、合并和定位。喜好，自由地将表格拆分、合并和定位。多媒体网页设计教程多媒体网页设计教程表格的应用实例一多媒体网页设计教程多媒体网页设计教程表格的应用实例二多媒体网页设计教程多媒体网页设计教程想一想v在制作网页当中除了用表格进行定位，进行布局在制作网页当中除了用表格进行定位，进行布局之外，还有其他方法吗？之外，还有其他方
4、法吗？v“走遍中国走遍中国”网站左边的导航栏都一样的，是否网站左边的导航栏都一样的，是否可以抽取共同项呢？可以抽取共同项呢？多媒体网页设计教程多媒体网页设计教程网页布局框架v框架网页是一种网页，当在浏览器中显示时，框架网页框架网页是一种网页，当在浏览器中显示时，框架网页中具有多个称为框架的区域。每个框架中都可以显示不中具有多个称为框架的区域。每个框架中都可以显示不同的网页。同的网页。v框架网页本身并不包含可见内容，它只是一个容器，用框架网页本身并不包含可见内容，它只是一个容器，用于指定要在框架中显示的其他网页及其显示方式。于指定要在框架中显示的其他网页及其显示方式。多媒体网页设计教程多媒体网页
5、设计教程框架网页的用途v框架网页通常用于目录、文章或信息列表、或任何框架网页通常用于目录、文章或信息列表、或任何其他类型的网页（在一个框架中单击超链接并在另其他类型的网页（在一个框架中单击超链接并在另一个框架中显示相应网页）。作者使用框架网页是一个框架中显示相应网页）。作者使用框架网页是因为框架网页能够包含内置导航并显示一致的用户因为框架网页能够包含内置导航并显示一致的用户界面。界面。多媒体网页设计教程多媒体网页设计教程框架网页范例多媒体网页设计教程多媒体网页设计教程框架网页的制作v使用使用FrontPage中的框架网页网站模板可以创建框架中的框架网页网站模板可以创建框架网页。网页。比如：使用
6、比如：使用“横幅和目录横幅和目录”框架网页框架网页模板创建的框架网页实际上在浏览器模板创建的框架网页实际上在浏览器中同时显示四个网页。中同时显示四个网页。 框架网页框架网页横幅框架横幅框架目录框架目录框架主框架主框架多媒体网页设计教程多媒体网页设计教程框架网页的保存问题v保存的文件名保存的文件名v各个区域的名称各个区域的名称多媒体网页设计教程多媒体网页设计教程框架布局与表格布局的区别v框架是一种特殊的网页布局，之所以说特殊是因为框架是一种特殊的网页布局，之所以说特殊是因为它并不是真正意义上的网页布局工具。表格和布局它并不是真正意义上的网页布局工具。表格和布局表格是在现有的一个页面上将网页进行区
7、块的划分，表格是在现有的一个页面上将网页进行区块的划分，然后在这些区块中填入网页元素，而然后在这些区块中填入网页元素，而“框架框架”只给只给网页分区，而不提供实际内容，每个框架都可以显网页分区，而不提供实际内容，每个框架都可以显示独立内容的网页，也就是说有框架的网页可以根示独立内容的网页，也就是说有框架的网页可以根据框架数同时显示多个独立内容的网页。据框架数同时显示多个独立内容的网页。多媒体网页设计教程多媒体网页设计教程演示框架网页布局实例v“全球生物全球生物”框架网页布局框架网页布局多媒体网页设计教程多媒体网页设计教程Web组件的使用v(1)滚动字幕滚动字幕v(2)交互式按钮交互式按钮v(3
8、)站点计数器站点计数器v(4)图片库图片库多媒体网页设计教程多媒体网页设计教程滚动字幕v字幕实际上是滚动的文本，比如网站内的一些重字幕实际上是滚动的文本，比如网站内的一些重要的通知信息往往以字幕方式显示，这样主要是要的通知信息往往以字幕方式显示，这样主要是为了引起访问者的注意。为了引起访问者的注意。多媒体网页设计教程多媒体网页设计教程交互式按钮 v交互式按钮，是交互式按钮，是FrontPage2003提供的动态按提供的动态按钮，当用户鼠标移动或单击按钮时，它会发生形钮，当用户鼠标移动或单击按钮时，它会发生形状和颜色的变化。状和颜色的变化。 多媒体网页设计教程多媒体网页设计教程站点计数器 v站点
9、计数器，统计站点访问次数，基本上每个网站点计数器，统计站点访问次数，基本上每个网站都有一个站点计数器。站都有一个站点计数器。注意：站点计数器需要服务器的支持才能正常显示。多媒体网页设计教程多媒体网页设计教程图片库 vFrontPage2003中提供了自定义图片集的图片中提供了自定义图片集的图片库功能，使用该功能可以创建包含特定布局排列库功能，使用该功能可以创建包含特定布局排列图片集的网页。图片集的网页。多媒体网页设计教程多媒体网页设计教程表单的作用v一个站点在设计过程中，除了内容丰富、布局合理、一个站点在设计过程中，除了内容丰富、布局合理、颜色协调、具有时代感和创新性之外，还有一点是颜色协调、
10、具有时代感和创新性之外，还有一点是非常重要的，那就是网站的交互性。网站的交互性非常重要的，那就是网站的交互性。网站的交互性一般是通过表单程序来实现的，网页浏览者将信息一般是通过表单程序来实现的，网页浏览者将信息通过表单发送到通过表单发送到Web服务器端，服务器端，web服务器接收服务器接收做出相应的回应，最终将反馈信息返回到个人的浏做出相应的回应，最终将反馈信息返回到个人的浏览器。览器。FrontPage2003拥有强大的表单制作功拥有强大的表单制作功能，可以轻松地制作出完善的表单页面。能，可以轻松地制作出完善的表单页面。多媒体网页设计教程多媒体网页设计教程表单v表单是实现网页互动的元素。与客
11、户端或服务器表单是实现网页互动的元素。与客户端或服务器端脚本结合使用，可以实现互动性。端脚本结合使用，可以实现互动性。多媒体网页设计教程多媒体网页设计教程表单的构成v表单由表单域组成，表单域的构成如下表单由表单域组成，表单域的构成如下:文本框 ：提供输入单行的文本 选项按钮 ：提供单选或者多选 复选按纽 ：提供选择并列的选项 多媒体网页设计教程多媒体网页设计教程表单组件（1）多媒体网页设计教程多媒体网页设计教程表单组件（2）多媒体网页设计教程多媒体网页设计教程演示创建表单v通过范例（创建一个用户注册的表单）通过范例（创建一个用户注册的表单）多媒体网页设计教程多媒体网页设计教程保存表单的内容v表
12、单制作完成后，表单的交互功能还需要进一步表单制作完成后，表单的交互功能还需要进一步的设置，收集表单的数据。的设置，收集表单的数据。v注意：表单需要注意：表单需要Web服务器提供必要的技术支持，服务器提供必要的技术支持，Web服务器安装配置服务器安装配置FrontPageServerExtensions、MicrosoftSharePointTeamServices或脚本程序。或脚本程序。多媒体网页设计教程多媒体网页设计教程网站发布v网站制作完成后，将自己的成果发布到网站制作完成后，将自己的成果发布到Internet上，实现信息共享。上，实现信息共享。FrontPage2003提供网站提供网站发布的工具。发布的工具。多媒体网页设计教程多媒体网页设计教程上机作业v按照实验指导：按照实验指导：v第第5章章5.4节节实验实验1-3v第第5章章5.5节节实验实验1、2v第第5章章5.6节节实验实验1、2v以以“走遍中国走遍中国”网站或者网站或者“秀我风采秀我风采”网站制作网站制作一个简单的个人静态网站（主题可以自定义）一个简单的个人静态网站（主题可以自定义）-网站文件夹压缩提交到作业系统网站文件夹压缩提交到作业系统v多媒体网页设计教程多媒体网页设计教程课后作业：v阅读阅读网页制作与设计教程网页制作与设计教程第第5章章v多媒体网页设计教程多媒体网页设计教程
