运用meta标签进行网站优化

时间: 2019-07-30阅读: 117标签: 优化

一,常用的HTTP-EQUIV类型:

Set-Cookie(cookie设定)

说明:如果网页过期,存盘的cookie将会被删除(必须是GMT的时间格式)
<meta http-equiv="Set-Cookie" content="cookievalue=xxx;expires=Wednesday,21-Oct-98 16:14:21 GMT;path=/">

 Window-target(显示窗口的设定)

说明:强制页面在当前窗口以独立页面显示----用来防止别人在框架里面调用你的页面
<meta http-equiv="Window-target" content="_top">

 Content-Type(显示字符集的设定)

说明:设定页面使用的字符集
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">

 expires(期限)

说明:用于设定网页的到期时间,一旦网页过期,必须到服务器上重新调阅(必须使用GMT的时间格式)
<meta http-equiv="expires" content="Wed, 26 Feb 2016 08:21:57GMT">

 Pragma(cache模式)

说明:禁止浏览器从本地机的缓存中调阅页面内容(访问者无法脱机浏览)
<meta http-equiv="Pragma" content="no-cache">

 Refresh(刷新)

说明:需要让页面定时链接到其他页面的话,就用这句(停留五秒后自动跳转到URL地址)
html中的meta信息里可以直接设置跳转,可以设置跳转延迟时间和跳转url,经常应用,比如支付完了告诉用户支付成功并跳转到订单页面。下面的列子表示:5秒钟后页面会自动跳转到http://www.fly63.com
<meta http-equiv="refresh" content="5;url=www.fly63.com">

 

二,meta标签name变量语法

keywords(关键字)---已经过时

说明:用来告诉搜索引擎 你网页的关键字是什么
<meta name="keywords" content="xxx">

 description(简介)------(import)

说明:用来告诉搜索引擎你网站的主要内容
<meta name="description" content="xxx">

 robots(机器人向导)------(import)

说明:robots用来告诉搜索机器人 哪些页面需要索引 哪些不需要 ;用来阻止搜索引擎获取拷贝页面、私密页面和未完成的页面.content参数有:all,none,index,noindex,follow,nofollow.默认all 
<meta name="robots" content="none">
 其中:

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

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

index:文件将被检索;

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

noindex:文件将不被检索;

nofollow:页面上的链接不可以被查询。

author(作者)

说明:标注网页的作者
<meta name="author" content="huangqingmei">

 notranslate----(important)

说明:有时,Google在结果页面会提供一个翻译链接,但有时候你不希望出现这个链接
<meta name=”google”content=”notranslate” /> 

 

三,以下是一些不常用的例子和简要的说明

<meta name="viewport" content="width=device-width, initial-scale=1" />
 viewport属性说明:

width:可视区域的宽度,值可为数字或关键词device-width

height同width

intial-scale:页面首次被显示时可视区域的缩放级别,取值1.0则页面按实际尺寸显示,无任何缩放

maximum-scale=1.0, minimum-scale=1.0;可视区域的缩放级别,

maximum-scale用户可将页面放大的程序,1.0将禁止用户放大到实际尺寸之上。

user-scalable:是否可对页面进行缩放,no 禁止缩放

<meta name="googlebot" content="index,follow" />
<meta name="verify" content="index,follow" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="google" content="index,follow" />

 启用WebAPP全屏模式

<meta name="apple-mobile-web-app-capable" content="yes" />

 隐藏状态栏/设置状态栏颜色:只有在开启WebApp全屏模式时才生效。content的值为default | black | black-translucent 。

<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />

 添加到主屏后的标题

<meta name="apple-mobile-web-app-title" content="标题">

 忽略数字自动识别为电话号码

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

忽略识别邮箱

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

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

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

微软的老式浏览器

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

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">

windows phone 点击无高光

<meta name="msapplication-tap-highlight" content="no">

 

四,实例

在html页面上设置不缓存
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0"> 

 

 

链接: http://www.fly63.com/article/detial/4400

如何让你的 JS 写得更漂亮?

网上有不少关于JS编写优化建议,这里我根据自己的经验提出一些比较有用的意见。1. 按强类型风格写代码,JS是弱类型的,但是写代码的时候不能太随意,写得太随意也体现了编码风格不好。下面分点说明:

首页白屏优化实践

自从前端三大框架React、Vue、Angular面世以来,前端开发逐渐趋向规范化、统一化,大多数时候新建前端项目,首先想到使用的技术一定是三大框架之一,框架给前端开发带来了极大的便利和规范,但是由于这三大框架都是JS驱动

网站搜索引擎优化,值得关注的4个策略有哪些?

在做网站搜索引擎优化的过程中,对于企业站而言,由于SEO人员都是处于执行层面,甚至即使你有权制定SEO优化方案,偶尔也是草草就上手操作。当你运营到一定阶段的时候

webpack优化分享

Webpack 就像一条生产线,要经过一系列处理流程后才能将源文件转换成输出结果。 这条生产线上的每个处理流程的职责都是单一的,多个流程之间有存在依赖关系,只有完成当前处理后才能交给下一个流程去处理

如何提升网站访问速度?

但网站打开速度变的不可科学的时候,怎么检测打开速度是多少?检测网站是否被劫持、域名是否被墙、DNS污染检测、网站打开速度检测等信息。如果你是网站使用者,你可以通过升级宽带、光纤、升级CPU内存

React 中 的 9 种优化技术

谷歌的数据表明,一个有 10 条数据 0.4 秒可以加载完的页面,在变成 30 条数据加载时间为 0.9 秒后,流量和广告收入减少了 20%。当谷歌地图的首页文件大小从 100kb 减少到 70~80kb 时,流量在第一周涨了 10%,接下来的三周涨了 25%

Web前端性能优化

web性能优化,主要分为前端和后台两个部分性能优化,后台性能优化决定了web能不能用,前端优化决定了其好不好用,也就是牵涉到前端用户体验和web易用性等情况,所以前端性能与用户体验是有着极大的关联的。

webpack构建速度常规优化方法

使用webpack.DllPlugin优化,其实并没有优化速度,只是把一些不需要经常变更的部分提前构建,之后只需要构建变更的部分就可以了,确实优化了时间,使用external,不构建基础脚本,使用外部脚本引入,确实减少了时间

js的防抖节流优化高频触发

js的防抖就是比如一个水龙头坏了一直在滴水,我们为了节约用水,那么我们会想办法让他不再滴的那么快,这就是防抖。常见的比如scroll,onresize这些高频触发的情况。

如何设置网站的robots.txt?

做过网站优化的朋友都知道,搜索引擎蜘蛛爬行抓取网站时首先会去访问根目录下的robots.txt文件,如果robots文件存在,则会根据robots文件内设置的规则进行爬行抓取,如果文件不存在则会顺着首页进行抓取,那么robots文件的工作原理是什么呢?

fly63.com版权所有,内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权,请与小编联系!情况属实本人将予以删除!

广告赞助文章投稿关于web前端网站点搜索站长推荐网站地图站长QQ:522607023

小程序专栏: 土味情话心理测试脑筋急转弯幽默笑话段子句子语录成语大全