html 的meta标签对网页渲染及SEO搜索引擎起着不可忽视的作用。详细的写法一段时间不写，容易忘，所以整理了一下，方便需要时查看。

<!DOCTYPE html> <!-- 使用 HTML5 doctype，不区分大小写 -->

<html lang="zh-cmn-Hans"> <!-- 标准的 lang 属性写法 中文-国语-简体 -->

<head>

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

    <meta charset='utf-8'>

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

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

    <!-- 双核浏览器优先使用极速模式(webkit)，如360 -->

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

    <!-- 页面描述 利于SEO -->

    <meta name="description" content="不超过150个字符"/>

    <!-- 页面关键词 利于SEO -->

    <meta name="keywords" content="最好保持在10个以下"/>

    <!-- 搜索引擎索引此网页,继续通过此网页的链接索引搜索其它的网页 -->

    <meta name="robots" content="index,follow"/>

    <!-- 网页作者 -->

    <meta name="author" content="name, email@gmail.com"/> 

    <!-- 为移动设备添加 viewport --> <!-- `width=device-width` 会导致 iPhone 5 添加到主屏后以 WebApp 全屏模式打开页面时出现黑边 http://bigc.at/ios-webapp-viewport-meta.orz -->

    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> 

    <!-- 禁止百度转码 -->

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

    <!-- 已失效 -->

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

    <!-- 搜索百度是否支持移动网页 -->

    <meta name="applicable-device" content="pc,mobile">

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

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

    <!-- iOS 设备 begin -->

    <!-- 添加到主屏后的标题（iOS 6 新增） -->

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

    <!-- 是否启用 WebApp 全屏模式，删除苹果默认的工具栏和菜单栏 -->

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

    <!-- 添加智能 App 广告条 Smart App Banner（iOS 6+ Safari） -->

    <meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">

    <!-- 设置苹果工具栏颜色 -->

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

    <!-- 忽略页面中的数字识别为电话，忽略email识别 -->

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

    <!-- 针对手持设备优化，主要是针对一些老的不识别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">

    <!-- iOS 图标 begin -->

    <!-- iPhone 和 iTouch，默认 57x57 像素，必须有 -->

    <link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-57x57-precomposed.png"/>

    <!-- Retina iPhone 和 Retina iTouch，114x114 像素，可以没有，但推荐有 -->

    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="/apple-touch-icon-114x114-precomposed.png"/>

    <!-- Retina iPad，144x144 像素，可以没有，但推荐有 -->

    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="/apple-touch-icon-144x144-precomposed.png"/>

    <!-- iOS 图标 end --> <!-- iOS 启动画面 begin --> <!-- iPad 竖屏 768 x 1004（标准分辨率） -->

    <link rel="apple-touch-startup-image" sizes="768x1004" href="/splash-screen-768x1004.png"/>

    <!-- iPad 竖屏 1536x2008（Retina） -->

    <link rel="apple-touch-startup-image" sizes="1536x2008" href="/splash-screen-1536x2008.png"/>

    <!-- iPad 横屏 1024x748（标准分辨率） -->

    <link rel="apple-touch-startup-image" sizes="1024x748" href="/Default-Portrait-1024x748.png"/>

    <!-- iPad 横屏 2048x1496（Retina） -->

    <link rel="apple-touch-startup-image" sizes="2048x1496" href="/splash-screen-2048x1496.png"/>

    <!-- iPhone/iPod Touch 竖屏 320x480 (标准分辨率) -->

    <link rel="apple-touch-startup-image" href="/splash-screen-320x480.png"/>

    <!-- iPhone/iPod Touch 竖屏 640x960 (Retina) -->

    <link rel="apple-touch-startup-image" sizes="640x960" href="/splash-screen-640x960.png"/>

    <!-- iPhone 5/iPod Touch 5 竖屏 640x1136 (Retina) -->

    <link rel="apple-touch-startup-image" sizes="640x1136" href="/splash-screen-640x1136.png"/>

    <!-- iOS 启动画面 end -->

    <!-- iOS 设备 end --> 

    <!-- Windows 8 磁贴颜色 -->

    <meta name="msapplication-TileColor" content="#000"/>

    <!-- Windows 8 磁贴图标 -->

    <meta name="msapplication-TileImage" content="icon.png"/>

    <!-- 添加 RSS 订阅 -->

    <link rel="alternate" type="application/rss+xml" title="RSS" href="/rss.xml"/>

    <!-- 添加 favicon icon -->

    <link rel="shortcut icon" type="image/ico" href="/favicon.ico"/> 

    <title>标题</title>

  </head>

