meta标签使用总结

Meta标签给搜索引擎提供了许多关于网页的信息。这些信息都是隐含信息,意味着对于网页自身的访问者是不可见的

format-detection

用法:

<meta name="format-detection" content="telephone=no">

<meta name="format-detection" content="email=no">

<meta name="format-detection" content="telephone=no,email=no">

介绍: 默认telephone=yes, 如果在页面中有一串数字, Safari 会自动给数字添加链接样式,并且点击可跳转到拨号界面.设为 no 则禁止了把数字转为拨号连接.

HandheldFriendly

用法:


<!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑莓 -->

<meta name="HandheldFriendly" content="true">

介绍: 功能机时代的事实标签,最早在 AvantGo 用来标识移动内容,后来变成一个通用的标准来标识移动站点.

MobileOptimized

用法:


<meta name="MobileOptimized" content="320">

介绍: 功能机时代的事实标签,用于标识移动内容的另一种方法,改标签的缺点是—特定的宽度必须给出

viewport

用法:


<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,minimal-ui">


content的几个属性介绍:

keywords

用法:


<meta name="keywords" content="">

介绍:这个标签在过去很重要,但是现在却没什么价值了。现在没有一个主流的搜索引擎使用meta keywords来判断网页的内容了。

robots

用法:


<meta name="robots" content="noindex,nofollow">

介绍: Meta robots标签管理着搜索引擎是否可以进入网页,你可以用它来允许或不允许搜索引擎来获取你的网页、进入你网页中的子链接或对你的网页存档。

如果你不小心使用了两个矛盾的术语 (例如noindex和index),谷歌会选择最具限制性的选项。
为什么这个标签会对搜索引擎优化(SEO)起作用呢?首先,它可以防止对拷贝内容的冗余抓取,例如页面的打印版页面。它也可能会对那些内容不完整的页面或者而存在私密信息的网页起作用。

description

用法:


<meta name="description" content="string">

介绍: 这个标签曾经在搜索排名中占有很大的比重,但随着算法的不断更新升级,他的地位也逐渐下降.他虽然不会提高网站的排名,但是,因为他会被用在搜索引擎的结果页,所以依然有用.

这也就意味着它仍然可以提高你的网页点击率。毕竟,当用户搜索的关键词与之相匹配时,会以粗体显示突出显示。这就是为什么一个好的页面说明 (利用关键字的)
可以显示更多与用户相关的信息,进而提高了点击率。推荐的description长度为160 个字符。

author

用法:


<meta name="author" content="name,xxx@163.com">

介绍: 设置作者和联系方式

charset

用法:


<!-- 声明文档使用的字符编码 -->

<meta charset='utf-8'>
HTML

http-equiv


<!-- 优先使用 IE 最新版本和 Chrome -->

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

<!-- 不让百度转码 -->

<meta http-equiv="Cache-Control" content="no-siteapp" />

renderer


<!-- 启用360浏览器的极速模式(webkit) -->

<meta name="renderer" content="webkit">

浏览器强制竖屏


<!-- uc强制竖屏 -->

<meta name="screen-orientation" content="portrait">

<!-- QQ强制竖屏 -->

<meta name="x5-orientation" content="portrait">

<!-- UC强制全屏 -->

<meta name="full-screen" content="yes">

<!-- QQ强制全屏 -->

<meta name="x5-fullscreen" content="true">

<!-- UC应用模式 -->

<meta name="browsermode" content="application">

<!-- QQ应用模式 -->

<meta name="x5-page-mode" content="app">
上一篇

JavaScript之数组操作