动态网页设计第1章 网站规划与设计PPT课件
合集下载
动态网站开发基础第一章网站开发基础20130314
1.3 HTML
• HTML（Hyper Text Mark-up Language ）即 超文本标记语言，是 WWW 的描述语言，由 Tim Berners-lee提出。设计 HTML 语言的目 的是为了能把存放在一台电脑中的文本或图形 与另一台电脑中的文本或图形方便地联系在一 起，形成有机的整体，人们不用考虑具体信息 是在当前电脑上还是在网络的其它电脑上。
</body>
</html>
1.6 脚本语言
客户端脚本示例2 • <html ><head> • <title>inputbox函数</title> • <script language=vbs> • dim input • input=inputbox ("输入名字") • msgbox ("输入" & input) • </script></head><body></body></html>
使用FTP访问站点的URL的最简单的形式为： Ftp:// <主机域名>:<端口>/<路径>
例如： Ftp:// /jgx/web.rar
FTP的默认端口号是21，一般可省略。但有时 也可以使用另外的端口号。
1.6 脚本语言
• 脚本是指嵌入到Web页中的程序代码，所使 用的编程语言称为脚本语言。按照执行方式和 位置的不同，脚本分为客户端脚本和服务器端 脚本。
statement [exit for] Next
循环结构语句格式2：
do while 条件表达式 循环体
Loop
动态网站开发教程课件ch01
清华大学出版社
1.1.1 HTTP协议
HTTP（Hyper Text Transfer Protocol） 协议，即超文本传输协议是在Internet中进 行信息传送的协议，浏览器默认使用这个 协议。
从浏览器向Web服务器发出的搜索某个 Web网页的请求叫做HTTP请求。
2019年12月23日
2019年12月23日
第9页
动态网站开发教程（第三版 ）
清华大学出版社
1.1.4 Web的访问原理
Web应用程序是基于B/S结构的。
客户端和服务器端。一般来说，凡是提供 服务的一方称为服务器端，而接受服务的 一方称为客户端。
2019年12月23日
第10页
动态网站开发教程（第三版 ）
2019年12月23日
第12页
动态网站开发教程（第三版 ）
清华大学出版社
静态网页的工作原理 ：
静态网页中可以包括GIF动画，鼠标经过 Flash按钮时，按钮可能会发生变化。静态 网页一经制成，内容就不会再变化，不管 何人何时访问，显示的都是一样的内容。 如果要修改网页的内容，就必须修改其源 代码，然后重新上传到服务器。
清华大学出版社
自己的计算机 （客户端）
2019年12月23日
搜狐服务器
（服务器端）
第11页
动态网站开发教程（第三版 ）
静态网页的工作原理 ：
清华大学出版社
静态网页也称为普通网页，是相对动态网 页而言的。静态并不是指网页中的元素都 是静止不动的，而是指网页文件里没有程 序代码，只有HTML（超文本标记语言）标 记，一般后缀为 . htm、. html、. shtml或 . xml等 。
掌握安装的集成开发环境VS2010的方 法
动态网页设计第1章网站规划与设计精品PPT课件
▪ 电子商务网站的需求调研还必须对竞争对手进行调查 分析，了解竞争对手网站的主要业务、网站的基本架 构、营运策略等，从而学习竞争对手的长处，吸取竞 争对手的经验，突出自己的优势。
2020/10/9
动态网页设计（Dreamweaver CS3+）
7
1.2 网站需求调研
❖1.2.3 企业网站需求调研的步骤
2020/10/9
动态网页设计（Dreamweaver CS3+）
6
1.2 网站需求调研
❖1.2.2 企业网站需求调研的意义
▪ 需求调研的质量决定了企业网站的质量。只有明确了 网站建设所要实现的功能及想要达到的目的，才能使 后续的网站规划与设计有基本的依据。
▪ 网站的需求调研主要解决的问题是明确网站的使用者、 建设网站的主要目的、核心的业务流程、网站建设的 技术条件、用户群之间的关系等。
中国水利水电出版社
主 编 张德芬 副主编 邓之宏
第1章 网站规划与设计
第1章 网站规划与设计
1.1 任务概述 1.2 网站需求调研
1.3 网站建设可行性分析 1.4 网站规划书的内容
1.5 企业网站设计
1.6 任务实现
2020/10/9
动态网页设计（Dreamweaver CS3+）
3
本章要点
❖ 企业网站需求调研的步骤 ❖ 企业网站技术可行性分析 ❖ 企业网站经济可行性分析 ❖ 企业网站规划书的内容 ❖ 企业网站内容设计 ❖ 企业网站功能设计 ❖ 企业网站形象设计 ❖ 企业网站结构设计
2020/10/9
动态网页设计（Dreamweaver CS3+）
4
1.1 任务概述：撰写企业网站规划书
▪ 2、实施需求调研
2020/10/9
动态网页设计（Dreamweaver CS3+）
7
1.2 网站需求调研
❖1.2.3 企业网站需求调研的步骤
2020/10/9
动态网页设计（Dreamweaver CS3+）
6
1.2 网站需求调研
❖1.2.2 企业网站需求调研的意义
▪ 需求调研的质量决定了企业网站的质量。只有明确了 网站建设所要实现的功能及想要达到的目的，才能使 后续的网站规划与设计有基本的依据。
▪ 网站的需求调研主要解决的问题是明确网站的使用者、 建设网站的主要目的、核心的业务流程、网站建设的 技术条件、用户群之间的关系等。
中国水利水电出版社
主 编 张德芬 副主编 邓之宏
第1章 网站规划与设计
第1章 网站规划与设计
1.1 任务概述 1.2 网站需求调研
1.3 网站建设可行性分析 1.4 网站规划书的内容
1.5 企业网站设计
1.6 任务实现
2020/10/9
动态网页设计（Dreamweaver CS3+）
3
本章要点
❖ 企业网站需求调研的步骤 ❖ 企业网站技术可行性分析 ❖ 企业网站经济可行性分析 ❖ 企业网站规划书的内容 ❖ 企业网站内容设计 ❖ 企业网站功能设计 ❖ 企业网站形象设计 ❖ 企业网站结构设计
2020/10/9
动态网页设计（Dreamweaver CS3+）
4
1.1 任务概述：撰写企业网站规划书
▪ 2、实施需求调研
动态网页设计与制作1PPT课件
. gycm .com
WEBPAGE DESIGN
服务器配置方案
. gycm .com
WEBPAGE DESIGN
2. Web常见术语
服务器
是指网络环境中的高性能计算机，它侦听网络上其他计算机提交 的服务请求，并提供相应的服务。为此，服务器必须具有承担服 务并且保证服务质量的能力，往往需要安装并设置相应的服务软 件，有时则仅指代相应的服务软件，站点必须发布在Web服务器 上才能被客户机访问。
. gycm .com
WEBPAGE DESIGN
HTTP
从1990年开始出现，是目前网络世界里应用最广泛的网络 传输协议，是为分布式超媒体信息系统设计的一个“无状态” 的请求/响应协议。规定了浏览器如何通过网络请求WWW服务 器，以及服务器如何响应回传网页等。
客户机
客户机又称为用户工作站，是用户与网络打交道的设备，一般由 微机担任，客户机主要享受网络上提供的各种资源，但必须安装 相应的访问软件。客户机只有安装Web浏览器才能查看网页 。
. gycm .com
WEBPAGE DESIGN
1.万维网（WWW）
信息以页面（或称Web页）的形式存储在Web服 务器中，这些页面采用超文本的方式对信息进行组织， 通过链接将一页信息链接到另一页信息。被链接的页面可能在同 一台主机上，也可能在不同主机上。用户通过Web浏览器访问这 些资源。其结构采用了 “浏览器/服务器（B/S）”模式。
URL（Universal Resource Locater，统一资源定位器） HTTP（Hypertext Transfer Protocol，超文本传输协议） HTML（Hyper Text Markup Language，超文本标志语言）
WEBPAGE DESIGN
服务器配置方案
. gycm .com
WEBPAGE DESIGN
2. Web常见术语
服务器
是指网络环境中的高性能计算机，它侦听网络上其他计算机提交 的服务请求，并提供相应的服务。为此，服务器必须具有承担服 务并且保证服务质量的能力，往往需要安装并设置相应的服务软 件，有时则仅指代相应的服务软件，站点必须发布在Web服务器 上才能被客户机访问。
. gycm .com
WEBPAGE DESIGN
HTTP
从1990年开始出现，是目前网络世界里应用最广泛的网络 传输协议，是为分布式超媒体信息系统设计的一个“无状态” 的请求/响应协议。规定了浏览器如何通过网络请求WWW服务 器，以及服务器如何响应回传网页等。
客户机
客户机又称为用户工作站，是用户与网络打交道的设备，一般由 微机担任，客户机主要享受网络上提供的各种资源，但必须安装 相应的访问软件。客户机只有安装Web浏览器才能查看网页 。
. gycm .com
WEBPAGE DESIGN
1.万维网（WWW）
信息以页面（或称Web页）的形式存储在Web服 务器中，这些页面采用超文本的方式对信息进行组织， 通过链接将一页信息链接到另一页信息。被链接的页面可能在同 一台主机上，也可能在不同主机上。用户通过Web浏览器访问这 些资源。其结构采用了 “浏览器/服务器（B/S）”模式。
URL（Universal Resource Locater，统一资源定位器） HTTP（Hypertext Transfer Protocol，超文本传输协议） HTML（Hyper Text Markup Language，超文本标志语言）
网站设计WebDesign01精品PPT课件
网站程序设计语言
• JavaScript和VBScript脚本语言 • Java • CGI • ASP • • PHP • JSP
1.4 常用网站管理与制作软件
HTML和XHTML
HTML HTML（Hyper Text Markup Language）是网页制作 的主要标记语言。可用任何文本编辑器进行编写。 XHTML XHTML（Extensible HTML），是更严谨、更纯净的 HTML，符合Web设计标准，是未来发展的方向软件
Fireworks 主要用于制作网页图像、标志、GIF动画、图像按钮与 导航栏等。 Flash 主要用于制作矢量动画，如广告、网站片头动画、动画 短片、MTV等。
Photoshop 具有的强大功能完全涵盖了网页设计所涉及到的各种需 求（除了多媒体）。
1.4 常用网站管理与制作软件
页面左侧
➢是网站中所有重要内容的概括，可以让浏览者在最短时间内了解网 站的主要内容。
➢如果导航栏内容不多，不超过两排，可以根据网站风格灵活摆放， 上方或左侧等。
➢如果网站栏目很多，可以将导航栏分为多排放置在Logo右侧或下 方。
页面上方
•如果导航栏内容较多的话，尽量使用文字超链接而不 用图片。不过，如果导航栏内容不多，或者网页内容 比较活泼的话，多采用图片或Flash制作导航栏。
图片导航栏
Flash导航栏
1.3 从功能角度分析网页
3.广告条
➢广告条又称Banner，其功能是宣传网站或替其他企业做广告，以 赚取广告费。 ➢Banner的尺寸是有国际标准的，按照标准制作可以使网站更显专 业
• 468*60 • 120*60 • 88*31 • 120*240
1.3 从功能角度分析网页
• JavaScript和VBScript脚本语言 • Java • CGI • ASP • • PHP • JSP
1.4 常用网站管理与制作软件
HTML和XHTML
HTML HTML（Hyper Text Markup Language）是网页制作 的主要标记语言。可用任何文本编辑器进行编写。 XHTML XHTML（Extensible HTML），是更严谨、更纯净的 HTML，符合Web设计标准，是未来发展的方向软件
Fireworks 主要用于制作网页图像、标志、GIF动画、图像按钮与 导航栏等。 Flash 主要用于制作矢量动画，如广告、网站片头动画、动画 短片、MTV等。
Photoshop 具有的强大功能完全涵盖了网页设计所涉及到的各种需 求（除了多媒体）。
1.4 常用网站管理与制作软件
页面左侧
➢是网站中所有重要内容的概括，可以让浏览者在最短时间内了解网 站的主要内容。
➢如果导航栏内容不多，不超过两排，可以根据网站风格灵活摆放， 上方或左侧等。
➢如果网站栏目很多，可以将导航栏分为多排放置在Logo右侧或下 方。
页面上方
•如果导航栏内容较多的话，尽量使用文字超链接而不 用图片。不过，如果导航栏内容不多，或者网页内容 比较活泼的话，多采用图片或Flash制作导航栏。
图片导航栏
Flash导航栏
1.3 从功能角度分析网页
3.广告条
➢广告条又称Banner，其功能是宣传网站或替其他企业做广告，以 赚取广告费。 ➢Banner的尺寸是有国际标准的，按照标准制作可以使网站更显专 业
• 468*60 • 120*60 • 88*31 • 120*240
1.3 从功能角度分析网页
动态网页制作.ppt
2021/3/5
在线留言系统的需求分析
？
2021/3/5
首页
登录
后台管理
留 留 回管 公 言 言 复理 告 类 内 内员 内 别 容 容信 容 管 管 管息 管 理 理 理管 理
理
2021/3/5
功能
查Hale Waihona Puke 查查回看看
看复
留
公
回留
言
告
复言
数据库设计
字段 字 名段
标 识
数据 类型
管理 Use 自动 员id rid 编号
管理 Use 文本 员姓 rna 名 me
管理 Pwd 文本 员密 码2021/3/5
说明
主键、用 户参加考 试的考号
用户参加 考试的密 码
规划书的编写
• 系统功能定位 • 系统性能目标 • 数据库规划 • 实现系统定位及系统目标的方式及方法 • 系统界面规划
2021/3/5
ASP的运行环境
• 服务器端运行环境可作如下选择：
• 最初的都是用超文本标记语言HTML来实现 的。一般后缀为.htm或.html
• 制作工具可以是记事本、EditPlus等纯文本 编写工具，也可以是FrontPage、 DreamWeaver等所见即所得的工具。
• 静态网页的缺点是：如果要修改网页，必 须修改源代码，并重新上传。
2021/3/5
静态网页的工作原理
2021/3/5
在线留言系统的需求分析
结构化分析方法的基本思想是： 自顶向下、逐层分解
对于一个复杂的问题，人们很难一下子 考虑全面，通常可以把一个大问题分解成 若干个小问题，每个小问题再分解成若干 个更小的问题，经过多层分解后，每个最 底层的问题都是足够简单、易于解决的， 于是复杂的问题也就迎刃而解。这个过程 就是分解过程。
在线留言系统的需求分析
？
2021/3/5
首页
登录
后台管理
留 留 回管 公 言 言 复理 告 类 内 内员 内 别 容 容信 容 管 管 管息 管 理 理 理管 理
理
2021/3/5
功能
查Hale Waihona Puke 查查回看看
看复
留
公
回留
言
告
复言
数据库设计
字段 字 名段
标 识
数据 类型
管理 Use 自动 员id rid 编号
管理 Use 文本 员姓 rna 名 me
管理 Pwd 文本 员密 码2021/3/5
说明
主键、用 户参加考 试的考号
用户参加 考试的密 码
规划书的编写
• 系统功能定位 • 系统性能目标 • 数据库规划 • 实现系统定位及系统目标的方式及方法 • 系统界面规划
2021/3/5
ASP的运行环境
• 服务器端运行环境可作如下选择：
• 最初的都是用超文本标记语言HTML来实现 的。一般后缀为.htm或.html
• 制作工具可以是记事本、EditPlus等纯文本 编写工具，也可以是FrontPage、 DreamWeaver等所见即所得的工具。
• 静态网页的缺点是：如果要修改网页，必 须修改源代码，并重新上传。
2021/3/5
静态网页的工作原理
2021/3/5
在线留言系统的需求分析
结构化分析方法的基本思想是： 自顶向下、逐层分解
对于一个复杂的问题，人们很难一下子 考虑全面，通常可以把一个大问题分解成 若干个小问题，每个小问题再分解成若干 个更小的问题，经过多层分解后，每个最 底层的问题都是足够简单、易于解决的， 于是复杂的问题也就迎刃而解。这个过程 就是分解过程。
《动态网页设计》幻灯片
良好的安全性。由于PHP本身的代码开放所以它的代码在许多工程师手中
进行了检测，同时它与Apache编绎在一起的方式也可以让它具有灵活的安
全设定。到现在为止，PHP具有了公认的安全性能。
PHP的缺点如下：
数据库支持的极大变化。由于PHP的所有扩展接口都是独立团队开发的，
项
同时在开发时为了形成相应数据的个性化操作，所以PHP虽然支持许多数据
发组所给出的接口。缺少正规的商业支持，这也是自由软件一向的缺点。
无法实现商品化应用的开发。由于PHP没有任何编绎性的开发工作，所有
的开发都是基于脚本技术来完成的，所有的源代码都无法编译，所以完成的
应用只能是自己或是内部使用，无法实现商品化。
4．JSP
JSP页面由HTML代码和嵌入其中的Java代码所组成。服务器在页面被客户端
目 6
库，可是针对每种数据库的开发语言都完全不同。
安装复杂。由于PHP的每一种扩充模块并不是完全由PHP本身来完成，需 动
态
要许多外部的应用库，如图形需要gd库，LDAP需要LDAP库，……，这样
网
页
在安装完成相应的应用后，再联编进PHP中来。
设
计
缺少企业级的支持。没有组件的支持，那么所有的扩充就只能依靠PHP开
页 设
简单、书写容易，同时Internet上也有大量的代码可以共享。
计
与Apache及其它扩展库结合紧密。PHP与Apache可以以静态编绎的方
式结合起来，而与其它的扩展库也可以用这样的方式结合（Windows平台
除外）。这种方式的最大的好处就是最大利用了CPU时间和内存，同时极为
有效的利用了Apache的高性能的吞吐能力。
项
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
目前国内使用的主要有小红帽系列、红旗Linux系列
等。
2020/12/5
动态网页设计（Dreamweaver CS3+）
12
1.3 网站建设可行性分析
❖1.3.1 技术可行性分析
▪ 3、数据库的选择
• 目前主流的数据库技术主要有ACCESS、SQL Server、Oracle、DB2四种，这四种数据库各有千 秋，其中ACCESS适合小型企业用，SQL适合大中型 企业用，Oracle和DB2适合大型企业用。
• 网站建设技术有很多，除了原有的html技术外，出 现了许多动态网站建设技术。
• 早期的动态网页主要采用CGI技术，可以使用不同 的程序编写适合的CGI程序，如Visual Basic、 Delphi或C/C＋＋等。由于CGI技术由于编程困难、 效率低下、修改复杂，所以有逐渐被新技术取代的 趋势。
▪ 2、实施需求调研
• (1) 调研准备 • (2) 需求调研 • (3) 调研资料的整理
2020/12/5
动态网页设计（Dreamweaver CS3+）
9
1.2 网站需求调研
❖1.2.3 企业网站需求调研的步骤
▪ 3、撰写调研报告
• 调研报告是对调研成果的文字反映，其主要内容包 括调研目标、调研过程、调研方法、调研总结，也 就是对网站建设相关问题的现状与建设期望进行描 述，让需求分析与网站设计人员有个基本依据。
3
本章要点
❖ 企业网站需求调研的步骤 ❖ 企业网站技术可行性分析 ❖ 企业网站经济可行性分析 ❖ 企业网站规划书的内容 ❖ 企业网站内容设计 ❖ 企业网站功能设计 ❖ 企业网站形象设计 ❖ 企业网站结构设计
2020/12/5
动态网页设计（Dreamweaver CS3+）
4
1.1 任务概述：撰写企业网站规划书
▪ 1、制定调研计划
• (1) 制定调研目标 • (2) 确定调研对象 • (3) 确定调研方法 • (4) 确定调查时间、人员、资金预算 • (5) 设计调研表
2020/12/5
动态网页设计（Dreamweaver .2.3 企业网站需求调研的步骤
• Unix服务器操作系统由AT&T公司和SCO公司共同 推出，主要支持大型的文件系统服务、数据服务等 应用。目前市面上流传的主要有SCO SVR、BSD Unix、SUN Solaris、IBM-AIX 。
• Linux服务器操作系统是在Posix和Unix基础上开发
出来的，支持多用户、多任务、多线程、多CPU。
11
1.3 网站建设可行性分析
❖1.3.1 技术可行性分析
▪ 2、服务器操作系统的选择
• WINDOWS服务器操作系统由Microsoft公司开发。 其服务器操作系统重要版本WINNT 4.0 Server、 Win2000/Advanced Server、 Win2003/Advanced Server。
❖ 建设网站之前，首先要进行网站规划。企业网站的规 划是指从战略高度，对网站建设、运营进行的全盘谋 略与策划，包括总体规划和详细规划。
❖ 在建立网站前应明确建设网站的目的，确定网站的功 能，确定网站规模、投入费用，进行必要的市场分析 等。只有详细的规划，才能避免在网站建设中出现的 很多问题，使网站建设能顺利进行。
▪ 电子商务网站的需求调研还必须对竞争对手进行调查 分析，了解竞争对手网站的主要业务、网站的基本架 构、营运策略等，从而学习竞争对手的长处，吸取竞 争对手的经验，突出自己的优势。
2020/12/5
动态网页设计（Dreamweaver CS3+）
7
1.2 网站需求调研
❖1.2.3 企业网站需求调研的步骤
2020/12/5
动态网页设计（Dreamweaver CS3+）
6
1.2 网站需求调研
❖1.2.2 企业网站需求调研的意义
▪ 需求调研的质量决定了企业网站的质量。只有明确了 网站建设所要实现的功能及想要达到的目的，才能使 后续的网站规划与设计有基本的依据。
▪ 网站的需求调研主要解决的问题是明确网站的使用者、 建设网站的主要目的、核心的业务流程、网站建设的 技术条件、用户群之间的关系等。
• 目前流行的新技术主要有PHP （即Hypertext Preprocessor）、ASP（即Active Server Pages）、 、JSP（即Java Server Pages）等。其中 已逐步代替ASP成为网站建设中常用的动 态网页技术。
2020/12/5
动态网页设计（Dreamweaver CS3+）
中国水利水电出版社
主 编 张德芬 副主编 邓之宏
第1章 网站规划与设计
第1章 网站规划与设计
1.1 任务概述 1.2 网站需求调研
1.3 网站建设可行性分析 1.4 网站规划书的内容
1.5 企业网站设计
1.6 任务实现
2020/12/5
动态网页设计（Dreamweaver CS3+）
❖ 本章的任务是学习如何撰写企业网站规划书。
2020/12/5
动态网页设计（Dreamweaver CS3+）
5
1.2 网站需求调研
❖1.2.1 企业网站需求调研的含义
▪ 需求分析是指对要解决的问题进行详细的分析，弄清 楚问题的要求，包括需要输入什么数据，要得到什么 结果，最后应输出什么。
• 调研报告除了正文以外，应该将调研过程中各种详 细记录以附件的形式作为调研报告的一部分，因为 各种记录中包含了各种原始需求信息，应作为需求 分析的重要参考。
2020/12/5
动态网页设计（Dreamweaver CS3+）
10
1.3 网站建设可行性分析
❖1.3.1 技术可行性分析
▪ 1、网站建设技术的选择
▪ 企业网站项目的确立是建立在各种各样的需求上面的， 这种需求往往来自于客户的实际需求或者是出于公司 自身发展的需要。
▪ 因此如何更好地的了解、分析、明确用户需求，并且 能够准确、清晰以文档的形式表达给参与项目开发的 每个成员，是每个网站开发项目管理者需要面对的问 题。为了有效进行需求分析，必须做好需求调研工作。