第1章网页案例分析.ppt

中国高等院校计算机基础教育课程体系规划教材 《基于Web标准的网页设计》 本书目录 第一章 网页设计概述 第二章 HTML、XHTML和Web标准 第三章 HTML标记 第四章 CSS 第五章 Fireworks 第六章 网站开发和网页设计的过程 第七章 JavaScript 第一章 网页与网站基础 本章要点 网页和网站的关系 Web服务器和浏览器 动态网页和静态网页 域名与主机的关系 URL的结构 internet Internet是由遍布全世界的各种各样的网络通过TCP/IP协议连接成的一个松散结合的全球网，它使网络上的各台计算机（Internet上称为主机，即host）可以互相交换信息。 Internet为用户提供了各种各样的服务，如WWW，Email，FTP，即时通信等。 Google earth WWW WWW的含义是全球信息网（World Wide Web），简称为Web或“万维网”。它是一个基于超文本(hypertext)方式的信息查询工具，通过http协议传输超文本信息。是由欧洲核子物理研究中心（CERN）研制的。 WWW将位于全世界Internet上不同网址的相关数据信息有机地编织在一起，通过浏览器（browser）提供一种友好的信息查询界面。 WWW特点 WWW具有三个统一： 1.统一的资源定位方式：URL（统一资源定位器，即网址）。 2.统一的资源访问方式：HTTP（超文本传输协议）。 3.统一的信息组织方式：HTML（超文本标记语言）。 网 页 网页即是超文本，是通过超文本标记语言HTML（HypeText Markup Language）书写的一种纯文本文件， 客户通过浏览器看到的包含了如文字、图像、声音和动画等多媒体信息的每一个页面，其本质是一个纯文本文件。 浏览器对该纯文本文件进行了解释，才生成了多姿多彩的网页，除文本外，其它媒体素材（图像、声音、动画和影像等），都需要保存成单独的文件，通过URL嵌入到网页文件中。 可以看出，WWW服务主要是通过一个个多媒体网页提供给用户各种信息的 HTML超文本标记语言 超文本标记语言HTML作为一种语言，它具有语言的一般特征，即它是一种符号系统，具有自己的词汇（符号）和语法（规则）。 所谓标记，就是作记号。如我们写文章时通常用大体字标记文章的标题，用换行空两格标记一个段落 所谓超文本，就是相比普通文本有超越的地方，如超文本可以通过超链接转到指定的某一页，而普通文本只能一页页翻，超文本还具有图像，视频，声音等元素，并能和用户交互，这些都是普通文本无法达到的 HTML的历史 超文本标记语言HTML是一种建立超文本/超媒体文档的语言，它用标签标记文档中的文本及图像等各种元素，指示浏览器如何显示这些元素。HTML的发展历程如图所示 GML(1969) SGML(1985) HTML(1993) XML(1998) XHTML(2000) CML VML Generalized Markup Language Standard Generalized Markup Language Hyper Text Markup Language eXtensible Markup Language …… HTML与编程语言的区别 HTML语言与编程语言有明显不同，首先它不是一种计算机编程语言，而是一种描述文档结构的语言，或者说排版语言； 其次HTML是弱语法语言，随便怎么写都可以，计算机尽力去理解执行，不理解的按原样显示，而编程语言是严格语法的语言，写错一点点计算机就不执行，报告错误； 再次HTML语言不像大多数编程语言一样需要编译成指令后执行，而是每次由浏览器解释执行。 网 站 一个网站对应磁盘上的一个文件夹，网站的所有网页和其他资源文件都会放在该文件夹下或其子文件夹下，设计良好的网站通常是将网页文档及其它资源分门别类地保存在相应的文件夹中以方便管理和维护。这些网页通过链接组织在一起，其中有个网页称为首页，常命名为index.htm，必须放在网站的根目录下。 网页中所需要的图片文件一般单独保存在该目录下一个叫images的文件夹下。 网站结构 Wgzx web index.htm images style.css about.html h1.htm h2.htm h3.htm 首页文件的直接上级目录，是网站根目录 首页文件的间接上级目录，不是网站根目录 网站目录的建立 因此制作网站的第一步是在硬盘上新建一个文件夹，作为网站根目录，以后把这个目录上传到服务器上就可以了。由于我们制作网站一般需要用到Dreamweaver，所以还要配置网站在Dreamweaver下的开发环境，在Dr