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. JSON文件导入Unity3d中是空的的问题

    将Json文件的内容在网上在线的Json文件编辑器导出后再导入即可

  2. tms web core 与 kbmmw 第一次亲密接触

    最近,tms 经过1年多,集合了数十名高手大牛,开发出了一个跨时代的产品,就是tms web core. 具体的介绍详见官网,https://www.tmssoftware.com/site/tmsw ...

  3. thymeleaf使用基础教程

    thymeleaf 是新一代的模板引擎,在spring4.0中推荐使用thymeleaf来做前端模版引擎. thymeleaf介绍 简单说, Thymeleaf 是一个跟 Velocity.FreeM ...

  4. ThinkPHP getBy动态查询

    getBy动态查询 ThinkPHP getBy动态查询是一个魔术方法,可以根据某个字段名称动态得到对应的一条数据记录. 根据用户名(username)查询对应的用户资料记录: public func ...

  5. Nodejs 传图片的两种方式

    node上传图片第一种方式 1,首先引入模块 "connect-multiparty": "~1.2.5", 在package.json中添加 "co ...

  6. 安卓开机logo和开机动画的几种实现方法

    安卓4.2可用方法2-4,第一种方法未验证. 从理论上来说,android 有4个开机启动画面. 第一个应该是U-BOOT的启动画面,有些设备为了满足按动电源即有显示,在UBOOT里加了开机画面,实现 ...

  7. ASP.NET 压缩输出的HTML字符

    重写Render using System; using System.Collections.Generic; using System.Text; using System.Web.UI; usi ...

  8. C#时间操作总结

    命名空间:System.Diagnostics Stopwatch 实例可以测量一个时间间隔的运行时间,也可以测量多个时间间隔的总运行时间.在典型的 Stopwatch 方案中,先调用 Start 方 ...

  9. PHP与Python哪个做网站产品好？

    虽然python现在比较火,但在传统的LAMP组合里Linux+apache/tomcat+MySql+PHP里是PHP做网站的脚本语言,但现在已经变了:https://baike.baidu.com ...

  10. 5、Makefile基础知识汇总（转自陈皓总述）

    一.Makefile里有什么? Makefile里主要包含了五个东西:显式规则.隐晦规则.变量定义.文件指示和注释. 1.显式规则.显式规则说明了,如何生成一个或多的的目标文件.这是由Makefile ...