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，顯然會有一些網頁內容沒有直接關係，這樣不只不利於搜索引擎對網頁的排名，也不利於用戶根據搜索結果中的信息來判斷是否點擊進入網站獲取進一步的信息。