WebApp 里Meta标签大全，webappmeta标签大全

1.先说说mate标签里的viewport：

viewport便可视区域，对于桌面浏览器而言，viewport指的就是除去全部工具栏、状态栏、滚动条等等以后用于看网页的区域。

对于传统WEB页面来讲，980的宽度在iphone上显示是很正常的，也是满屏的，但对于webapp而言，可能就有点问题了，在iphone上咱们的webapp在竖屏下一般宽度都是320。

所以咱们必须改变viewport，咱们就有以下几种属性值能够设置： width: viewport 的宽度 （范围从 200 到 10,000 ，默认为 980 像素 ） height: viewport 的高度 （范围从 223 到 10,000 ）

initial-scale: 初始的缩放比例 （范围从>0到 10 ） minimum-scale: 容许用户缩放到的最小比例 maximum-scale: 容许用户缩放到的最大比例 user-scalable: 用户是否能够手动缩放 对于这些属性，

咱们能够设置其中的一个或者多个，并不须要你同时都设置，iPhone 会根据你设置的属性自动推算其余属性值 ，而非直接采用默认值。

若是你把initial-scale=1 ，那么 width 和 height在竖屏时自动为320*356 （不是320*480 由于地址栏等都占据空间 ），横屏时自动为 480*208。相似地 ，

若是你仅仅设置了 width ，就会自动推算出initial-scale 以及height。

例如你设置了 width=320 ，竖屏时 initial-scale 就是 1 ，横屏时则变成 1.5 了 那么到底这些设置如何让 Safari 知道 ？其实很简单 ，就一个 meta ，

形如 ： 设置了meat后咱们页面将如此呈现了 2.meta标签里的name属性 name 属性

(1)、＜meta name="Generator" contect=""＞用以说明生成工具（如Microsoft FrontPage 4.0）等；

(2)、＜meta name="keywords" contect=""＞向搜索引擎说明你的网页的关键词；

(3)、＜meta name="Description" contect=""＞告诉搜索引擎你的站点的主要内容；

(4)、＜meta name="Author" contect="你的姓名"＞告诉搜索引擎你的站点的制做的做者；

(5)、＜meta name="Robots" contect="all | none | index | noindex | follow | nofollow"＞ 其中的属性说明以下：

设定为all：文件将被检索，且页面上的连接能够被查询； 设定为none：文件将不被检索，且页面上的连接不能够被查询；

设定为index：文件将被检索； 设定为follow：页面上的连接能够被查询；

设定为noindex：文件将不被检索，但页面上的连接能够被查询；

设定为nofollow：文件将不被检索，页面上的连接能够被查询 3.webapp里主要的mate用途 添加到主屏幕后，全屏显示。

这meta的做用就是删除默认的苹果工具栏和菜单栏。content有两个值”yes”和”no”,当咱们须要显示工具栏和菜单栏时，这个行meta就不用加了，默认就是显示。

默认值为default（白色），能够定为black（黑色）和black-translucent（灰色半透明）。

注意： 若值为“black-translucent”将会占据页面px位置，浮在页面上方（会覆盖页面20px高度–iphone4和itouch4的Retina屏幕为40px）。

在iOS中有两个meta值，apple-mobile-web-app-capable和apple-mobile-web-app-status-bar-style，这两个会让网页内容以应用程序风格显示，并使状态栏透明。

说明： 这个link就是设置web app的放置主屏幕上icon文件路径。

图片尺寸能够设定为57*57（px）或者Retina能够定为114*114（px），ipad尺寸为72*72（px） //将不识别邮箱 告诉设备忽略将页面中的数字识别为电话号码 iOS用rel="apple-touch-icon",android 用rel="apple-touch-icon-precomposed"。

这样就能在用户把网页存为书签时，在手机HOME界面建立应用程序样式的图标。

微信分享页面设置 html标签里面的标签的做用 元素可提供有关页面的元信息（meta-information）例如做者、日期和时间、网页描述、关键词、页面刷新等.并非专门给搜索引擎而设的。

但其中的keyword 和 description 是搜索引擎来找到网页的一个方式。 html的meta标签、title 标签、Description标签、keyword 标签是什概念？

若是应用这些标签？ ?“”（即一般所说的META标签）。META标签用来描述一个HTML网页文档的属性，例如做者、日期和时间、网页描述、关键词、页面刷新等。

??在有关搜索引擎注册、搜索引擎优化排名等网络营销方法内容中，一般都要谈论META标签的做用，咱们甚至能够说，META标签的内容设计对于搜索引擎营销来讲是相当重要的一个因素，尤为是其中的 “description”（网页描述）和“Keywords”（关键词）两个属性更为重要【参见网络营销教学网站的专文介绍：description Keywords 】。

尽管如今的搜索引擎检索信息的决定搜索结果的排名不多依赖META标签中的内容，但META标签的内容设计仍然是很重要的。 关于META标签中的HTTP-EQUIV ?? HTML代码实例中有一项内容是 ??

??其做用是指定了当前文档所使用的字符编码为gb2312，也就是中文简体字符。根据这一行代码，浏览器就能够识别出这个网页应该用中文简体字符显示。相似地，若是 将 “gb2312”替换为“big5”，就是咱们熟知的中文繁体字符了。

??HTTP-EQUIV用于向浏览器提供一些说明信息，从而能够根据这些说明作出相应。HTTP-EQUIV其实并不单单只有说明网页的字符编码这一个做用，经常使用的HTTP-EQUIV类型还包括：网页到期时间、默认的脚本语言、默认的风格页语言、网页自动刷新时间等。 关于META标签中的"description" ?? HTML代码实例中有关"description"中的代码为： ??

??"description"中的content="网页描述"，是对一个网页概况的介绍，这些信息可能会出如今搜索结果中，所以须要根据网页的实际状况来设计，尽可能避免与网页内容不相关的“描述”，

另外，最好对每一个网页有本身相应的描述（至少是同一个栏目的网页有相应的描述），而不是整个网站都采用一样的描述内容，

由于一个网站有多个网页，每一个网页的内容确定是不一样的，若是采用一样的description，显然会有一些网页内容没有直接关系，这样不只不利于搜索引擎对网页的排名，也不利于用户根据搜索结果中的信息来判断是否点击进入网站获取进一步的信息。