HTML中meta标签如何正确使用

  如果我们在浏览器中按下F12或者Ctrl+shift+J,便可以打开开发者工具,在element中即可看到<head>元素中有不少<meta>元素。对于网页而言,<meta>元素是必不可少的。我们在创建一个html5文档时,就会发现类似于<meta charset="UTF-8">这样的标签,来规定解析文档的字符类型。那么,它还有哪些作用呢?下面,我将一探究竟!我会通过下面几个部分来讲解,如果你希望直接看后面部分的内容,可以直接点击下面的文字。

<meta>标签的基本介绍

<meta>标签中的属性列举

<meta>标签中的name属性应用

<meta>标签中的http-equiv属性应用

第一部分:<meta>标签的基本介绍

  <meta>标签是HTML网页源代码中的一个重要的html标签。META便签用来描述一个HTML网页文档的属性,例如作者、日期和时间、关键词、页面刷新。除此之外,<meta>标签用于搜索引擎优化(seo)。它位于HTML文档中<head>元素内,虽然它提供的信息用户不可见,但它却是文档最基本的元信息。

第二部分:<meta>标签中的属性列举

  <meta>标签中属性我们可以分为必选的属性和可选的属性。

      1.必选属性:content属性。该属性是为了定义与http-equiv或者name属性相关的元信息,其中的内容是为了便于搜索机器人查找信息和分类使用的。

      2.可选属性:

name属性。该属性主要用于描述网页。name属性的值可以有:author、description、keywords、generator等等

http-equiv属性。该属性相当于http的头文件作用,可以向浏览器返回一些有用的信息,以帮助正确和精确的显示内容。http-equiv属性的值可以有content-type、expires、refresh等等。

第三部分:<meta>标签中的name属性应用   A keywords(关键字:告诉浏览器你的网页的关键字是什么)   B description(描述:告诉浏览器你的网页的主要内容是什么)

    这两个属性值我放在一起说,是因为它们的作用非常相似。因为设置这两个值可以帮助你的主页被各大搜索引擎登陆,提高网站的访问量。于是这两个属性值的设置是格外重要的。因为按照搜索引擎的工作原理,搜索引擎会首先排除机器人自动检索页面中的keywords和description,并将其加入自己的数据库,然后根据关键词的密度将网站排序

我们可以像下面这样使用:

1

2

 

<meta name="keywords" content="关于meta标签,网页,918之初">

<meta name="description" content="HTML中<meta>标签如何正确使用">

 

  值得注意的是,name一定要和content属性配合使用。

  C robot(机器人向导:用于高速机器人哪些页面需要索引,哪些页面不需要索引)

  该属性的值有all、none、index、noindex、follow和nofollow。默认为all。

  设定为all:文件将被检索,且页面上的链接可以被查询;

  设定为none:文件将不被检索,且页面上的链接不可以被查询;

  设定为index:文件将被检索;

  设定为follow:页面上的链接可以被查询;

  设定为noindex:文件将不被检索,但页面上的链接可以被查询;

  设定为nofollow:文件将不被检索,页面上的链接可以被查询。

  我们可以像下面这样使用:

1

 

<meta name="robot" content="none">

 

  即搜索机器人在自动检索页面时,将不会检索到这个页面。

  D author(作者:用于告诉搜索机器人网页的作者)

1

 

<meta name="author" content="somebody">

 

第四部分:<meta>标签中的http-equiv属性应用

A.content-type(文档内容类型:用于设定文档的类型和字符集)

  这是meta便签中最为常见的一中设置,在制作网页时,我们在纯HTML代码可看到它是定义你的网页的语言,当浏览器访问到你的网页时,浏览器便会根据此来识别并进行相应的设定,否则,浏览器就会使用默认的设定方法。

?

1

 

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

 

B.expires(期限:可以用于设定网页的到期期限)

  一旦网页过期,那么就必须在服务器上重新刷新而不能通过缓存获取网页。值得注意的是:其中设置的时间必须是GMT格式。

1

 

<meta http-equiv="expires" content="Fri,12 Jan 2001 15:15:15 GMT">

 

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/a0ca8b69bbdb861b54703ecadca474a2.html