网页设计与制作
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
称W3C），又称W3C理事会。1994年10月在拥有
“世界理工大学之最”称号的麻省理工学院（MIT）
计算机科学实验室成立。建立者是万维网的发明者 蒂姆· 伯纳斯· 李。
蒂姆· 伯纳斯· 李（Tim Berners-Lee），1955年出生于英国，是万维网
的发明者，互联网之父，英国皇家学会会员，英国皇家工程师学会会
网站（Website）
网站是由单个或多个网页组成的集合，如Google、
Yahoo等。 网站是一种通信工具，就像布告栏一样，人们可 以通过网站来发布自己想要公开的信息，或者利 用网站来提供相关的网上服务，还可以通过网页
浏览器来访问网站，获取自己需要的信息或者享
受网上服务。
网站的类别
网站的分类：按内容可分为门户网站、个人网站、专业网站、职能网站。
员，美国国家科学院院士。 1989年3月正式提出万维网的设想，1990年12月25日，在日内瓦的欧
洲粒子物理实验室里开发出了世界上第一个网页浏览器。
浏览器（Browser）
浏览器是互联网的入口，是用于浏览网页的客户端程序。 个人电脑上常见的网页浏览器包括微软的Internet Explorer、Mozilla Firefox、Apple的Safari、Opera、Hot
• hyjgwangzhan@126.com • dianzishangwu
网页
认识网页（Web page）
网页是一种网络信息传递的载体，是构成网站的基本元素， 是承载各种网站应用的平台，网站就是由网页组成的。浏 览者只需要通过浏览网页，就可以了解到相关信息。如果
只有域名和虚拟主机，而没有制作任何网页的话，客户仍
用户可以很方便地浏览和下载文本信息，
因此文本是网页的主要信息载体。
（2）图像
图像是网页中不可或缺的元素，图像比文
本更直观更生动。网站标识Logo、Banner
等通常都是图像。
（3）多媒体元素
音乐、动画等多媒体元素也在网页中有非
常广泛的运用。
音频
网页中常用的音乐格式是MID、MP3， 背景音乐一般用MID。
超文本标记语言（Hypertext Markup Language）
简称HTML，是用于描述网页文档的一种标记语
言。
一个网页对应于一个HTML文件，HTML文件
以.htm或.html为扩展名。可以使用任何能够生成
TXT类型源文件的文本编辑来产生HTML文件。
<html> <head> …… </head> <body> …… </ body > </html>
网页设计与制作
网页制作基础
• 网络普及的现状
2013年7月17日，中国互联网络信息 中心（CNNIC）在京发布第32次《中国互 联网络发展状况统计报告》。 《报告》显示，截至2013年6月底， 我国网民规模达到5.91亿，互联网普及率为 44.1%。
赏析
• • • • • • 可口可乐网站 http://www.coca-cola.com.cn/#/home 红塔集团 http://www.hongta.com/cn/ 建设银行 http://www.ccb.com/cn/home/index.html
用ASP、PHP、JSP等程序生成的网页，可与浏览者进行
交互，也称为交互式网页。无论网页是否具有动态效果，
采用动态网站技术生成的网页都称为动态网页。 动态网页以.aspx、.asp、.jsp、.php、.perl、.cgi等形式 为后缀，并且在网址中有一个标志性的符号——―?‖。
（3）主页（Homepage）
• • • •
山东华宇工学院 http://www.sdhyxy.com/ 玉兰油 http://www.olay.com.cn/?utm_source=baid u&utm_medium=brandzone • 清华大学 • http://www.tsinghua.edu.cn/publish/newthu /index.html
域名分类
顶级域名分为两类： （1）国家顶级域名（national top-level domainnames，简称nTLDs）,目前 200多个国家都按照ISO3166国家代码分配了顶级域名，如中国cn，美国us， 日本jp等；
（2）国际顶级域名（international top-level domain names，简称iTDs），例
旧无法访问网站。 网页是一个文件，可以称它为网页文件，存放在世界某个 角落的某一部计算机中，而这部计算机必须与互联网相连。
网页的类型
按网页的表现形式：静态网页、动态网页。 按网页的位置：主页、内页。
（1）静态网页（Static Webpage）
用HTML语言编写的网页，其制作方法简单易学，但是不能进行交互，缺乏
Internet
• Internet也称因特网或国际互联网，是20世 纪70年代由美国军方的ARPAnet（阿帕网， 由美国高等研究计划署（Advanced Research Project Agency）创立）发展 而来的。 覆盖范围 局域网（LAN） 小 地域网（MAN） 广域网（WAN） 大
172.20.101.2
192.255.255.4 IP地址的发展：IPV4 → →IPV6
域名（Domain Name）
• 为了便于记忆，按照一定的规则给Internet上的计算机起 的名字就叫做域名。 域名由英文字符和数字组成，与固定的IP地址相对应。目 前也有一些国家在开发其他语言的域名，如中文域名。域 名不仅便于记忆，而且即使在IP地址发生变化的情况下， 通过改变解析对应关系，域名仍可保持不变。 域名的一般书写格式为：机构名、主机名、类别名、地区 名。如新浪网的域名为www.sina.com.cn，其中www机构 名，sina主机名，com类别名，cn地区名。
Browser、Google Chrome、GreenBrowser、360安全浏
览器、世界之窗（TheWorld）、腾讯TT、搜狗、傲游 （Maxthon）等。
统一资源定位符（Uniform Resource Locator, URL）
统一资源定位符是一种用于定位Internet中 某个资源的具体位置，以取得各种服务信息 的标准方法。如 http://www.163.com/ 即为一 个完整的URL。
动态服务器主页(Active Server Pages)
• 简称ASP，是Microsoft公司在1996年底推出的 一种运行于服务器端的Web应用程序开发技术。 ASP主要功能是为生成动态的、交互的Web服务 器应用程序提供一种功能强大的方式或技术。 • 因此可以说，ASP是一种类似于HTML、Script 与CGI的结合体，但是其运行效率却比CGI更高， 程序编制比HTML更方便且更有灵活性，程序安 全及保密性也比Script好。ASP文件的扩展名为 “.asp”，其中包括HTML标记、文本和脚本语句， 其脚本语句代码包含于“<%…%>”之间。
VBScript和JavaScript
Script（脚本）是一种介于HTML和 Java、C++之类高级编程语言之间的一种 特殊语言，它由一组可以在Web服务器或 客户端浏览器上运行的命令组合而成。
回顾以上所学的常用术语
• • • • • • • • Internet Intranet ISP IP 域名 网站 URL 浏览器 • • • • • • • FTP WWW 超级文本 超链接 HTML ASP VBScript和 JavaScript
（3）专业网站
专业网站是针对生活和工作中某一行业而
创建的网站。如文学网站、音乐网站、游
戏网站、交友网站、设计网站等。
（4）职能网站
职能网站具有专门的功能，如政府职能网
站、电子商务网站等。知名电子商务网站
有阿里巴巴（B2B）、淘宝（C2C）、京东
（B2C）等。
文件传输协议（File Transfer Protocol）
简称FTP，是一个用于在两台装有不
同操作系统的机器中传输计算机文件 的软件标准，是一种快速、高效、可 靠的信息传输方式。通过该协议可以
把文件从一个地方传输到另外一个地
方，而从真正地实现资源共享。
万维网（World Wide Web）
简称WWW，是一个基于超级文本的信息查询工具。 是一个资料空间，是目前Internet上最流行的一种信 息资源。利用万维网可以将全世界的信息链接在一 起，用户可以通过网络访问这些资源并加以利用。 万维网联盟（World Wide Web Consortium，简
灵活性。静态网页相对更新起来比较麻烦，适用于一般更新较少的展示型网 站。
静态网页的网址形式通常为：www.example.com/eg/eg.htm，即
以.htm、.html、.shtml、.xml等为后缀的。在HTML格式的网页上，也可以出 现各种动态的效果。
（2）动态网页（Dynamic Webpage）
网页的组成元素
网页是由多种元素组成的，文本和图像是 最基本的元素，在网页中起着非常重要的作 用，是网页主要的信息载体。除文本和图像 外，网页中还可以包括动画、音乐等多媒体 元素。
（1）文本
文本是网页中最基本的组成元素之一，
通过它可以非常详细地将要传达的信息传
送给浏览者。文本在网络上传输速度较快，
主页是打开网站后出现的第一个页面，也称为首 页。 一般来说，主页是一个网站中最重要、访问最频 繁的网页，它是一个网站的标志，体现了整个网 站的制作风格和性质。
Baidu Nhomakorabea
（4）内页
与主页相关联的页面，即网站的内部页面。
• 观看以下网页，说出你看到的网页元素 • http://www.qq.com/
IP地址（Internet Protocol）
IP是为计算机网络相互连接进行通信而设计的协议。 IP地址用二进制来表示，每个IP地址长32bit，即4个字节。 “00001010000000000000000000000001‖。为了便于使
用，经常写成十进制的形式，使用符号“.‖分开不同的字
Intranet
• Intranet也称企业内部互联网，用于在公 司或组织内传递和处理信息。 • 它是Internet技术在企业内部或封闭的用 户群内的应用，也是一个公司或组织所特 有的网络。
ISP
ISP（Internet Service Provider）
是Internet服务提供商。用户只有通过 ISP才能接入Internet，并享受各种服务。
Hypertext
超级文本，是一种使用户与计算机之间 能够更加密切交流的文本显示技术，它通 过对相关词汇进行索引链接，可以使带链 接的词汇或语句指向文本中的其他段落、 注解或文本。 通过链接实现信息跳转
超链接（Hyperlink）
当鼠标光标移动到网页中的某一元素时，鼠
标光标变为 状，该元素就是网页中的超 链接，是一种允许我们同其他网页或站点 之间进行连接的元素。
（1）门户网站
门户网站是一种综合性网站，主要提供新闻、搜索引擎、网络接入、
聊天室、电子公告牌、免费邮箱、影音资讯、电子商务、网络社区、 网络游戏、免费网页空间等。
在我国，典型门户网站有百度、新浪、网易、腾讯、搜狐、凤凰网等。
新浪
凤凰
搜狐
腾讯
（2）个人网站
个人网站是指个人或团体因某种兴趣、拥有某种 专业技术、提供某种服务而制作的具有独立空间 域名的网站。也可展示销售自己的作品等。
节。于是可以表示为“10.0.0.1‖。 在浏览器中输入网站所在服务器的IP地址就可以访问该网 站。
分类：ABCDE
A类“0.0.0.0-127.255.255.255” B类“128.0.0.0-191.255.255.255” C类“192.0.0.0-223.255.255.255”
如表示工商企业的.Com，表示网络提供商的.net，表示非盈利组织的.org等。 二级域名： 指顶级域名之下的域名，在国际顶级域名下，它是指域名注册人的网上名称， 例如ibm，yahoo，microsoft等；在国家顶级域名下，它是表示注册企业类别 的符号，例如com，edu，gov，net等。
“世界理工大学之最”称号的麻省理工学院（MIT）
计算机科学实验室成立。建立者是万维网的发明者 蒂姆· 伯纳斯· 李。
蒂姆· 伯纳斯· 李（Tim Berners-Lee），1955年出生于英国，是万维网
的发明者，互联网之父，英国皇家学会会员，英国皇家工程师学会会
网站（Website）
网站是由单个或多个网页组成的集合，如Google、
Yahoo等。 网站是一种通信工具，就像布告栏一样，人们可 以通过网站来发布自己想要公开的信息，或者利 用网站来提供相关的网上服务，还可以通过网页
浏览器来访问网站，获取自己需要的信息或者享
受网上服务。
网站的类别
网站的分类：按内容可分为门户网站、个人网站、专业网站、职能网站。
员，美国国家科学院院士。 1989年3月正式提出万维网的设想，1990年12月25日，在日内瓦的欧
洲粒子物理实验室里开发出了世界上第一个网页浏览器。
浏览器（Browser）
浏览器是互联网的入口，是用于浏览网页的客户端程序。 个人电脑上常见的网页浏览器包括微软的Internet Explorer、Mozilla Firefox、Apple的Safari、Opera、Hot
• hyjgwangzhan@126.com • dianzishangwu
网页
认识网页（Web page）
网页是一种网络信息传递的载体，是构成网站的基本元素， 是承载各种网站应用的平台，网站就是由网页组成的。浏 览者只需要通过浏览网页，就可以了解到相关信息。如果
只有域名和虚拟主机，而没有制作任何网页的话，客户仍
用户可以很方便地浏览和下载文本信息，
因此文本是网页的主要信息载体。
（2）图像
图像是网页中不可或缺的元素，图像比文
本更直观更生动。网站标识Logo、Banner
等通常都是图像。
（3）多媒体元素
音乐、动画等多媒体元素也在网页中有非
常广泛的运用。
音频
网页中常用的音乐格式是MID、MP3， 背景音乐一般用MID。
超文本标记语言（Hypertext Markup Language）
简称HTML，是用于描述网页文档的一种标记语
言。
一个网页对应于一个HTML文件，HTML文件
以.htm或.html为扩展名。可以使用任何能够生成
TXT类型源文件的文本编辑来产生HTML文件。
<html> <head> …… </head> <body> …… </ body > </html>
网页设计与制作
网页制作基础
• 网络普及的现状
2013年7月17日，中国互联网络信息 中心（CNNIC）在京发布第32次《中国互 联网络发展状况统计报告》。 《报告》显示，截至2013年6月底， 我国网民规模达到5.91亿，互联网普及率为 44.1%。
赏析
• • • • • • 可口可乐网站 http://www.coca-cola.com.cn/#/home 红塔集团 http://www.hongta.com/cn/ 建设银行 http://www.ccb.com/cn/home/index.html
用ASP、PHP、JSP等程序生成的网页，可与浏览者进行
交互，也称为交互式网页。无论网页是否具有动态效果，
采用动态网站技术生成的网页都称为动态网页。 动态网页以.aspx、.asp、.jsp、.php、.perl、.cgi等形式 为后缀，并且在网址中有一个标志性的符号——―?‖。
（3）主页（Homepage）
• • • •
山东华宇工学院 http://www.sdhyxy.com/ 玉兰油 http://www.olay.com.cn/?utm_source=baid u&utm_medium=brandzone • 清华大学 • http://www.tsinghua.edu.cn/publish/newthu /index.html
域名分类
顶级域名分为两类： （1）国家顶级域名（national top-level domainnames，简称nTLDs）,目前 200多个国家都按照ISO3166国家代码分配了顶级域名，如中国cn，美国us， 日本jp等；
（2）国际顶级域名（international top-level domain names，简称iTDs），例
旧无法访问网站。 网页是一个文件，可以称它为网页文件，存放在世界某个 角落的某一部计算机中，而这部计算机必须与互联网相连。
网页的类型
按网页的表现形式：静态网页、动态网页。 按网页的位置：主页、内页。
（1）静态网页（Static Webpage）
用HTML语言编写的网页，其制作方法简单易学，但是不能进行交互，缺乏
Internet
• Internet也称因特网或国际互联网，是20世 纪70年代由美国军方的ARPAnet（阿帕网， 由美国高等研究计划署（Advanced Research Project Agency）创立）发展 而来的。 覆盖范围 局域网（LAN） 小 地域网（MAN） 广域网（WAN） 大
172.20.101.2
192.255.255.4 IP地址的发展：IPV4 → →IPV6
域名（Domain Name）
• 为了便于记忆，按照一定的规则给Internet上的计算机起 的名字就叫做域名。 域名由英文字符和数字组成，与固定的IP地址相对应。目 前也有一些国家在开发其他语言的域名，如中文域名。域 名不仅便于记忆，而且即使在IP地址发生变化的情况下， 通过改变解析对应关系，域名仍可保持不变。 域名的一般书写格式为：机构名、主机名、类别名、地区 名。如新浪网的域名为www.sina.com.cn，其中www机构 名，sina主机名，com类别名，cn地区名。
Browser、Google Chrome、GreenBrowser、360安全浏
览器、世界之窗（TheWorld）、腾讯TT、搜狗、傲游 （Maxthon）等。
统一资源定位符（Uniform Resource Locator, URL）
统一资源定位符是一种用于定位Internet中 某个资源的具体位置，以取得各种服务信息 的标准方法。如 http://www.163.com/ 即为一 个完整的URL。
动态服务器主页(Active Server Pages)
• 简称ASP，是Microsoft公司在1996年底推出的 一种运行于服务器端的Web应用程序开发技术。 ASP主要功能是为生成动态的、交互的Web服务 器应用程序提供一种功能强大的方式或技术。 • 因此可以说，ASP是一种类似于HTML、Script 与CGI的结合体，但是其运行效率却比CGI更高， 程序编制比HTML更方便且更有灵活性，程序安 全及保密性也比Script好。ASP文件的扩展名为 “.asp”，其中包括HTML标记、文本和脚本语句， 其脚本语句代码包含于“<%…%>”之间。
VBScript和JavaScript
Script（脚本）是一种介于HTML和 Java、C++之类高级编程语言之间的一种 特殊语言，它由一组可以在Web服务器或 客户端浏览器上运行的命令组合而成。
回顾以上所学的常用术语
• • • • • • • • Internet Intranet ISP IP 域名 网站 URL 浏览器 • • • • • • • FTP WWW 超级文本 超链接 HTML ASP VBScript和 JavaScript
（3）专业网站
专业网站是针对生活和工作中某一行业而
创建的网站。如文学网站、音乐网站、游
戏网站、交友网站、设计网站等。
（4）职能网站
职能网站具有专门的功能，如政府职能网
站、电子商务网站等。知名电子商务网站
有阿里巴巴（B2B）、淘宝（C2C）、京东
（B2C）等。
文件传输协议（File Transfer Protocol）
简称FTP，是一个用于在两台装有不
同操作系统的机器中传输计算机文件 的软件标准，是一种快速、高效、可 靠的信息传输方式。通过该协议可以
把文件从一个地方传输到另外一个地
方，而从真正地实现资源共享。
万维网（World Wide Web）
简称WWW，是一个基于超级文本的信息查询工具。 是一个资料空间，是目前Internet上最流行的一种信 息资源。利用万维网可以将全世界的信息链接在一 起，用户可以通过网络访问这些资源并加以利用。 万维网联盟（World Wide Web Consortium，简
灵活性。静态网页相对更新起来比较麻烦，适用于一般更新较少的展示型网 站。
静态网页的网址形式通常为：www.example.com/eg/eg.htm，即
以.htm、.html、.shtml、.xml等为后缀的。在HTML格式的网页上，也可以出 现各种动态的效果。
（2）动态网页（Dynamic Webpage）
网页的组成元素
网页是由多种元素组成的，文本和图像是 最基本的元素，在网页中起着非常重要的作 用，是网页主要的信息载体。除文本和图像 外，网页中还可以包括动画、音乐等多媒体 元素。
（1）文本
文本是网页中最基本的组成元素之一，
通过它可以非常详细地将要传达的信息传
送给浏览者。文本在网络上传输速度较快，
主页是打开网站后出现的第一个页面，也称为首 页。 一般来说，主页是一个网站中最重要、访问最频 繁的网页，它是一个网站的标志，体现了整个网 站的制作风格和性质。
Baidu Nhomakorabea
（4）内页
与主页相关联的页面，即网站的内部页面。
• 观看以下网页，说出你看到的网页元素 • http://www.qq.com/
IP地址（Internet Protocol）
IP是为计算机网络相互连接进行通信而设计的协议。 IP地址用二进制来表示，每个IP地址长32bit，即4个字节。 “00001010000000000000000000000001‖。为了便于使
用，经常写成十进制的形式，使用符号“.‖分开不同的字
Intranet
• Intranet也称企业内部互联网，用于在公 司或组织内传递和处理信息。 • 它是Internet技术在企业内部或封闭的用 户群内的应用，也是一个公司或组织所特 有的网络。
ISP
ISP（Internet Service Provider）
是Internet服务提供商。用户只有通过 ISP才能接入Internet，并享受各种服务。
Hypertext
超级文本，是一种使用户与计算机之间 能够更加密切交流的文本显示技术，它通 过对相关词汇进行索引链接，可以使带链 接的词汇或语句指向文本中的其他段落、 注解或文本。 通过链接实现信息跳转
超链接（Hyperlink）
当鼠标光标移动到网页中的某一元素时，鼠
标光标变为 状，该元素就是网页中的超 链接，是一种允许我们同其他网页或站点 之间进行连接的元素。
（1）门户网站
门户网站是一种综合性网站，主要提供新闻、搜索引擎、网络接入、
聊天室、电子公告牌、免费邮箱、影音资讯、电子商务、网络社区、 网络游戏、免费网页空间等。
在我国，典型门户网站有百度、新浪、网易、腾讯、搜狐、凤凰网等。
新浪
凤凰
搜狐
腾讯
（2）个人网站
个人网站是指个人或团体因某种兴趣、拥有某种 专业技术、提供某种服务而制作的具有独立空间 域名的网站。也可展示销售自己的作品等。
节。于是可以表示为“10.0.0.1‖。 在浏览器中输入网站所在服务器的IP地址就可以访问该网 站。
分类：ABCDE
A类“0.0.0.0-127.255.255.255” B类“128.0.0.0-191.255.255.255” C类“192.0.0.0-223.255.255.255”
如表示工商企业的.Com，表示网络提供商的.net，表示非盈利组织的.org等。 二级域名： 指顶级域名之下的域名，在国际顶级域名下，它是指域名注册人的网上名称， 例如ibm，yahoo，microsoft等；在国家顶级域名下，它是表示注册企业类别 的符号，例如com，edu，gov，net等。