网页设计与制作应用教程 第2版 教学课件 ppt 作者 王任华 第1章

网页设计与制作应用教程（第2版）,机械工业出版社同名教材 配套电子课件,主要内容,第一部分 网页设计与制作基础 第二部分 Adobe Dreamweaver CS5 网页制作 第三部分 Adobe Fireworks CS5 网页图片处理 第四部分Adobe Flash CS5 网页动画制作,2,第一章 Internet与网页设计概述,1.1 Internet 概述 1.2 网站规划设计概述 1.3 网页设计基础,1.1 Internet 概述,Internet 与TCP/IP协议 IP地址和域名 Internet提供的主要服务 WWW 简介 浏览器服务器模式,1.1 Internet 概述,Internet 与 TCP/IP协议 Internet 即国际计算机互联网，在中国也称“因特网”或“万维网”，是由符合TCP/IP等网络协议的网络组成的互联 网。,表1-1 TCP/IP模型和OSI参考模型对照关系,IP地址和域名,IP 地址由网络地址（netid）和主机地址（hostid）两部分组成。网络地址标识了主机所在的逻辑网络，主机地址则用来标识网络中的一台主机。,IP 地址是一个32位的二进制数, 为了便于记忆，分成四组，每组八位二进制数。但通常采用十进制表示，即每个字节的二进制数转换成十进制数，每个十进制数之间用圆点“.”隔开，这叫做“点分法十进制”。 例如： 11001010 11001110 11000000 01000010 表示成： 202 . 206 . 192 . 66,1.1 Internet 概述,IP地址的类型 IP 地址中的网络地址是由Internet 网络中心来统一分配的。为了根据不同的网络规模来合理分配IP 地址，IP地址分为A B C 三个基本类。,1.1 Internet 概述,域名,IP地址能唯一标识网上的主机地址，但为了便于记忆，为此提供了一种域名系统DNS，域名和IP 地址之间存在一一对应的关系，域名由四部分组成。 格式为： 计算机名.组织机构名.二级域名.顶级域名,例如：公安大学域名： www . ppsuc . edu . cn,1.1 Internet 概述,Internet提供的主要服务,Internet 为我们提供了信息获取、发布和交流的渠道，其服务功能包括：,WWW 服务 电子邮件 文件的下载和上传 FTP（文件传输）服务 Usenet News（新闻组）和BBS（电子公告牌）服务 Telnet（远程登录）服务 网上游戏 个人主页空间 电子商务,1.1 Internet 概述,WWW 简介,浏览器与网页 统一资源定位器（URL） 超文本 超文本置标语言HTML HTTP 主页 常用搜索引擎,浏览器服务器模式,1.1 Internet 概述,1.2 网站规划设计概述,网站规划设计是指在网站建设前对市场进行分析，确定网站的目的和功能，并根据需要对网站建设中的技术、内容、费用、测试、维护等做出规划。,网站设计流程,编写网站设计的计划书 确定网站设计总体思想，即网站设计如何能实现网站规划中提出的目标，以及网站的风格和特点，网页的外观与使用方面的特点 确定网站提供的内容 网站交互设计，如信息反馈、意见调查等 对网站的内容进行分类 设计网页必有的内容，如公司标志、联系方法和导航条等 制作网页的模板 检查网页的链接 根据需要修改不合适的地方 正式发布网站,1.2 网站规划设计概述,确定网站的类型,门户网站 搜索引擎 电子商务网站 数据中心 主题信息网站 团体网站 个人网站,网站的建设技术,静态网页技术 动态网页技术,1.3 网页设计基础,网页设计规划,1. 确定网页的整体风格,2. 设计网页框架,图1-2 个人网页框架草图,网页的基本元素,1.3 网页设计基础,文本 图片和动画 声音和视频 超链接 表格 表单 导航栏 其它常见元素,网页布局,网页布局的常用技术如下:,CSS（层叠样式表）布局 表格布局 框架布局,1.3 网页设计基础,网页布局类型,“国”字型布局 拐角型布局 标题正文型布局 左右框架型布局 上下框架型布局 封面型布局 Flash 型布局,1.3 网页设计基础,网页设计工具简介,1.网页制作工具,文本编辑器 FrontPage Dreamweaver Adobe Pagemill,2.网页图形图像处理工具,Fireworks Photoshop CorelDraw,3.网页动画制作与特效工具,Flash Ulead Gif Animator,1.3 网页设计基础,网页三剑客,Adobe 公司的Dreamweaver、Fireworks 和Flash 系列产品，素有网页“三剑客”之称。它们是专门用于网页制作和站点管理的软件。其中Dreamweaver 被大家称为“织梦者”，众多专业网站和个人主页都把它列为首选工具。Flash 是“三剑客”中的“闪电”，其以网上动画为特长，它做出的动画效果真是精美致极。Fireworks 是“三剑客”中的“火焰”，它以处理页面图片为特长，并可以轻松制作GIF 动画。,本章小结,本章作为教程的开篇内容，介绍了网页设计的入门知识，主要包括：了解Internet 与网页设计的基本概念的内容，如Internet 的概念、网络提供的服务；了解网站设计的基础内容，如设计网站的类型、网站的规划及相关技术；掌握网站制作的基础知识，如构成网页的基本要素、网页的布局；以及网页设计与制作的工具软件等环节的知识。,思考与练习,简述你所了解的网站就功能实现所涉及的类型有哪些？ 网站主页的布局有哪些风格？ 简述“网页三剑客”软件中Dreamweaver、Fireworks、Flash 软件的功能特点。,