常用meta整理
2015-06-17 00:00
134 查看
摘要: meta标签提供关于HTML文档的元数据。元数据不会显示在页面上,但是对于机器是可读的。它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 web 服务。
---》》》》》主要介绍记录几个重要的点:
SEO 原则
搜索引擎提供网页的列表,每个网页都依据其与用户搜索查询的相关性进行排名。搜索引擎通常使用 Web 爬网程序(一种用于浏览万维网的自动化程序或任务)来发现网页和编制网页索引。Web 开发人员的一项重要任务是确保搜索引擎爬网程序能够找到网页中的信息并建立信息索引,以便搜索查询将用户引导至该网页。
与网站所有者为搜索引擎上的网站推广付款的搜索引擎营销 (SEM) 不同,SEO 基于搜索引擎用于进行网页排名的规则(一种通常称为“有机搜索”的过程)来提高网站的排名。已针对搜索引擎优化的网页采用可快速向搜索引擎提供相关信息的编码做法。
您可以显示 SEO 报告、选择 SEO 选项、筛选 SEO 报告中的结果,以及在 SEO 报告的结果列表中前后移动以查看个别列表项的更多详细信息。
页面描述,每个网页都应有一个不超过 150 个字符且能准确反映网页内容的描述标签。
搜索引擎索引方式,robotterms是一组使用逗号(,)分割的值,通常有如下几种取值:none,noindex,nofollow,all,index和follow。确保正确使用nofollow和noindex属性值
页面重定向和刷新:content内的数字代表时间(秒),既多少时间后刷新。如果加url,则会重定向到指定网页(搜索引擎能够自动检测,也很容易被引擎视作误导而受到惩罚)。
大部分4.7-5寸设备的viewport宽设为360px;5.5寸设备设为400px;iphone6设为375px;ipone6 plus设为414px。
WebApp全屏模式:伪装app,离线应用。
隐藏状态栏/设置状态栏颜色:只有在开启WebApp全屏模式时才生效。content的值为default | black | black-translucent 。
添加到主屏后的标题
忽略数字自动识别为电话号码
忽略识别邮箱
禁止浏览器从本地计算机的缓存中访问页面内容:这样设定,访问者将无法脱机浏览。
这个设定似乎起的作用不怎大,一般的做法都是在url地址后面添加时间戳的方式。对于手机上,或者说在做微信公众号开发的时候使用效果依旧没有那么明显,但是效果还是有的,也是推荐用这种方法进行不访问缓存设定。浏览器是否访问缓存看的是URL地址是否改变,如果没有改变那么首先会去缓存中寻找相应的资源,如果没有才会加载URL资源。加入时间戳以后,每个URL都是唯一的,这样保证了浏览器重新加载资源,而不访问缓存的。
添加智能 App 广告条 Smart App Banner:告诉浏览器这个网站对应的app,并在页面上显示下载banner(如下图)。
其他 参考文档
站点适配:主要用于PC-手机页的对应关系。
---》》》》》主要介绍记录几个重要的点:
SEO优化
搜索引擎优化
搜索引擎优化 (SEO) 是指可改善您的网站在搜索引擎(例如 Bing、Yahoo! 和 Google)中的排名的一系列技术。Microsoft Expression Web 4 包括一些工具,这些工具可帮助您改善您的网站的搜索引擎排名。SEO 原则
搜索引擎提供网页的列表,每个网页都依据其与用户搜索查询的相关性进行排名。搜索引擎通常使用 Web 爬网程序(一种用于浏览万维网的自动化程序或任务)来发现网页和编制网页索引。Web 开发人员的一项重要任务是确保搜索引擎爬网程序能够找到网页中的信息并建立信息索引,以便搜索查询将用户引导至该网页。
与网站所有者为搜索引擎上的网站推广付款的搜索引擎营销 (SEM) 不同,SEO 基于搜索引擎用于进行网页排名的规则(一种通常称为“有机搜索”的过程)来提高网站的排名。已针对搜索引擎优化的网页采用可快速向搜索引擎提供相关信息的编码做法。
SEO 检查器
Expression Web 的“SEO 检查器”功能可帮助您了解并应用搜索引擎排名最佳做法,以获得尽可能最高的搜索引擎排名。您可以显示 SEO 报告、选择 SEO 选项、筛选 SEO 报告中的结果,以及在 SEO 报告的结果列表中前后移动以查看个别列表项的更多详细信息。
<meta name="keywords" content="your tags" />
页面描述,每个网页都应有一个不超过 150 个字符且能准确反映网页内容的描述标签。
<meta name="description" content="150 words" />
搜索引擎索引方式,robotterms是一组使用逗号(,)分割的值,通常有如下几种取值:none,noindex,nofollow,all,index和follow。确保正确使用nofollow和noindex属性值
<meta name="robots" content="index,follow" /><!-- all:文件将被检索,且页面上的链接可以被查询; none:文件将不被检索,且页面上的链接不可以被查询; index:文件将被检索; follow:页面上的链接可以被查询; noindex:文件将不被检索; nofollow:页面上的链接不可以被查询。 -->
页面重定向和刷新:content内的数字代表时间(秒),既多少时间后刷新。如果加url,则会重定向到指定网页(搜索引擎能够自动检测,也很容易被引擎视作误导而受到惩罚)。
<meta http-equiv="refresh" content="0;url=" />
移动设备
viewport:能优化移动浏览器的显示。如果不是响应式网站,不要使用initial-scale或者禁用缩放。大部分4.7-5寸设备的viewport宽设为360px;5.5寸设备设为400px;iphone6设为375px;ipone6 plus设为414px。
<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no"/><!-- `width=device-width` 会导致 iPhone 5 添加到主屏后以 WebApp 全屏模式打开页面时出现黑边 -->
WebApp全屏模式:伪装app,离线应用。
<meta name="apple-mobile-web-app-capable" content="yes" /> <!-- 启用 WebApp 全屏模式 -->
隐藏状态栏/设置状态栏颜色:只有在开启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" />
禁止浏览器从本地计算机的缓存中访问页面内容:这样设定,访问者将无法脱机浏览。
<meta http-equiv="Pragma" content="no-cache">
这个设定似乎起的作用不怎大,一般的做法都是在url地址后面添加时间戳的方式。对于手机上,或者说在做微信公众号开发的时候使用效果依旧没有那么明显,但是效果还是有的,也是推荐用这种方法进行不访问缓存设定。浏览器是否访问缓存看的是URL地址是否改变,如果没有改变那么首先会去缓存中寻找相应的资源,如果没有才会加载URL资源。加入时间戳以后,每个URL都是唯一的,这样保证了浏览器重新加载资源,而不访问缓存的。
添加智能 App 广告条 Smart App Banner:告诉浏览器这个网站对应的app,并在页面上显示下载banner(如下图)。
其他 参考文档
<!-- 针对手持设备优化,主要是针对一些老的不识别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">
站点适配:主要用于PC-手机页的对应关系。
<meta name="mobile-agent"content="format=[wml|xhtml|html5]; url=url"><!-- [wml|xhtml|html5]根据手机页的协议语言,选择其中一种; url="url" 后者代表当前PC页所对应的手机页URL,两者必须是一一对应关系。 -->
相关文章推荐
- MyEclipse中启动tomcat自动跳转到debug界面
- 瀚蓝环境股份有限公司之文档项目管理
- CXF Restful 返回xml
- 在 OS X 终端中用 passwd 命令快速修改登录密码
- TurboMail防黑客入侵邮件系统骗取货款
- 基于ZigBee和ARM的智能家居控制系统
- (北京)Android软件测试工程师/手机/TV/机顶盒/路由器/
- 沃颜是什么
- Android 向右滑动销毁(finish)Activity, 随着手势的滑动而滑动的效果
- Java NIO原理 图文分析及代码实现
- Java NIO 系列教程
- iOS 数据库FMDN 数据库的增 删 改 查 的 的基本操作
- BocK的使用
- stroryboard利用Segue实现界面传值
- UILocalNotification 本地通知的应用实例
- NSlog在release模式下屏蔽log信息
- 键盘弹出和消失View的上下移动效果
- blick的使用
- tableView总结
- jquary