第2章网页头部Head

第三级,单击此处编辑母版标题样式,第,2,章 网页头部,Head,在第,1,章中介绍了网页结构。虽然头部内容不会显示在网页的主体里面，但对于网页来说，有着至关重要的影响。网页中加载的顺序是从头部开始的。例如，网页的标题是浏览者得到的第一条信息，浏览者可以根据标题来判断是否继续查看该网页。网页中的脚本一般都放在,之间，以便在网页主体中使用脚本时已经加载完成，否则脚本运行会出错。,2.1,头部包括的内容,前面讲了头部,之间内容的重要性。文件头部一般包含标题标签、,标签、内联样式表及预定义脚本等，接下来介绍头部之间所包含的内容。,2.1.1,网页标题,网页标题显示在浏览器的标题栏上。当浏览者打开网页时，从网页中得到的第一条信息便是网页标题。网页标题可以简明地概括网页的内容，点明网页的主题。从而浏览者可以决定是否往下浏览。另外，网页标题也是搜索引擎,robots,搜索时的主要依据。在大量的网络信息中，浏览者如果想搜索到自己的网页，最好的办法是定义一个合适的标题。,2.1.2 ,标签,标签在网页内容中不显示，但它的作用不容忽视。,标签主要用于为搜索引擎,robots,定义页面主题信息，它还可以用于定义用户浏览器上的,cookie,、鉴别作者、设定页面格式、标注内容提要和关键字；同时，它还可以设置页面，使其根据定义的时间间隔刷新自己，以及设置,RASC,内容等级等。,2.1.3,样式表和脚本,网页内联定义的样式表通常放在网页头部。这样，可以在网页内容加载之前先定义内容中需要的样式，从而防止样式的不完全载入，以及破坏网页的结构和外观等现象。其次，当网页中的元素需要修改样式时，方便进行查找和修改，从而使页面的结构清晰明了。,2.2,查看头部,虽然头部的内容不会显示在网页主体内，但是,Dreamweaver,CS3,依然提供了编辑工具，下面是查看头部内容的具体步骤：,【,文件头,】,窗口,【,属性,】,面板,2.3,设置标题,设置网页标题很简单，具体步骤如下：,2.3,设置标题,新建基本页，网页默认的标题为“无标题文档”。单击,【,文件,】|【,保存,】,命令，保存网页，按,F12,键进行预览，效果如图。,新建页,设置标题,2.3,设置标题,单击,【,页面属性,】,按钮，弹出,【,页面属性,】,对话框，如图所示,【,页面属性,】,对话框,2.4,认识,标签,标签的功能强大，但不是可见元素，所以不能用设置可见元素的方法进行设置。下面讲解如何在,Dreamweaver,CS3,中插入,标签，并对其进行设置。在新建的网页中已经包含了一个,标签，源码如下：,2.4,认识,标签,上面源码是设置文档类型和网页字符集。如果需要添加其他功能，需要插入,标签的其他属性。例如添加网页描述，具体步骤如下：,【,标签选择器,】,对话框,【,标签编辑器,-meta】,对话框,2.4,认识,标签,以上是通过插入标签的方法，,Dreamweaver,CS3,还提供了更方便的方法，具体步骤如下：,【,常用,】,选项卡,【,文件头,】,下拉菜单,【,说明,】,对话框,2.5 HTTP,标题信息,http-equiv,首先介绍,http-equiv,属性。,http-equiv,类似于,HTTP,的头部协议，会返回一些有用信息给浏览器，以帮助浏览器正确和精确地显示网页内容。常用的,http-equiv,属性值有,Content-Type,、,Content-Language,、,Refresh,、,Expires,、,Pragma,、,Set-Cookie,、,Window-target,、,Page-Enter,、,Page-Exit,、,MSThemeCompatible,和,Content-Script-Type,等。下面进行详细讲解。,2.5.1,设置文档类型与语言属性,Content-Type,Content-Type,属性用来设置文档类型。浏览器从,content,的属性值中获取网页的语言类型，判断是,HTML,还是,XML,，通常设置为,text/html,。,charset,指明网页中文字使用的字符集。例如，如果是简体中文，,charset,=gb2312,；如果是繁体中文，则,charset,=big5,。若未正确设置语言文字集，将可能导致网页显示混乱。使用格式如下：,2.5.2,设置自动刷新属性,Refresh,Refresh,属性设置页面自动刷新的时间，或自动跳转到其他的网页。此时的,content,属性值是自动刷新的时间或自动跳转的时间，单位是秒。,URL,是设置跳转网页的地址。使用的格式如下：源码设置为,10,秒后，自动跳转到百度网站。,上面的源码设置为,10,秒后，自动跳转到百度网站。,2.5.3,设置缓存时间属性,Expires,Expires,属性是设置网页在缓存中的过期时间。一旦网页过期，必须重新从服务器上载入。,content,属性值可设置为时间长度，也可设置为到期的日期，如果设置为日期，日期的格式必须是格林时间。使用格式如下：,2.5.4,设置禁用缓存属性,Pragma,Pragma,属性是设置禁止浏览器从本地计算机的缓存中调阅页面内容，如果设置了此属性值，网页则不保存在缓存中，每次访问时都刷新页面。这样设定，浏览者将无法脱机浏览。使用格式如下：,2.5.5,设置网页,Cookie,属性,Set-Cookie,Set-Cookie,用于设置,Cookie,。当浏览器访问页面时，将其自动保存；下次再访问该页面时，可直接从文件中读取，以提高速度。通常,HTML,文件不需要使用禁用缓存，对于,ASP,等页面，就可以使用禁用缓存，因为每次看到的页面都是在服务器下动态生成的，缓存就失去意义了。如果网页过期，存盘的,Cookie,将被自动删除。,2.5.6,设置打开窗口属性,Window-target,Window-target,用于设置打开窗口的属性。通过这个属性来强制页面在当前窗口以独立页面显示。使用格式如下：,2.5.7,设置过渡效果属性,Page-Enter,、,Page-Exit,Page-Enter,与,Page-Exit,用于页面打开或关闭时的过渡特效。,content,的属性值是动态滤镜的一种。,blendTrans,滤镜产生渐隐效果，,Duration,参数设置特效持续的时间，单位为秒。,revealTrans,滤镜产生多种效果，,Duration,参数设置特效持续的时间，,transition,参数设置效果类型，其取值范围为,023,。,2.5.8,设置主题与脚本类型属性,MSThemeCompatible,、,Content-Script-Type,MSThemeCompatible,设置是否关闭,Windows XP,主题。,content,属性值为,Yes,或,No,。使用格式如下：,以上是,http-equiv,属性的介绍，并没有完全囊括所有类型，如需要更详细地了解，参阅其他资料。下面讲解,name,属性。,2.6,页面描述信息,name,name,的属性值有,Keywords,、,Description,、,Author,和,Robots,等。,name,属性主要用来描述页面信息，它是搜索引擎识别的关键所在。为了使网页被搜索引擎发现，设置,name,属性是必不可少的。下面对各个属性值的类型分别进行介绍。,2.6.1,设置描述与关键词属性,Description,Description,（页面内容的简介）用来告诉搜索引擎网站的主要内容。在设置时尽量要把简介写得清晰明白，字数不能太短也不能太长，一般保持在,80200,之间。,Keywords,（页面关键字）用于为搜索引擎提供关键字的列表，选择合适的关键字是提高被搜索几率的关键因素。多个关键字之间用逗号隔开，逗号表示逻辑,“,或,”,。空格表示逻辑,“,与,”,。,2.6.2,设置搜索机器人引向属性,Robots,Robots,属性用于设置搜索机器人的引向。,Robots,用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。,Content,的参数有,all,、,none,、,index,、,noindex,、,follow,和,nofollow,，默认为,all,。,2.6.3,设置作者信息属性,Author,Author,用于设置作者信息。,content,属性值就是作者的相关信息。使用格式如下：,以上介绍,http-equiv,和,name,常用属性的设置方法，由于,标签设置比较复杂，读者可以在使用的过程逐渐掌握。,2.7,设置基链接属性,base,标签设置网页的基链接。使用格式如下：,href,属性值是基链接的位置。当设置好基链接后，自动在网页中的相对路径前加上,http:/,。,2.8,设置链接文件属性,link,标签用于设置链接到的文件，从而引入外部文档。使用格式如下：,其中,href,设置链接文件的路径，,rel,设置与链接文件的关系，,type,是链接文件的类型，这些是常用的设置方式。,2.9,专家总结,本章介绍的内容虽然不是网页的主体内容，但对于网页设计却有着非常重要的影响。设置标题虽简单，但它却是网页浏览者收到的第一条信息，在网页设计时需要妥当考虑。,标签功能强大，如果想要网页被浏览者搜索到，则需要读者仔细学习它的使用方法，并多进行练习。,