网站设计与评价课件

第四章网站设计与评价1PPT学习交流本章重点：1、了解网站的基本结构，了解静态网页与动态网页的工作原理及常用的网站建设技术。2、能够基本运用FrontPage中的工具创建一个简单的网站。3、了解网站是如何发布、管理、更新和维护。2PPT学习交流基本概念网站就是因特网上具有相似性质、共同内容的一组信息资源。网页（Page）网页网页是用HTML语言写成的文件，它存放在某一台计算机中，而这台计算机必须是与因特网相连。网页文件最好以英文命名，并通常以“.htm”或者“.html”为扩展名，以保证在浏览器中的正常解析。第一节第一节 了解与设计网站了解与设计网站3PPT学习交流构成一个网站的基本元素是各种各样的文件以及存放这些文件的文件夹。网页文件，用来描述资结构、位置，引导浏览者访问该网站，通常以“.htm”或者“.html”为扩展名。网页文件所连接到的图像、音频与视频等资源文件Web数据库和程序文件4PPT学习交流基本概念主页（HomePage）主页主页是通常用来表示访问某个网站时出现的第一个页面，用来对整个网站进行概括性的介绍，描述其他各个页面的内容的。主页文件常以index或default命名，并通常用的扩展名有.htm.html.jsp.asp等。IEIE的主页的主页表示IE浏览器启动时，即访问的网页地址。可以是一个网站的主页，也可以是一个普通的网页文件。5PPT学习交流基本概念网站的结构网站是由网页组成的，网站是网页的集合体，网页是网站的元素。网站的结构网站的结构就是指某一网站的信息组合的基本框架，它显示该网站中各个网页之间的逻辑关系。层次适当：一般以3到4层为佳拓展性广：能够容纳信息的多变性和扩展性6PPT学习交流基本概念网站的结构主要有三种类型：树状树状结构结构线性线性结构结构网状网状结构结构7PPT学习交流树状结构：整个网站以主页作为中心，向外分散出多个分支。树状结构是目前网站所采用的主要形式之一，它结构清晰，访问者可以根据路径清楚的知道所在位置。但在建立枝干的层次时，最多不应超过四个。8PPT学习交流线性结构：线状结构是网站最简单的结构方式，网页一层层链接起来，逻辑清晰。单向线状只提供往下一层网页的链接；双向环状除了像单向线状那样链接外，还可以倒着从网页3回到网页2，从网页2回到网页1。无论是单向线状还是双向环状都不能在网页之间自由跳跃链接。9PPT学习交流网状结构：在网络结构中有一个主页，所有的网页都可以和主页进行链接，同时，各个网页之间也随意链接。网页之间没有明显的结构，像一张网一样，可相互链接，随意跳转。如果网页信息内容不能科学分类，访问者容易在网页跳转过程中迷失方向，很难快速找到所需要的信息。10PPT学习交流网页制作工具第一类是源代码型编辑工具代表产品有HotDog、HomeSite、EditPlus等。第二类是“所见即所得”编辑工具代表产品有FrontPage、Dreamweaver等。11PPT学习交流网页制作工具工具名称工具名称FrontPageFrontPageDreamweaverDreamweaver简介简介微软微软OfficeOffice组件之一，著名组件之一，著名的的“所见即所得所见即所得”的网页编的网页编辑软件，是很好的入门级网辑软件，是很好的入门级网页编辑工具页编辑工具MacromediaMacromedia公司针公司针对专业网页设计师对专业网页设计师特别发展的视觉化特别发展的视觉化网页开发工具网页开发工具优点优点功能强大，操作简单易学、功能强大，操作简单易学、灵活方便，站点管理功能强灵活方便，站点管理功能强大大对平台和浏览器的对平台和浏览器的兼容性好，对动态兼容性好，对动态效果的支持性好效果的支持性好缺点缺点兼容性不好；生成的垃圾代兼容性不好；生成的垃圾代码多；对动态效果支持不好码多；对动态效果支持不好站点管理功能弱，站点管理功能弱，对中文支持不好对中文支持不好12PPT学习交流网页制作工具HTML文档本身是文本格式的文件，可由任何一种文本编辑软件如写字板、记事本和Word等进行编辑，保存后，把文件扩展名改为.htm或.html，就可用浏览器浏览到相应的网页。HTML语言就是通过一系列特定的标签（Tag），来标识出相应的意义和作用，再通过浏览器把这些标签所代表的意义表示出来。13PPT学习交流确定网点主题设计网站风格（标志，主色调，文字效果，版面布局）规划网站结构了解网站运行环境选择网站开发工具分配网站开发任务第二节第二节 网站建设网站建设14PPT学习交流一、建立站点建立自己的主题网站，首先需要创建一个Web站点，用于保存和调试创建的网页。新建的网站首先要保存在本地硬盘上，待整个网站建好之后再发布。方法：执行“文件”“新建”“站点”，打开“新建站点对话框”注意：不需要去注意：不需要去D盘建盘建立立“080701”文件夹。文件夹。15PPT学习交流1、表格、框架布局网页表格在网页中的作用有条理地组织数据控制网页布局插入表格以及表格基本操作“表格-插入”可以用表格工具栏手动绘制表格。表格、单元格的属性设置给表格、单元格添加颜色使用嵌套表格等16PPT学习交流所谓框架是将一个浏览器的窗口分割成两个或两个以上的窗格，每个显示区域叫做一个框架。每个框架可以显示一个独立的网页，一般情况下，可以用框架来保持网页中固定的几个部分，如网页大标题、链接按钮等，剩下的框架用来展现所选择的网页内容。框架网页的创建与其基本操作“文件-新建-框架网页”17PPT学习交流2、添加网页元素编辑文字1.菜单栏：“格式”“字体”，打开字体对话框，如右图。2.选中需要编辑的文字，右击，选择“字体”菜单命令，打开字体对话框，如右图。3.“格式”工具栏18PPT学习交流3、添加网页元素插入图片在网页中最常用的是GIF和JPG格式的图片，因为这两种图片的文件比较小，有利于提高网页的浏览速度。（“插入”-“图片”-“来自文件”）插入其他格式的图片插入其他格式的图片后，在进行页面存储后，在进行页面存储时，系统会自动将图时，系统会自动将图片格式转换成片格式转换成GIF或或JPF格式。格式。注意注意“图片图片”工具条的使用工具条的使用19PPT学习交流4、添加网页元素插入动画（GIF格式）提示：在“普通”模式中插入动画之后，默认只显示动画的第一帧图像，是静止的，进入“预览”模式后，就可以看见其动态效果了。“插入”-“图片”-“来自文件”20PPT学习交流5、添加网页元素插入动画（Flash）“插入”“高级”“插件”，打开“插件属性”对话框。通过“数据源”中的“浏览”找到所用的Flash动画文件21PPT学习交流6、添加网页元素插入视频“插入”“图片”“视频”，打开“视频”对话框。右击视频，选择右击视频，选择“图片属性图片属性”命令，并切换到命令，并切换到“视频视频”选项卡，可以对视频做进一步的选项卡，可以对视频做进一步的设置。设置。支持的视频格式：支持的视频格式：.avi.avi.asf.asf.ram.ram.ra.ra22PPT学习交流7、添加网页元素插入背景音乐方法：在网页的空白处右击，选择“网页属性”“常规”选项卡“背景音乐。23PPT学习交流8、建立超链接超链接源文本、图片（整张图片、图片热点）超链接目标网站内部超链接网页文件图片、音频、视频等多媒体文件一些压缩文件网站外部超链接URL（统一资源定位器）超链接E-mail地址超链接（单击该连接向对方发送电子邮件，不需要输入对方的E-mail地址）24PPT学习交流设置文本超链接的方法1、选定要加入超链接的文本2、按下工具栏上的“超链接”按钮或者选择“插入”菜单下“超链接”再或者右击所选文本，选择“超链接”，打开“创建超链接”对话框。3、选择或输入超链接目标超链接目标地址25PPT学习交流设置整张图片超链接的方法1、选定要加入超链接的图片2、按下工具栏上的“超链接”按钮或者选择“插入”菜单下“超链接”再或者右击所选图片3、选择或输入超链接目标26PPT学习交流超链接的颜色在网页中有三种不同状态的超链接（颜色不同）：未访问过的超链接正在访问的超链接已经访问过的超链接设置方法：在“网页属性”的“背景”选项卡中进行设置。27PPT学习交流9、保存及预览网页文件保存文件时，文件以英文命名。（Windows网络操作系统对英文大小写不敏感。）保存主页时，通常以“Index.html”命名。在保存文件过程中，将网页所使用到的图片文件，存于“images”文件夹中。文件保存后，单击网页编辑窗口下方的“预览”标签，观察效果。28PPT学习交流1、网页中的内容的检查：拼写错误、内容与栏目的一致性等2、网站中页面链接状态检查：要保证每一个网页有入口，有出口 （可结合“报表与超链接”视图检查）3、网站中所用到的多媒体元素检查：格式恰当、大小合适4、外观测试 版面布局、文字效果、动态效果等 要在不同的浏览器中进行测试第三节第三节 网站的发布、管理与评价网站的发布、管理与评价29PPT学习交流网站的发布1、局域网内本机发布（11）利用IISIIS（因特网信息服务器）在局域网内可实现网站的发布。发布为默认WEB站点，在本机可通过 或 访问。其他用户通过IP地址直接访问网站。30PPT学习交流确定IP地址及端口号（一般采用如图设置）31PPT学习交流确定网站所在的文件夹位置（一般采用英文命名）32PPT学习交流确定网站主页文件名，并将其升到顶端33PPT学习交流1、局域网内本机发布（12）利用IIS的虚拟目录在局域网内可实现一个IP地址发布多个网站。用户通过“IP地址/（虚拟目录）别名”访问网站。34PPT学习交流35PPT学习交流36PPT学习交流37PPT学习交流38PPT学习交流39PPT学习交流网站的发布网站的发布2、在因特网上发布 使用因特网上的WEB服务器，选择合适的网站空间，实现网站在因特网上发布。购买自己的服务器（自管、托管）租用专用服务器租用虚拟主机 （以上三种需向（以上三种需向ISPISP申请申请IPIP，向，向CNNICCNNIC注册域名）注册域名）申请个人主页空间（免费、收费）40PPT学习交流网站的维护与管理网站的维护与管理1、上传网页文件：一般使用FTP方式2、定期维护：网页维护、网页更新、网站升级3、宣传网站：到搜索引擎上注册、与别人交换友情链接、通过BBS宣传等41PPT学习交流此课件下载可自行编辑修改，供参考！感谢您的支持，我们努力做得更好！42PPT学习交流