《网页设计与制作》讲义-专题1网页设计基础知识..docVIP

专题1 网页设计基础知识 1.1 认识网站、网页与主页 1.1.1什么是网页 HTML是“HyperText Markup Language”的缩写，意为“超文本标记语言”，它是一种规范，一种标准。它是纯文本格式的，用任何文本编辑器都可以打开编辑。Web网页是如何制作出来的？制作好网页以后又如何将它发布到Internet上？这些问题正是本课程所要阐述的主题。 1.1.2什么是网站多个相互之间具有一定联系的网页就构成了一个网站。用于存储提供给用户浏览的网页文件。它也是一种文档的磁盘组织形式，由文档和若干文件夹组成，文档经过组织分类分别放在不同的文件夹中。主页网站的第一页，是一个网站的封面，也是该网站的目录。 Banner广告有多种规格和形式，其中最常用的是486?×?60像素的标准广告。这种标志广告有多种不同的称呼，如横幅广告、全幅广告、条幅广告和旗帜广告等。通常是以GIF、JpG等格式建立的图像文件或Flash文件。 4、导航栏—网站索引 导航栏既是网页设计中的重要部分，又是整个网站设计中的一个较独立的部分。一般来说网站中的导航栏位置在各个页面中出现的位置是比较固定的，而且风格也较为一致。导航栏的位置对网站的结构与各个页面的整体布局起到举足轻重的作用。 5、内容—网站的精神所在 文本一直是人类最重要的信息载体与交流工具，网页中的信息也以文本为主。与图像相比，文字虽然不如图像那样易于吸引浏览者的注意，但却能准确地表达信息的内容和含义。 图像在网页中具有提供信息、展示形象、美化网页、表达个人情趣和风格的作用。可以在网页中使用GIF、JpEG和pNG等多种图像格式，其中使用最广泛的是GIF和JpEG两种格式。 随着网络技术的发展，网页上出现了越来越多的Flash动画。Flash动画已经成为当今网站必不可缺少的部分，美观的动画能够为网页增色不少，从而吸引更多的浏览者。Flash动画不仅需要对动画制作软件非常熟悉，更重要的是设计者独特的创意。 6、页脚 页脚放置网页设计者的基本信息。 思考题：网页的设计需要考虑哪些因素？标题、Logo、页眉、页脚、导航的设计、版面布局的设计、连接结构的设计、网页色彩的搭配设计、字体的设计、宣传标语的设计等。 1.1.5网页的分类 我们通常看到的网页，大都是以HTM或HTML后缀结尾的文件。除此之外，网页文件还有以CGI、ASp、pHp和JSp后缀结尾的。目前网页根据生成方式，大致可以分为静态网页和动态网页两种。 1、静态网页 静态网页是网站建设初期经常采用的一种形式。网站建设者把内容设计成静态网页，访问者只能被动地浏览网站建设者提供的网页内容。其特点如下： 网页内容不会发生变化，除非网页设计者修改了网页的内容。 不能实现和浏览网页的用户之间的交互。信息流向是单向的，即从服务器到浏览器。服务器不能根据用户的选择调整返回给用户的内容。 静态网页的浏览过程如图1所示。 我们使用dreamweaver和html制作的网页属于静态网页。 2、动态网页 网络技术日新月异，许多网页文件扩展名不再只是.htm，还有.php、.asp等，这些都是采用动态网页技术制作出来的。动态网页其实就是建立在B/S架构上的服务器端脚本程序。在浏览器端显示的网页是服务器端程序运行的结果。动态网页是经过人与服务器对话的结果。如图网页上的登录、注册、网上购物等都属于此类网站。 静态网页与动态网页的区别在于Web服务器对它们的处理方式不同。当Web服务器接收到对静态网页的请求时，服务器直接将该页发送给客户浏览器，不进行任何处理。如果接收到对动态网页的请求，则从Web服务器中找到该文件，并将它传递给一个称为应用程序服务器的特殊软件扩展，由它负责解释和执行网页，将执行后的结果传递给客户浏览器。 应用程序服务器的作用是读取动态网页上的代码，根据代码中的指令完成网页，然后将代码从网页上去掉，所得的结果将是一个静态网页；应用程序服务器将该网页传送回网页服务器，网页服务器将网页发送到浏览器，浏览器得到的仍然是一个纯HTML的静态网页。 如图2所示为动态网页的工作原理图。 图2 动态网页的工作原理图 动态网页的一般特点如下。 动态网页以数据库技术为基础，可以大大降低网站维护的工作量。 采用动态网页技术的网站可以实现更多的功能，如用户注册、用户登录、搜索查询、用户管理、订单管理等。 动态网页并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才返回一个完整的网页。 搜索引擎一般不可能从一个网站的数据库中访问全部网页，因此采用动态网页的网站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求。 1.2 网站制作基本流程 创建网站是一个系统工程，有一定的工作流程，只有遵循一定的步骤，按部就班地来，才能设计出满意的网站。 1.2.1 前期策划