HTML-头部标签

        HTML头部就是放在head中的内容，主要是定义一些元数据和引入的资源；元素局是提供给浏览器和搜索引擎。这块数据非常重要。下面详细说说各个标签：

1.Title

title是定义网页的标题，每个html只能有一个title，且必须放在head中。标题必须精炼，一般不超30个字。

title的作用主要有以下几点：

1.在浏览器标题栏中显示

2.网页被收藏时，作为书签中的标题；

3.提供给搜索引擎，在搜索结果中显示title；

2.base

base标签用于给网页中所有链接提供一个基本链接。比如有个a标签，写了是相对目录，那么在跳转时就会将base标签的内容作为前缀合并成完整链接后跳转。

一般网页很少配置，所有链接的路径都是相对网页的地址。

3.meta

meta是定义网页的元数据，包括字符集、关键字、页面描述等

1).定义字符集 charset

<meta charset="UTF-8">

确定网页的字符编码，因为所有数据在计算机中存储和传输都是二进制，如果需要正常显示在解析时必须制定字符集。如果字符集选择错误，很有可能网页中显示的就会有乱码。

目前比较常用的是UTF-8和gb2312.

UTF-8是国际通用字库，里面包含了地球上所有的语言文字；GB2312是国标码，里面只有汉字、日语。

UTF-8是3个字节存储一个汉字，而GB2312是两个字节存储一个汉字，所以UTF-8占用的空间要比GB2312大很多，但就目前的宽带和存储，影响不大。还是需要优先保证网站的正常显示。

HTML5推荐使用UTF-8,这样网站在任何地方都能正常显示。

2).定义页面描述

<meta name="description" content="网页描述">

保存对网站的简单介绍，主要是给搜索引擎使用。SEO优化其中一项就包括优化网页描述，不同的描述对于搜索引擎可能有完全不同的效果。

3).定义网页关键字

<meta name="keywords" content="关键字1，关键字2，关键字3">

保存网站的关键字介绍，主要也是给搜索引擎提供。SEO优化的重要内容。

4).定义网页作者

<meta name="author" content="作者">

一种标识，实际上很少写。

5).刷新页面

<meta http-equiv="refresh" content="30">

也可以再配置一个url属性，定义浏览器在指定时间后内自动刷新或跳转。

基本不用，因为对客户体验影响太大，如果真有刷新的内容完全可以通过ajax局部刷新。

6).x-UA-Compatible

<meta http-equiv="x-UA-Compatible" content="IE=edge">

避免IE使用兼容模式(必须放在前面否则无效)

7).viewport

<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
对移动设备的友好 确保适当的绘制和触屏缩放 shrink-to-fit=no则禁用其缩放(zooming)功能*Bootstrap

8).pragma、Cache-Control、expires

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache, must-revalidate">
<META http-equiv="expires" content="0">

控制html页面缓存策略

9).robots

定义网页对搜索引擎的抓取配置。可以配置是否允许搜索引起抓取网页或者指定抓取的内容。有以下配置项：

index:允许搜索引擎抓取当前页面

follow:允许搜索引擎从这个页面找到链接，并跳转到其他页面。

noindex:禁止搜索引擎抓取页面

nofollow:禁止搜索引擎从该页面找到链接，拒绝其继续访问其他页面。

以上命令可以组合使用。

还有很多其他命令，不算太常用，不列举了。

4.style

在html文档中嵌入css。style不一定要放在head中，其他地方也可以。但一般很少会这样用，会显得网页内容比较臃肿。

5.link

通过link引入css样式文件。包括两个属性：rel和href。

<link rel="stylesheet" href="common.css">

6.script

分为两种，一种是直接在<script></script>中写js，还有一种是引入外部js文件。

如果是引入外部文件的方式，有几个可选配置项需要知道：

1).async

异步下载js文件，但是用的时候要注意，如果有其他地方使用了js文件中的变量或方法，可能会报错。因为异步之后加载的先后顺序不确定了。

2).defer 

表示可以延迟到文档全部解析和显示之后再下载脚本。

3).src

指定脚本文件地址