网页制作课件第1章 网页设计基础.ppt

* 第1章 网页设计基础 制作人：曾俊国 重点和难点 了解互联网的相关概念 理解网页与网站的基础知识及其关系 HTML基础知识 网站设计基本流程 1.1 互联网(Internet)基础 互联网(Internet)已经渗透到了当今社会的各个方面。用户通过互联网即可以坐在家里了解最近的新闻，阅读当天的报纸，了解股市行情，还可以实现网上购物，预订机票和酒店房间，查阅资料。各类学校还可以通过互联网实现远程教学。 1.1.1 Web Web是World Wide Web的简称，业界简写为WWW（万维网或全球蜘蛛网），其本质是一个将信息检索与超文本（hypertext）技术结合起来的全球信息系统，这些信息主要采用HTML(hyper text markup language，超文本置标语言)文件格式。Web最大的特点是采用超文本置标语言进行编辑文本，文本中含有大量的超链接，一旦鼠标单击超链接元素，在浏览器窗口中就会显示相应的内容。 1.1.2、URL 为了确定被访问的站点及其网页的位置，浏览器运用了统一资源定位器（Uniform Resource Location，URL）技术，它提供了在Web上访问资源的唯一方法和路径。浏览器运用了URL技术、URL路由协议类型、主机域名和资源文件三部分组成，一般URL的完整使用格式如下： 协议://主机域名或IP地址:端口号/路径名/文件名。 1.1.3、浏览器 浏览器是用来定位和访问Web信息的工具软件，它的作用是把各种从Web上接收的信息解释成人们容易识别和接受的屏幕显示方式呈现给用户。根据不同的计算机平台、操作系统，以及用户界面需求，上网的用户可以选择不同的浏览器。近年来，随着Web技术的发展，浏览器的功能越来越强，不但可以浏览各类网页，还可以进行网上会议、收发电子邮件、视频点播等工作。 1.2 网页与网站的概念 用户是通过Internet上的各种诸如Web服务器提供的服务来获取自己所需的信息。如果把网站比作各种信息的集散地，网页则是把信息从集散地（网站）输送到各地的主要载体。 1.2.1、网页 网页是我们在浏览器上看到的窗口界面，是一种可以在万维网上传输，并被浏览器认识和翻译成页面显示出来的文件。网页的最大特色就是超链接，通过超链接使各个网页之间连接起来，使网站中众多的页面构成一个有机整体，单击超链接浏览器可以进入一个新的网页或转到当前网页的其他位置。 1.2.2、网站 网站（Website）是一群相关网页的集合，这就意味着需要单独编辑若干个网页文件，然后通过“超链接”把它们链接在一起，让浏览者可以看到网站中所有的网页。 1.2.3、网页设计 网页设计的专业软件比较多，如微软公司的FrontPage等，但最经典的还属网页设计三剑客：Dreamweaver 最初是由美国著名的软件开发商Macromedia公司（现已被Adobe公司收购）推出的一个“所见即所得”的可视化网站开发工具。 Fireworks是网页设计“三剑客”之“火焰”，它以处理网页图片为特长，并可以轻松创作GIF动画。 Flash是网页三剑客之中的“闪电”，其以制作网上动画为特长，它做出的动画声音动画效果都是其他软件无法比拟的。 1.3 网页设计的基础知识 1.3.1、HTML的概念及基本语法 HTML（Hypertext Markup Language）即超文本置标语言是制作网页的基础语言，它是一系列的标记符号或希望显示在文件内的代码。这些标记告诉浏览器应该如何显示文字和图形。在WWW上最基本的传输单位是Web页，而这些Web都是用HTML语言编写的，因此，HTML是构成Web页面（Page）的主要工具。 （1）HTML基本结构（2）HTML标记属性 （3）字体 （4）文字布局标记 （5）表格 （6）表单的制作 （7）图像 （8）链接 1.3.2、静态网页与动态网页 1.静态网页：静态网页是指网页基本上全部用HTML语言制作，页面的内容是固定不变的，静态网页是网站建设的基础。 2.动态网页：是指网页文件不仅具有HTML标记，而且含有需要Web服务器执行的程序代码，如数据库连接、数据库数据读取与更新等，动态网页能够根据不同的时间和不同的用户显示不同的内容 专业的大中型网站都是建立在使用数据库的基础之上的，用户要想通过浏览器在Web页面上查询数据库里的相关数据，就要编写服务器端的程序。 1.4 网站设计的流程 网站开发者通过与客户的交流，首先要了解客户对网站的内容、功能、规模和使用对象等方面的要求，让用户将所有的想法尽可能的阐述清楚，并把所有的要求罗列出来，不要遗漏，假如客户的需求做得不完整，随时可能会产生意料之外的变更，