20253月份清华大学A版初中信息科技七年级网页与编码课件.pptxVIP

第四节网页与编码清华大学信息科技七年级下册

CONTENTS常见的媒体信息编码流媒体与流式传输网页的基本元素网页的W3C标准网页制作工具与方法网页的渲染

常见的媒体信息编码一

常见的媒体信息编码信息编码就像是翻译官所谓信息编码就是将信息转换成一种特定的格式，以便能够在不同的系统或设备之间进行传输、存储和处理，并保障信息的传输效率、数据安全和完整性等方面的要求。什么是信息编码

常见的媒体信息编码由于网络交流中的媒体信息有着极为复杂的传输与播放环境，为统一交流双方的网络环境与计算机，互联网编制了一套大家都支持的编码方式或文件格式。常见的媒体信息编码

什么是“乱码”乱码是指在本地计算机上打开网页时，使用了互不兼容的文字集造成无法被阅读的一系列字符。UTF-8是互联网中使用最广泛的字符编码。字符是各种文字和符号的总称，包含各国文字、标点符号、图形符号和数字等。较常见的字符集有ASCII字符集、GB2312字符集、UTF-8字符集与Unicode字符集等。

文本乱码验证实验体验活动打开网页，尝试将UTF-8字符编码更改为其他，再观察网页中文字的变化，并将数据记录到表中。实验内容：验证网页文本出现乱码的原因。实验准备：学生机、浏览器与网页。相关对象相关现象或数据记录实验结论被验证网页的网址浏览器的名称网页的原字符编码修改后的字符编码观察到的现象

流媒体与流式传输在4G网络技术普及之前，绝大部分公用网络普遍存在网速偏慢的难题，而网络交流中的大容量音视频文件，无论是上传还是下载，都需要等待较长的时间，进而降低了用户体验感。为了保障大容量的多媒体信息高校传输，科学家们提出了流媒体与流式传输的概念。流媒体是对音视频等网络多媒体进行数据压缩并分段发送的一种流式传输技术，能够边传输边播放，提升了用户的体验，目前该技术已经广泛地应用于各种领域。

流式传输原理流式传输是帮助流媒体避免“须下载完毕后才可播放”的关键，其原理如图所示。与传统传输方式不同，它会将分割成小块的媒体数据，按照一定的顺序与速率在网络中传输，客户端收到之后则会进行缓冲与播放。缓冲就是不断地接受视频片段并加载媒体数据，而已经播放完毕的视频片段则会被丢弃。

网页制作与渲染二

网页制作与渲染网页诞生至今年代久远，作为社交媒体与社交网站发布的重要载体，支持用户在上面发布各种媒体信息并将其转发访问，是网络交流中最常见的一种信息发布方式

网页的基本元素什么是网页的元素？网站与网页的关系，就像是一本书与它的书页那样，网站通常是由许多张内容互相关联的网页构成。网站中的网页可以分为首页与内页。首页又叫主页，主要用来导航与链接到其他内页，一个网站通常只有一张主页。内页负责跳转到网站内部其他页面，可以展现其他的网络信息。

网页的基本元素表单导航栏栏目超链接网页版面结构大多为导航栏、栏目与正文三大部分，并由文本、图片、动画、音频、视频、表哥、超链接、表单、框架与内嵌程序等基本元素组成。其中表单用来收集和记录信息，框架的作用是将网页分割成不同区域，内嵌程序则是实现动态效果与交互功能。

网页的W3C标准表现：CSS(层叠样式表)用CSS来控制网页的布局、字体、颜色、背景、边框、动画等各种样式，从而让网页更加美观与易读，就像是给汽车绘制漂亮的外观。结构：HTML（超文本标记语言）用HTML语言创建网页标题、段落、列表与表格等在内的整体结构，并通过HTML标签来组织呈现网页内容，就像是搭建一辆汽车的架构。行为：JS（JavaScript脚本语言）用JS来为网页添加交互功能和动态效果，从而让网页更加酷炫，提升用户体验，就像是给汽车设计更强大的驾驶性能

网页的HTML基本结构!DOCTYPEhtml?声明位于文档头部，告诉浏览器将要加载的文档类型。html?是HTML页面的根元素head?包含了文档的元数据，元数据包括页面标题、角色和字符集定义，还可以添加CSS样式与JavaScript脚本等。title?用于描述网页的标题body?用于描述网页的页面内容h1?用于描述一个一个大标题p?用于描述一个段落

网页制作工具与方法为了提高网页制作效率，人们开发出各式各样的网页制作工具。

制作简单的网页体验活动请新建一个记事本文件，参照书上图1.4.5中所示的样例来编写网页的html代码、并保存为html的网页文件，再用浏览器打开。体验内容：制作简单的网页。体验准备：学生机、记事本程序。

网页的渲染无论采用何种制作工具，编写生成的网页都是一种包含有HTML标签、CSS样式与JavaScript的纯文本文件。而它真实的视觉效果与功能，则必须经过浏览器的渲染，才能正常显示出来。所谓渲染，就是浏览器自动结合网络终端的屏幕性能，对服务器响应所返回的HTML、CSS和JavaScript等相关资源文件进行解析。一般