</html>

Html 常见meta的更多相关文章

  1. 常见meta标签记录

    关于meta <meta> 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词. <meta> 标签位于文档的头部,不包含 ...

  2. html的常见meta标签信息

    设置页面不缓存<meta http-equiv="pragma" content="no-cache"><meta http-equiv=&q ...

  3. [HTML知识体系]meta标签的常见用法

    1.meta是什么 元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词. 标签位于文档的头部,不包含任何内容. 标签的属性定义了与文档相关联的名称 ...

  4. 即将是史上最全的meta大全

    本文的目的是搜集当前主流的meta配置,方便开发者快速开发调试.在这里不会做各种meta的深入分析,只是简单的介绍,让大家知道有这个东西. meta简述 meta用于描述 HTML 文档的元数据.通常 ...

  5. Linux--正则表达式--详解

    一.linux文本查找命令 在说linux正规表达式之前,还介绍下linux中查找文本文件常用的三个命令: 1.grep : 最早的文本匹配程序,使用POSIX定义的基本正则表达式(BRE)来匹配文本 ...

  6. CSV 客座文章系列：KGroup 通过 Windows Azure 将 Qoob 内容管理发布到云中

    编辑人员注释: 今天这篇文章由 KGroup 首席软件架构师兼研发部主管 Jody Donetti 与 KGroup 技术总监 Simone Procopio 共同撰写,介绍了 KGroup 如何使用 ...

  7. [转]Linux 正则表达式详解

    转自:http://www.jb51.net/article/42989.htm 一.linux文本查找命令 在说linux正规表达式之前,还介绍下linux中查找文本文件常用的三个命令: 1.gre ...

  8. R语言与医学统计图形-【33】生存曲线、森林图、曼哈顿图

    1.生存曲线 基础包survival+扩展包survminer. survival包内置肺癌数据集lung. library(survival) library(survminer) str(lung ...

  9. 前端三部曲之Html -- 1（html的基本结构和常见的meta标签的作用）

    一个H5页面的基本结构是什么 我么在编辑器中输入html:5可以得到 <!DOCTYPE html> <!-- 声明文档类型 --> <html lang="e ...

随机推荐

  1. Java的GUI设计小技巧

    不可关闭窗口 setDefaultCloseOperation(DO_NOTHING_ON_CLOSE);

  2. oracle count 大表

    刚从生产环境导了一个大表到测试环境,迫不及待的要好好玩弄一下. 1.coun(1) ) from table_name; 条数: 567979280 时间:4:47 2.count 索引字段 sele ...

  3. 2019.01.09 bzoj3697: 采药人的路径（点分治）

    传送门 点分治好题. 题意:给出一棵树,边分两种,求满足由两条两种边数相等的路径拼成的路径数. 思路: 考虑将边的种类转化成边权−1-1−1和111,这样就只用考虑由两条权值为000的路径拼成的路径数 ...

  4. 微信小程序请求数据

    微信小程序请求数据,在页面展示,可以在onLoad生命周期中进行请求. 1.新建目录http,新建文件http.js 2.在js文件中暴露需要使用的变量 var baseUrl = 'http://1 ...

  5. 创建Java程序并设置快捷提示

    1.new Java project 创建项目 2.new package 创建包,cn.com.test 3.创建Java文件 4.Java智能提示的设置 window/preference 在Au ...

  6. ES6展开运算符的3个用法

    展开运算符的用法1:传参 // 展开运算符的用法1 : 传参 function test(a,b) { return a + b ; } var arr = [1,2]; console.log(te ...

  7. dj 模型层orm-1

    ORM简介 MVC或者MVC框架中包括一个重要的部分,就是ORM,它实现了数据模型与数据库的解耦,即数据模型的设计不需要依赖于特定的数据库,通过简单的配置就可以轻松更换数据库,这极大的减轻了开发人员的 ...

  8. Gym 100096D Guessing game

    Gym 100096D Guessing game 题面 Problem Description Byteman is playing a following game with Bitman. Bi ...

  9. 属性动画和Activity、Fragment过渡动画等

    主题是关于动画的,但是不是什么动画的内容都包括.先泛泛的介绍一下,然后详细的介绍一下翻代码找见的一个好玩的动画的使用.以下的内容包括Android 3和Android 3.1等引入的API,在使用中请 ...

  10. 回文（palindrome）

    如果一个字符串忽略标点符号.大小写和空格,正着读和反着读一模一样,那么这个字符串就是palindrome(回文).