网站设计与网页制作-全套PPT课件.pptx

网站设计与网页制作子项目1 网站建设基础知识与整体流程项目任务1.1 了解网站建设基础知识 课程内容了解网站建设基础知识熟悉网站建设的整体流程 ★ 项目分析 随着网络的发展，互联网已成为人们生活的一部分，这都是网页的功劳。通过网页，浏览者可以得到各种信息，可以交换思想，可以通过网络进行购物。而那些视觉效果比较好的网站往往会受到用户的青睐。那么这些网页是如何制作出来的呢？ 要设计出令人满意的网页，就必须熟练掌握网页设计软件的基本操作，和网页制作的相关技术。 ★ 技能要求 （1）能识别网页和网站。（2）掌握网页制作的相关技术。（3）掌握网页制作工具的基本功能。 ★ 项目展示  ★ 任务实施一、引入1．首先，我们先来看两个示例网页，如图所示。 同样是设计公司，但在网上展示出的效果却如此不同。假设大家是客户，在经费许可的情况下，你会优先选择哪一家来做设计呢？当然是第一家了。这就是网页设计最能体现出效益的地方。但是，同样是做网页的，为什么差距如此之大呢？原因就在于网页设计是平面设计、动画设计、音效设计、配色等各个方面结合的产物。因此，学会网页设计虽然不难，但是要做好网页，却需要不断学习和积累，在不断的探索和实践中进步。 ★ 任务实施二、认识网页和网站1．什么是网页 在互联网上应用最广的功能应该是网页浏览。浏览器窗口中显示的一个页面被称为一个网页，是计算机网络最基本的信息单位，网页实际上就是一个文件，这个文件存放在世界上某个地方的某一台计算机中，而且这台计算机必须要与互联网相连接。当用户在浏览器的地址栏中输入网页的地址后，经过一段复杂而又快速的程序解析后，网页文件就会被传送到用户的计算机中，然后再通过浏览器解释网页的内容，最后展现在用户的眼前。一般网页上都会有文字和图片等信息，而复杂一些的网页中还包括动画、表单、视频和音频等内容。 ★ 任务实施二、认识网页和网站2．什么是网站 网站是众多网页的集合。不同的网页通过有组织的链接整合到一起，为浏览者提供更丰富的信息。网站同时也是信息服务类企业的代名词。如果某人在网易或者在搜狐工作，那他可能会告诉你，他在一家网站工作。 我们可以这样形容网页和网站的关系：假如网站是一本书的话，网页就是这本书中的一页。 ★ 任务实施二、认识网页和网站3．静态网页和动态网页 Web 站点中的网页分为静态网页和动态网页。 所谓静态网页是指纯粹的HTML格式的网页，这种网页制作完成后内容是固定的，修改或更新都必须通过专用的网页制作工具，并且只要修改网页中的任何一个内容都必须重新上传一次，以此覆盖原来的网页。 每个静态网页都有一个固定的URL。网页的URL地址通常以.html、.htm或 .shtml等形式作为扩展名。每个网页都是独立的文件，网页内容都保存在Web站点中。静态网页在网站制作和维护方面工作量较大，且拥有的人机交互能力较差。 ★ 任务实施二、认识网页和网站3．静态网页和动态网页 所谓动态网页，并非指网页上具有各种动画和其他视觉上的“动态效果”，动态网页也可以是纯文字的，与静态网页的根本区别是，动态网页是以数据库技术为基础采用动态网页技术生成的网页。 HTML是编写网页的语言，但仅用HTML是不能编写出动态网页的，还需要使用另外的技术。动态网页中的脚本语言，如ASP、PHP、JSP、ASP.NET等，通过这些脚本将网站内容动态存储到数据库中，用户访问网站是通过读取数据库来动态生成网页。当动态网页在浏览器中显示时，会自动调用存储在数据库中的数据，而信息的更新和维护则利用数据库在后台进行。 ★ 任务实施三、了解网页制作技术1．HTML HTML是目前最流行的网页制作语言。互联网中的大多数网页都是由HTML（Hyper Text Markup Language）语言所构成。超文本标记语言，即HTML，是建立网页文本的一种标记语言，它是在SGML定义下的一个描述性语言，是一种简单、通用的全置标记语言，它通过标记和属性对文本的属性进行描述。 HTML可以通过超链接指向不同地址中的文件，支持在文本中嵌入图像、影像、声音等不同格式的文件。HTML还具有强大的排版功能，利用HTML和其他的Web技术可以创造出功能强大的网页。 ★ 任务实施三、了解网页制作技术1．HTML HTML 5是近十年来Web开发标准最巨大的飞跃。和以前的版本不同，HTML 5并非仅仅用来表示Web内容，它的新使命是将Web带入一个成熟的应用平台，在HTML 5平台上，视频，音频，图像，动画，以及同电脑的交互都被标准化。 H