山东大学web技术课程教学ppt4
合集下载
《WEB开发技术》PPT课件
虚拟主机之间完全独立，并可由用户自 行管理，可以大大地缓解互联网上IP及服 务器等资源的不足，同时降低用户的硬 件费用、网络维护费用和通讯服务费用。
选择虚拟主机的要素:技术需要,空间大小
a
21
• 得到FTP地址，把源代码上传到FTP. 所谓FTP:FTP（File Transfer Protocol）是文件传输协议的简称。
• TCP（Transmission Control Protocol，传输控制协议）
• IP（Internet Protocol，网际协议）
a
12
2.利用DNS查询到对 应的IP地址；
浏览器与Google服务器利用TCP协议 建立连接；
浏览器利用HTTP协议向Google发送 请求；
IIS的安装
a
18
如何在网络中发布网站
• 为了在自己的电脑上调试自己编的网页程序要配置环境 • IIS(Internet Information Service)信息服务.
在Windows组件中安装IIS. 在管理工具中可以运行IIS.通过IIS配置虚拟目录实现对源代码的预览修改等
a
19
• 为开发的网站申请域名 了解域名首先了解IP:像电话有电话号码一样,接入Internet的计算 机也有一个由授权机构分配的号码即IP地址
a
6
域名分为英文域名和中文域名
英文域名又分为国际域名和国内域名
如：GOOGLE公司的域名收购 GOOGLE公司的中文域名的抢注（谷
歌） “神州七号”域名的抢注
a
7
IP地址和域名具有等价性，通过DNS（Domain Name System ）域 名服务器对相应的域名进行解析成为对应的IP地址.
选择虚拟主机的要素:技术需要,空间大小
a
21
• 得到FTP地址，把源代码上传到FTP. 所谓FTP:FTP（File Transfer Protocol）是文件传输协议的简称。
• TCP（Transmission Control Protocol，传输控制协议）
• IP（Internet Protocol，网际协议）
a
12
2.利用DNS查询到对 应的IP地址；
浏览器与Google服务器利用TCP协议 建立连接；
浏览器利用HTTP协议向Google发送 请求；
IIS的安装
a
18
如何在网络中发布网站
• 为了在自己的电脑上调试自己编的网页程序要配置环境 • IIS(Internet Information Service)信息服务.
在Windows组件中安装IIS. 在管理工具中可以运行IIS.通过IIS配置虚拟目录实现对源代码的预览修改等
a
19
• 为开发的网站申请域名 了解域名首先了解IP:像电话有电话号码一样,接入Internet的计算 机也有一个由授权机构分配的号码即IP地址
a
6
域名分为英文域名和中文域名
英文域名又分为国际域名和国内域名
如：GOOGLE公司的域名收购 GOOGLE公司的中文域名的抢注（谷
歌） “神州七号”域名的抢注
a
7
IP地址和域名具有等价性，通过DNS（Domain Name System ）域 名服务器对相应的域名进行解析成为对应的IP地址.
《Web技术基础》课程内容与要求PPT文档31页
•
29、在一切能够接受法律支配的人类 的状态 中，哪 里没有 法律， 那里就 没有自 由。— —洛克
•
30、风俗可以பைடு நூலகம்就法律，也可以废除 法律。 ——塞·约翰逊
1、最灵繁的人也看不见自己的背脊。——非洲 2、最困难的事情就是认识自己。——希腊 3、有勇气承担命运这才是英雄好汉。——黑塞 4、与肝胆人共事，无字句处读书。——周恩来 5、阅读使人充实，会谈使人敏捷，写作使人精确。——培根
《Web技术基础》课程内容与要求
•
26、我们像鹰一样，生来就是自由的 ，但是 为了生 存，我 们不得 不为自 己编织 一个笼 子，然 后把自 己关在 里面。 ——博 莱索
•
27、法律如果不讲道理，即使延续时 间再长 ，也还 是没有 制约力 的。— —爱·科 克
•
28、好法律是由坏风俗创造出来的。 ——马 克罗维 乌斯
大工09秋《Web技术》辅导资料一
计算机应用基础辅导资料三主题：第2章计算机基础知识的辅导资料（二）学习时间：2014年10月13日—10月19日内容：第二章计算机的基础知识（4-12），本章的学习要求及周我们主要学习课件．．需要掌握的重点内容如下：基本要求：一、掌握计算机系统的组成；二、掌握计算机的基本工作原理；三、掌握计算机中常用数制的表示及转换方法；四、了解字符编码；五、了解指令、程序、软件的概念以及软件的分类。
五、理解微型机的硬件组成，主要部件的性能指标。
重点掌握内容：重点：计算机系统组成、计算机基本工作原理、数据在计算机中的表示及数制转换。
难点：数据在计算机中的表示及数制转换。
一、微型计算机概述计算机分为巨型计算机、大型计算机、小型计算机和微型计算机。
微型计算机包含了多种系列、不同档次、型号的计算机，微型计算机的体系结构采用总线结构，其硬件系统包括主板、微处理器、存储器和各种外设等。
微型计算机性能飞速提高，不同种类计算机之间界限变得模糊，大、小、微型计算机的工作原理和系统结构相类似。
微型计算机可分为IBM-PC兼容机和苹果机两大类。
二、信息存储常用术语字长较长的计算机在相同的时间内能处理更多的数据。
三、微型计算机的性能指标四、微机系统结构示意图微型计算机硬件系统是由中央处理器、存储器、I/O（输入/输出）设备及其接口电路和总线组成。
1.微型计算机硬件系统中央处理器：即CPU（Central Processing Unit)，主要由运算器和控制器两部分组成。
也称中央处理单元、微处理器。
CPU是微机中一块集成电路芯片，是组成微型计算机的核心部件，承担着的运算和控制任务。
运算器（arithmetic-logic unit）：处理在控制单元控制下从内存中得到的数据；控制器（control unit）：协调和控制计算机系统的其他部件。
它从计算机系统的内存中提取指令，解释这些指令并通知系统中其他的相应部件执行。
主频是CPU的工作频率，也称时钟频率，用来表示CPU的运算速度。
Web前端开发基础课件PPT教学资料
学习Vue的基本语法和常用指令， 掌握Vue的组件开发和数据驱动。
2 盒模型和定位
学习如何使用选择器选中 HTML元素，并应用样式规则， 控制字体、颜色、布局等。
理解CSS盒模型和盒子的布 局规则，学习使用定位属性 控制元素的位置。
3 响应式设计和媒体查询
了解响应式设计的概念和原理，使用媒体查询适配不同设备和屏幕尺 寸。
JavaScript基础语法和应用
1
条件语句和循环
（IDE）和编辑器的特点，如
命令行进行开发。
VS Code、Sublime Text等。
3 创建项目结构
掌握创建和组织前端项目的最佳实践，包括目录结构和文件管理。
HTML基础语法和标签
了解HTML的基本结构
学习HTML的核心概念、基本标签和语法，理解文档 结构和元素嵌套。
CSS基础语法和样式
1 CSS选择器和样式规则
处理事件
表单验证
理解JavaScript事件模型，掌握事 件监听器和事件处理函数的编写。
学习使用JavaScript进行表单验证， 确保用户输入的有效性和完整性。
AJAX和跨域请求
1 使用XMLHttpRequest
发送AJAX请求
2 处理JSON数据
掌握处理从服务器返回的
3 跨域请求
学习处理跨域请求的方法，
Weபைடு நூலகம்前端开发基础课件 PPT教学资料
这份Web前端开发基础课件PPT教学资料将帮助你入门前端开发，从环境搭建 到框架介绍，涵盖了全面的基础知识和实践应用。
前端开发环境搭建
1 选择合适的开发工具和 2 配置开发环境
编辑器
学习如何安装和配置Node.js、
Web技术与应用课件
Web技术与应用
学习要点： 1． 掌握Web的基本概念和基础知识。 2． 熟悉C/S模式与B/S模式的结构。 3 ．了解常用的Web开发工具。 4．了解Web开发的基本技术。 5. 了解Web 2.0的特点及相关技术。
第1章 Web开发技术概述
Web技术与应用
1 使用环境和使用方式 1） 单机系统 (计算技术) 单用户单任务 多用户多任务(VAX PDP) 控制台命令方式(串行运行、独占) 交互命令方式(交替串行、并发、并行 共享) 2） 网络系统(计算技术 通信技术) 多用户 多任务 （物理资源、逻辑资源共享） (C/S模式) (B/S模式)
Web技术与应用
Web访问的机理
Web技术与应用
Web开发平台的组成
.NET开发平台 2000年6月，微软公司宣布其.NET战略。2001年，ECMA通过了Microsoft提交的C#语言和CLI标准，这两个技术标准构成了.NET平台的基石。2002年，Microsoft正式发布.NET Framework和Visual Studio .NET开发工具。 微软公司的.NET战略揭示了一个全新的境界，提供了一个新的软件开发模型。.NET战略的一个关键特性在于它独立于任何特定的语言或平台。它不要求程序员使用一种特定的程序语言。相反，开发者可使用多种.NET兼容语言的任意组合来创建一个.NET应用程序。多个程序员可致力于同一个软件项目，但分别采用自己最精通的.NET语言编写代码。
Web技术与应用
C/S模式与B/S模式
C/S计算模式将应用一分为二：前端是客户机，几乎所有的应用逻辑都在客户端进行和表达，客户机完成与用户的交互任务。后端是服务器，它负责后台数据的查询和管理、大规模的计算等服务。通常客户端的任务比较繁重，称作“肥”客户端，而服务器端的任务较轻，称作“瘦”服务器。
山东大学web技术课程教学ppt3
于展现窗口即可。 图像尽量避免使用高分辨率的真彩照片 使用Web标准调色板，避免抖动 尽可能使用纯色，混合颜色会加大文件 在网页中勿滥用图像 Internet和Intranet的图像区别 切割大幅图像
山东大学计算机科学与技术学院
5
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
图像(图片)颜色要与网站色系协调一致
返回
山东大学计算机科学与技术学院
17
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
网站-图形尺寸尽可能小
返回
山东大学计算机科学与技术学院
18
《网站规划与网页设计》
山东大学计算机科学与技术学院
13
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.图像其他文件格式
.bmp：Microsoft，支持高达 24 位的图像，无损格式无压
缩图形文件，占用磁盘空间过大，是不适用于 Web页的。 .tif：是Mac中广泛使用的图像格式，它由Aldus和微软联合 开发，最初是出于跨平台存储扫描图像的需要而设计的。 .PSD：Adobe公司的Photoshop的专用格式，包含图层、通道 、遮罩等多种设计的样稿，便于修改上一次的设计。可轻易 转化为其他格式。 .swf：Flash制作矢量动画的后缀。可以边下载边观看，因 此特别适合网络传输。高清晰度的画质和小巧的体积，网上 动画的事实标准。 .SVG：目前最火热的图像文件格式，可缩放的矢量图形。它 是基于XML，由W3C联盟进行开发的。可用任何文字处理工具 打开SVG图像，通过改变部分代码来使图像具有互交功能， 并可以随时插入到HTML中通过浏览器来观看。
《Web技术基础》PPT课件
11
Web技术基础
Internet主要技术： ·采用标准协议——TCP/IP协议，使网上各种 不同的计算机进行通信 ·通过路由器将不同网络互连 ·建立在TCP/IP协议基础之上的WWW浏览服务 ·应用DNS域名解析系统完成计算机和用户之间 的地址解析工作
12
Web技术基础
Internet基本服务
路由器
路由器
企业子网
路由器
路由器
R
企业网
R
个人电脑
14
Web技术基础
1.2.3 OSI参考模型 网络协议（Protocol) ：计算机之间的数据通信必须 遵守某种约定和规程，这些约定和规程就是网络通信 协议（翻译官）。协议三要素：
语法(syntax)：数据和控制信息的结构或格式 （“如何讲”） 语义(semantics)：需要发出何种控制信息，完成 何种动作和做出何种响应。 （“讲什么”） 时序(timing)：实体通信实现顺序的详细说明。 国际标准化组织(ISO)提出的“开放系统互连模型” 是计算机网络通信的基本协议。TCP/IP是Internet
16
Web技术基础
网络层次结构示意图
我们希望 退货
经理们 的想法
他们要退货
尊敬的John: 由于...方面
的原因
我们希望 退货
公司之间的 正规书信
尊敬的John: 由于...方面
的原因
我们希望 退货
FAX#...
尊敬的John: 由于...方面
的原因
我们希望 退货
利用信函、 传真等传 递的公文
FAX#...
Web技术基础
计算机系（图517） 李智敏
Web技术基础
课程性质：
Web技术基础
Internet主要技术： ·采用标准协议——TCP/IP协议，使网上各种 不同的计算机进行通信 ·通过路由器将不同网络互连 ·建立在TCP/IP协议基础之上的WWW浏览服务 ·应用DNS域名解析系统完成计算机和用户之间 的地址解析工作
12
Web技术基础
Internet基本服务
路由器
路由器
企业子网
路由器
路由器
R
企业网
R
个人电脑
14
Web技术基础
1.2.3 OSI参考模型 网络协议（Protocol) ：计算机之间的数据通信必须 遵守某种约定和规程，这些约定和规程就是网络通信 协议（翻译官）。协议三要素：
语法(syntax)：数据和控制信息的结构或格式 （“如何讲”） 语义(semantics)：需要发出何种控制信息，完成 何种动作和做出何种响应。 （“讲什么”） 时序(timing)：实体通信实现顺序的详细说明。 国际标准化组织(ISO)提出的“开放系统互连模型” 是计算机网络通信的基本协议。TCP/IP是Internet
16
Web技术基础
网络层次结构示意图
我们希望 退货
经理们 的想法
他们要退货
尊敬的John: 由于...方面
的原因
我们希望 退货
公司之间的 正规书信
尊敬的John: 由于...方面
的原因
我们希望 退货
FAX#...
尊敬的John: 由于...方面
的原因
我们希望 退货
利用信函、 传真等传 递的公文
FAX#...
Web技术基础
计算机系（图517） 李智敏
Web技术基础
课程性质：
山东大学web技术课程教学ppt2
山东大学计算机科学与技术学院
6
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
4.站点结构：描述站点在服务器上的目录保存方式； 一个站点对应一个文件夹。文件夹和文 件名一定要“望名知义”,站点结构中的 目录和文件名是大小写敏感的。
山东大学计算机科学与技术学院
7
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
被引导的导航- ebay的Email确认函
返回
山东大学计算机科学与技术学院
17
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
浏览器导航
图2.10 浏览器导航
山东大学计算机科学与技术学院
18
历史纪录
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
网站徽标和名称要放到主页的左上方
返回
山东大学计算机科学与技术学院
32
END
山东大学计算机科学与技术学院
10
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
网站导航
返回
山东大学计算机科学与技术学院
11
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
被引导的导航- ebay
山东大学计算机科学与技术学院
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
山东大学计算机科学与技术学院
19
收藏夹
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
4.站点结构：描述站点在服务器上的目录保存方式； 一个站点对应一个文件夹。文件夹和文 件名一定要“望名知义”,站点结构中的 目录和文件名是大小写敏感的。
山东大学计算机科学与技术学院
7
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
被引导的导航- ebay的Email确认函
返回
山东大学计算机科学与技术学院
17
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
浏览器导航
图2.10 浏览器导航
山东大学计算机科学与技术学院
18
历史纪录
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
网站徽标和名称要放到主页的左上方
返回
山东大学计算机科学与技术学院
32
END
山东大学计算机科学与技术学院
10
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
网站导航
返回
山东大学计算机科学与技术学院
11
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
被引导的导航- ebay
山东大学计算机科学与技术学院
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
山东大学计算机科学与技术学院
19
收藏夹
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
山东大学web技术课程教学ppt12
山东大学计算机科学与技术学院
9
《网站设计与建设》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.导入样式信息：仅适于IE
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>CSS的链入外部样式表示例</title> <style type="text/css"> @import url("sample-1203.css"); </style> </head> <body> CSS的链入外部样式表示例(body背景图) <h2>CSS h2：网站规划与网页设计</h2> <p>CSS P：网站设计与建设</p> <p class="myh2">myh2 网站规划与网页设计</p> </body> </html>
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
第12章 层叠样式表CSS
山东大学计算机科学与技术学院
《网站设计与建设》
《网站设计与建设》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
概 述
介绍样式表的基本概念
CSS1
CSS2 介绍5种使用CSS的方法
山东大学计算机科学与技术学院
13
《网站设计与建设》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
大工18秋《Web技术》课程设计
大工18秋《Web技术》课程设计一、教学目标本课程的教学目标旨在帮助学生掌握Web技术的核心知识，提升学生的实际操作能力，并培养学生的创新思维和团队协作精神。
在知识目标方面，学生应能够理解并掌握HTML、CSS和JavaScript等基本Web技术，了解Web开发的流程和规范。
在技能目标方面，学生应能够独立完成静态网页的设计与制作，并掌握使用一种Web框架进行动态网页开发的基本方法。
在情感态度价值观目标方面，学生应能够认识到Web技术在现代社会中的重要性，培养对Web技术的兴趣和热情，并具备良好的团队协作和沟通能力。
二、教学内容本课程的教学内容将根据课程目标进行选择和，确保内容的科学性和系统性。
教学大纲将详细制定，明确教学内容的安排和进度。
具体教学内容如下：1.HTML基础：介绍HTML的基本结构、标签和属性，让学生能够理解并编写基本的HTML页面。
2.CSS样式：讲解CSS的基本语法和使用方法，让学生能够为HTML页面添加样式，提升页面美观度。
3.JavaScript脚本：教授JavaScript的基本语法和操作方法，让学生能够实现页面的动态效果和交互功能。
4.Web框架：介绍一种流行的Web框架，如React或Angular，让学生掌握框架的使用方法，提高开发效率。
5.项目实践：安排学生进行实际项目的开发，培养学生的实际操作能力和解决问题的能力。
三、教学方法为了激发学生的学习兴趣和主动性，本课程将采用多种教学方法。
具体方法如下：1.讲授法：教师对基本概念和理论知识进行讲解，帮助学生理解和掌握。
2.案例分析法：通过分析实际案例，让学生了解Web技术的应用和开发流程。
3.实验法：安排实验课程，让学生亲自动手实践，培养实际操作能力。
4.小组讨论法：学生进行小组讨论，促进学生之间的交流与合作，培养团队协作能力。
四、教学资源为了支持教学内容和教学方法的实施，丰富学生的学习体验，我们将选择和准备以下教学资源：1.教材：选择一本适合本课程的教材，作为学生学习的基础资料。
《WEB开发技术》课件
03
JavaScript基础
01
02
03
变量
数据类型
运算符
函数
使用var声明变量，可以使用let和const声明块级作用域变量。
JavaScript有基本数据类型（如Number、String、Boolean、Null、Undefined）和复杂数据类型（如Object）。
包括算术运算符（如+、-、*、/）、比较运算符（如==、===、!=、!==、>、<）、逻辑运算符（如&&、||）等。
网站性能优化的方法
02
常见的网站性能优化方法包括减少页面加载时间、优化数据库查询、使用CDN加速等。这些方法可以有效提高网站性能，减少用户等待时间。
网站性能监控与分析
03
使用网站性能监控工具可以实时监测网站性能，分析瓶颈和问题所在，帮助开发人员针对性地进行优化。
SEO优化的重要性
SEO（搜索引擎优化）是提高网站在搜索引擎结果页排名的一种有效方法。通过SEO优化，网站可以获得更多的曝光和流量，提高品牌知名度和业务收益。
事务处理
非关系型数据库
MongoDB是一个非关系型数据库，采用文档存储数据，具有灵活的数据模型。
数据模型
MongoDB使用类似JSON的格式存储数据，支持丰富的数据类型和结构。
查询语言
MongoDB具有强大的查询语言，支持各种查询操作符和聚合框架。
索引与性能优化
MongoDB支持索引，通过合理使用索引可以显著提高查询性能。
SEO优化的技巧
关键词研究、元标签优化、内容质量提升、外部链接建设等都是常见的SEO优化技巧。了解和运用这些技巧可以帮助网站在搜索引擎中获得更好的排名。
Web技术教程-PPT课程介绍[7页]
![Web技术教程-PPT课程介绍[7页]](https://img.taocdn.com/s3/m/c50836b73c1ec5da50e270e6.png)
Web技术
课程介绍
1 介绍开发Web应用常用的编程工具和技术
2 重点讲授HTTP、JavaScript、 PHP以及基于MySQL的 Web数据库存取等内容
3 通过本课程的学习，让学生掌握Web应用的开发的基本技 术
（1）浏览器端编程 （2）web服务器端编程 （3）web服务器能访问后台数据库
2 个人推荐editplus足够。
3 内容实用，非常有趣，在编程娱乐中随心所欲地创建个人 风格的网站。
学习要求
不迟到，不早退，迟到请勿进 课堂安静，有事自己出去 作业认真完成（1到2次，记成绩） 实验认真完成（3个实验，记成绩） 平时表现（课堂提问等）占30%
掌握四块核心内容
（1）HTML编程 （2）JavaScript编程 （3）PHP编程 （4）MySQL数据库访问
欢迎大家多沟通，掌握技能！
课程介绍
1 本课程共32个学时，2个学分。 2 24个理论课时，8个实验课时。 3 考试题目中实验占到50%，所以大家平时学习一定要自己
动wamp(windows+apache+mysql+php) 或者lamp (linux+apache+mysql+php),再安装一个编辑器 比如frontpage或dreamweave或editplus。
课程介绍
1 介绍开发Web应用常用的编程工具和技术
2 重点讲授HTTP、JavaScript、 PHP以及基于MySQL的 Web数据库存取等内容
3 通过本课程的学习，让学生掌握Web应用的开发的基本技 术
（1）浏览器端编程 （2）web服务器端编程 （3）web服务器能访问后台数据库
2 个人推荐editplus足够。
3 内容实用，非常有趣，在编程娱乐中随心所欲地创建个人 风格的网站。
学习要求
不迟到，不早退，迟到请勿进 课堂安静，有事自己出去 作业认真完成（1到2次，记成绩） 实验认真完成（3个实验，记成绩） 平时表现（课堂提问等）占30%
掌握四块核心内容
（1）HTML编程 （2）JavaScript编程 （3）PHP编程 （4）MySQL数据库访问
欢迎大家多沟通，掌握技能！
课程介绍
1 本课程共32个学时，2个学分。 2 24个理论课时，8个实验课时。 3 考试题目中实验占到50%，所以大家平时学习一定要自己
动wamp(windows+apache+mysql+php) 或者lamp (linux+apache+mysql+php),再安装一个编辑器 比如frontpage或dreamweave或editplus。
山东大学web技术课程教学ppt9
6 山东大学计算机科学与技术学院
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
5.Web数据库服务器选型
Web数据库管理系统是指基于Web模式的DBMS的信息服
务，充分发挥DBMS高效的数据存储和管理能力，以B/S 模式为平台，将客户端融入统一的Web浏览器，为 Internet用户提供使用简便、内容丰富的服务。 Web技术与数据库管理系统(DBMS)相互融合领域的研究 已成为热点方向之一。 Web数据库为Internet上的电子商务提供技术支持。 当前流行Web数据库： Oracle数据库 Sybase数据库 DB2数据库 SQLServer数据库 MySQL数据库 Access数据库
9.19 什么是LAMP、WAMP网站软件平台选择方案？这些 方案有什么特点？
结束
山东大学计算机科学与技术学院
10
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
UNIX Server
1969年，Ken Thompson，AT&T贝尔实验室，DEC PDP-
7 山东大学计算机科学与技术学院
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.动态网页设计语言选型
服务器端技术主要有CGI、PHP、ASP、JSP，
CGI不是一种动态网页设计语言，PHP、ASP和 JSP是当今最常用的三种动态网页设计语言。 动态语言的选择在选择了应用服务器(或动态 语言中间件)之后就确定了，例如选择了IIS 之后，动态语言就选择了ASP。 动态网页设计技术包括： CGI PHP ASP JSP
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
5.Web数据库服务器选型
Web数据库管理系统是指基于Web模式的DBMS的信息服
务，充分发挥DBMS高效的数据存储和管理能力，以B/S 模式为平台，将客户端融入统一的Web浏览器，为 Internet用户提供使用简便、内容丰富的服务。 Web技术与数据库管理系统(DBMS)相互融合领域的研究 已成为热点方向之一。 Web数据库为Internet上的电子商务提供技术支持。 当前流行Web数据库： Oracle数据库 Sybase数据库 DB2数据库 SQLServer数据库 MySQL数据库 Access数据库
9.19 什么是LAMP、WAMP网站软件平台选择方案？这些 方案有什么特点？
结束
山东大学计算机科学与技术学院
10
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
UNIX Server
1969年，Ken Thompson，AT&T贝尔实验室，DEC PDP-
7 山东大学计算机科学与技术学院
《网站规划与网页设计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.动态网页设计语言选型
服务器端技术主要有CGI、PHP、ASP、JSP，
CGI不是一种动态网页设计语言，PHP、ASP和 JSP是当今最常用的三种动态网页设计语言。 动态语言的选择在选择了应用服务器(或动态 语言中间件)之后就确定了，例如选择了IIS 之后，动态语言就选择了ASP。 动态网页设计技术包括： CGI PHP ASP JSP
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
山东大学计算机科学与技术学院
14
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.视频文件的几个主要格式 – 续3
RealVideo格式(.RA/.RM/.RMVB)：RealNetworks公司开
发的RealVideo 能把影像信息从视频服务器经流式传输 向用户计算机连续、实时传送。在RealMedia规范中主要 包括三类文件：RealAudio（用以传输接近CD音质的音频 数据）、RealVideo（用来传输连续视频数据）和 RealFlash（RealNetworks公司与Macromedia公司合作推 出的新一代高压缩比动画格式）。
山东大学计算机科学与技术学院
12
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.视频文件的几个主要格式 – 续1
FLV格式(.flv)：是FLASH VIDEO的简称，是一种新的视
频格式，原是Macromedia公司(现在是Adob公司)的流式 视频格式。由于文件极小、加载速度极快，特别适于 Internet视频，它有效地解决了视频文件导入Flash后， 使导出的SWF文件体积庞大，不能在网络上很好的使用等 缺点。目前各在线视频网站均采用此视频格式，如新浪 博客、56、土豆、酷6、youtube等，无一例外。FLV已经 成为当前视频文件的主流格式。 SWF格式(.swf)：Swf (shock wave flash) 原是 Macromedia公司（现是ADOBE公司）的动画设计软件 Flash的专用格式，是一种支持矢量和点阵图形的动画文 件格式，广泛应用于网页设计、动画制作等领域，swf文 件通常也被称为Flash文件。swf普及程度很高，现在超 过99%的网络使用者都可以读取swf档案，但浏览器必须 安装Adobe Flash Player插件。
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
第4章 多媒体与Web设计
山东大学计算机科学与技术学院
《网站规划与网页设计》
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
概 述
多媒体网站的重要性
Web多媒体设计原则
动画与Web设计
山东大学计算机科学与技术学院
9
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.视频与Web设计：Web嵌入视频播放–续1
山东大学计算机科学与技术学院
10
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.视频与Web设计：Web视频客户端播放软件，例如 PPStream、PPLive和PPMate、TVAnts等 – 续2
山东大学计算机科学与技术学院
13
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.视频文件的几个主要格式 – 续2
MPEG格式(.MPEG/.MPG/.DAT) ：MPEG文件格式是运动图
像压缩算法的国际标准，它包括 MPEG-1，MPEG-2， MPEG-3和MPEG-4，几乎所有的计算机平台共同支持，其 压缩效率非常高，同时图像和音响的质量也非常好。 MPG-1，1.5 Mbps，VCD是MPEG1其中的一个标准。以 每秒30帧(30fps)的速度提供352x240的视频分辨率。 MPEG-2，DVD，HDTV（高清晰电视广播）。MPEG-2 的 压缩算法压缩一部120分钟长的电影可以到压缩到4到 8GB的大小，图象质量要比MPEG-1高。 MPEG-3(.MP3)，此标准也是从早期的 MPEG 工作的基 础上发展而来的。它是一种音频压缩技术，是 MPEG1 和 MPEG-2 规范的一部分。 MPEG-4(.MP4)具有优于MPEG-2两倍的音视频编解码能 力。特点是压缩比高、成像清晰，容量小，一部DVD9碟，可以存贮10多部高清晰MPEG4网络电影。
山东大学计算机科学与技术学院
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
3.动画与Web设计
动画是利用人的视觉暂留特性，快速播放一系列
连续运动变化的图形图像，也包括画面的缩放、 旋转、变换、淡入淡出等特殊效果。 动画是由一系列静态画面连续地播放形成的，每 个动画页面称为帧(Frame)，一秒钟动画所包含的 帧数称为帧速率(fps)，计算机上的动画一般达到 15fps时，播放就已经很流畅了。(DVD帧速率： 30fps；电影帧速率：24fps) 通过动画可以把抽象的内容形象化，使许多难以 理解的内容变得生动有趣。 确保动画和内容紧密关联，网页应该浑然一体， 切忌Web动画是一个孤立个体，合理使用动画可以 达到事半功倍的效果。
山东大学计算机科学与技术学院
16
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
9. 音频格式
.mid：“MIDI”是乐器的数字化接口的缩写，用于
在音乐器材、合成器和计算机之间交换音乐信息 的标准协议。MIDI 的最大特点是文件长度很小， 但声音机械，一般用于背景音乐，不适合网上广 播。 .ra/.rm/.ram：RealNetworks 格式的文件扩展名 有RA、RM、RAM， RA、RM文件是真正存储数据的 文件；RA、RM格式的文件既有音频，也有视频； .mp3 ： 它 是 一 种 音 频 压 缩 技 术 ， 是 MPEG-1 和 MPEG-2 规 范 的 一 部 分 。 1991 年 ， 德 国 的 Fraunhofer 学院开发出 MP3。MP3 使用感知音频 编码压缩 CD 音质的声音，得到的保真度几乎一 模一样。 山东大学计算机科学与技术学院
山东大学计算机科学与技术学院
7
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
5.常见的动画设计效果
①条幅信息循环水平滚动播出 ②新闻通知等标示色彩图案交替显示(跳动与闪动) ③纵向滚动新闻通知的标题超链接信息 ④沿某一定轨迹运动的悬浮通知 ⑤多幅新闻照片或风光照片的循环切换 ⑥某些元素的色彩循环动画 ⑦元素的缓慢旋转，旋转结束标示网页或图片等下 载完成 ⑧元素的闪烁、淡入、淡出、爆炸与组合 ⑨图像之间的过渡与变形 ⑩子导航的弹出以及与主题相关的Flash动画
8.音频与Web设计
内嵌音频：内嵌音频是一种“音频流”技术，
内嵌在HTML网页中，用于背景音乐、视频伴音 或Flash动画伴音等，不能下载，除非网站整体 需要，否则不要内嵌音频。允许用户下载。 可下载音频：将音频文件完全下载到用户客户 端后，使用Windows Media Player或 RealOnePlayer等媒体播放器进行播放，用户可 以对音频完全控制：回放、暂停、停止、音量 等，如MP3音乐等，Flash由内嵌压缩音频。 流式音频：缓存，“实时”播放。 播放工具：RealOne Player, MidiaPlayer
视频与Web设计
音频与Web设计
多媒体需要考虑的问题
山东大学计算机科学与技术学院
2
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
1.多媒体重要性
文本、图形、图像、动画和声音等组合为多媒体
网站 纯文本Web网站几乎不存在 Web因为多媒体成为最具活力和吸引力的媒体 多媒体可以补充网站的视觉设计、音调和消息 多媒体的网页会导致网页下载减过慢，造成网站 浏览品质下降。 多媒体需要大带宽、浏览器插件或第三方应用程 序的支持 多媒体、网站品质、带宽和插件的关系 时间因素：珍惜Web用户时间-时刻吸引用户
山东大学计算机科学与技术学院
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
1.多媒体重要性 – 续
山东大学计算机科学与技术学院
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
2.多媒体Web设计原则
根据网站主题选择多媒体 重视网络带宽，慎用视频 网页应避免使用背景音频 避免网页使用零乱的动画 网页中避免使用滚动文本 网站中避免使用特别插件 网站拒绝最新最耀眼技术 避免网站设计的版权侵害 珍惜Web用户时间-时刻吸引用户
WMV格式(.WMV)：WMV又是一种独立于编码方式的在
Internet上实时传播多媒体的技术标准，Microsoft公司 希望用其取代QuickTime之类的技术标准以及WAV、AVI之 类的文件扩展名。
山东大学计算机科学与技术学院
15
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
山东大学计算机科学与技术学院
8
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.视频与Web设计
Web视频具有时序性与丰富的信息内涵，常用于交待事物的
发展过程，视频类似于电影和电视，有声有色，在多媒体 中充当起重要的角色。 Web视频是一个正在发展和非常有前途的技术，但现在频带 还不足够的宽，因此，Web视频的品质很低，实时播放使用 的还是比较少。 Web视频一般分辨率低、像素少、帧速率低、尺寸小，Web 视频观看品质比有限电视差很多，比电影的品质就更差了 电影的品质是Web视频追求的目标。 实时直播主要有视频会议、远程教育、视频聊天、视频电 话、Web TV直播、Web 电影直播、Web监控视频、电视台 Web直播等； 录像点播或下载播放主要有Web电影点播、Web电视点播、 广告小视频、录制节目点播等等。
14
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.视频文件的几个主要格式 – 续3
RealVideo格式(.RA/.RM/.RMVB)：RealNetworks公司开
发的RealVideo 能把影像信息从视频服务器经流式传输 向用户计算机连续、实时传送。在RealMedia规范中主要 包括三类文件：RealAudio（用以传输接近CD音质的音频 数据）、RealVideo（用来传输连续视频数据）和 RealFlash（RealNetworks公司与Macromedia公司合作推 出的新一代高压缩比动画格式）。
山东大学计算机科学与技术学院
12
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.视频文件的几个主要格式 – 续1
FLV格式(.flv)：是FLASH VIDEO的简称，是一种新的视
频格式，原是Macromedia公司(现在是Adob公司)的流式 视频格式。由于文件极小、加载速度极快，特别适于 Internet视频，它有效地解决了视频文件导入Flash后， 使导出的SWF文件体积庞大，不能在网络上很好的使用等 缺点。目前各在线视频网站均采用此视频格式，如新浪 博客、56、土豆、酷6、youtube等，无一例外。FLV已经 成为当前视频文件的主流格式。 SWF格式(.swf)：Swf (shock wave flash) 原是 Macromedia公司（现是ADOBE公司）的动画设计软件 Flash的专用格式，是一种支持矢量和点阵图形的动画文 件格式，广泛应用于网页设计、动画制作等领域，swf文 件通常也被称为Flash文件。swf普及程度很高，现在超 过99%的网络使用者都可以读取swf档案，但浏览器必须 安装Adobe Flash Player插件。
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
第4章 多媒体与Web设计
山东大学计算机科学与技术学院
《网站规划与网页设计》
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
概 述
多媒体网站的重要性
Web多媒体设计原则
动画与Web设计
山东大学计算机科学与技术学院
9
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.视频与Web设计：Web嵌入视频播放–续1
山东大学计算机科学与技术学院
10
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.视频与Web设计：Web视频客户端播放软件，例如 PPStream、PPLive和PPMate、TVAnts等 – 续2
山东大学计算机科学与技术学院
13
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
7.视频文件的几个主要格式 – 续2
MPEG格式(.MPEG/.MPG/.DAT) ：MPEG文件格式是运动图
像压缩算法的国际标准，它包括 MPEG-1，MPEG-2， MPEG-3和MPEG-4，几乎所有的计算机平台共同支持，其 压缩效率非常高，同时图像和音响的质量也非常好。 MPG-1，1.5 Mbps，VCD是MPEG1其中的一个标准。以 每秒30帧(30fps)的速度提供352x240的视频分辨率。 MPEG-2，DVD，HDTV（高清晰电视广播）。MPEG-2 的 压缩算法压缩一部120分钟长的电影可以到压缩到4到 8GB的大小，图象质量要比MPEG-1高。 MPEG-3(.MP3)，此标准也是从早期的 MPEG 工作的基 础上发展而来的。它是一种音频压缩技术，是 MPEG1 和 MPEG-2 规范的一部分。 MPEG-4(.MP4)具有优于MPEG-2两倍的音视频编解码能 力。特点是压缩比高、成像清晰，容量小，一部DVD9碟，可以存贮10多部高清晰MPEG4网络电影。
山东大学计算机科学与技术学院
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
3.动画与Web设计
动画是利用人的视觉暂留特性，快速播放一系列
连续运动变化的图形图像，也包括画面的缩放、 旋转、变换、淡入淡出等特殊效果。 动画是由一系列静态画面连续地播放形成的，每 个动画页面称为帧(Frame)，一秒钟动画所包含的 帧数称为帧速率(fps)，计算机上的动画一般达到 15fps时，播放就已经很流畅了。(DVD帧速率： 30fps；电影帧速率：24fps) 通过动画可以把抽象的内容形象化，使许多难以 理解的内容变得生动有趣。 确保动画和内容紧密关联，网页应该浑然一体， 切忌Web动画是一个孤立个体，合理使用动画可以 达到事半功倍的效果。
山东大学计算机科学与技术学院
16
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
9. 音频格式
.mid：“MIDI”是乐器的数字化接口的缩写，用于
在音乐器材、合成器和计算机之间交换音乐信息 的标准协议。MIDI 的最大特点是文件长度很小， 但声音机械，一般用于背景音乐，不适合网上广 播。 .ra/.rm/.ram：RealNetworks 格式的文件扩展名 有RA、RM、RAM， RA、RM文件是真正存储数据的 文件；RA、RM格式的文件既有音频，也有视频； .mp3 ： 它 是 一 种 音 频 压 缩 技 术 ， 是 MPEG-1 和 MPEG-2 规 范 的 一 部 分 。 1991 年 ， 德 国 的 Fraunhofer 学院开发出 MP3。MP3 使用感知音频 编码压缩 CD 音质的声音，得到的保真度几乎一 模一样。 山东大学计算机科学与技术学院
山东大学计算机科学与技术学院
7
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
5.常见的动画设计效果
①条幅信息循环水平滚动播出 ②新闻通知等标示色彩图案交替显示(跳动与闪动) ③纵向滚动新闻通知的标题超链接信息 ④沿某一定轨迹运动的悬浮通知 ⑤多幅新闻照片或风光照片的循环切换 ⑥某些元素的色彩循环动画 ⑦元素的缓慢旋转，旋转结束标示网页或图片等下 载完成 ⑧元素的闪烁、淡入、淡出、爆炸与组合 ⑨图像之间的过渡与变形 ⑩子导航的弹出以及与主题相关的Flash动画
8.音频与Web设计
内嵌音频：内嵌音频是一种“音频流”技术，
内嵌在HTML网页中，用于背景音乐、视频伴音 或Flash动画伴音等，不能下载，除非网站整体 需要，否则不要内嵌音频。允许用户下载。 可下载音频：将音频文件完全下载到用户客户 端后，使用Windows Media Player或 RealOnePlayer等媒体播放器进行播放，用户可 以对音频完全控制：回放、暂停、停止、音量 等，如MP3音乐等，Flash由内嵌压缩音频。 流式音频：缓存，“实时”播放。 播放工具：RealOne Player, MidiaPlayer
视频与Web设计
音频与Web设计
多媒体需要考虑的问题
山东大学计算机科学与技术学院
2
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
1.多媒体重要性
文本、图形、图像、动画和声音等组合为多媒体
网站 纯文本Web网站几乎不存在 Web因为多媒体成为最具活力和吸引力的媒体 多媒体可以补充网站的视觉设计、音调和消息 多媒体的网页会导致网页下载减过慢，造成网站 浏览品质下降。 多媒体需要大带宽、浏览器插件或第三方应用程 序的支持 多媒体、网站品质、带宽和插件的关系 时间因素：珍惜Web用户时间-时刻吸引用户
山东大学计算机科学与技术学院
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
1.多媒体重要性 – 续
山东大学计算机科学与技术学院
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
2.多媒体Web设计原则
根据网站主题选择多媒体 重视网络带宽，慎用视频 网页应避免使用背景音频 避免网页使用零乱的动画 网页中避免使用滚动文本 网站中避免使用特别插件 网站拒绝最新最耀眼技术 避免网站设计的版权侵害 珍惜Web用户时间-时刻吸引用户
WMV格式(.WMV)：WMV又是一种独立于编码方式的在
Internet上实时传播多媒体的技术标准，Microsoft公司 希望用其取代QuickTime之类的技术标准以及WAV、AVI之 类的文件扩展名。
山东大学计算机科学与技术学院
15
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
山东大学计算机科学与技术学院
8
《网站规划与网页设 计》
普通高等教育“十一五”国家级规划教材 重点大学计算机专业系列教材
6.视频与Web设计
Web视频具有时序性与丰富的信息内涵，常用于交待事物的
发展过程，视频类似于电影和电视，有声有色，在多媒体 中充当起重要的角色。 Web视频是一个正在发展和非常有前途的技术，但现在频带 还不足够的宽，因此，Web视频的品质很低，实时播放使用 的还是比较少。 Web视频一般分辨率低、像素少、帧速率低、尺寸小，Web 视频观看品质比有限电视差很多，比电影的品质就更差了 电影的品质是Web视频追求的目标。 实时直播主要有视频会议、远程教育、视频聊天、视频电 话、Web TV直播、Web 电影直播、Web监控视频、电视台 Web直播等； 录像点播或下载播放主要有Web电影点播、Web电视点播、 广告小视频、录制节目点播等等。