meta

時間  2019-11-17
標籤 meta 欄目 HTML5 简体版
原文   原文鏈接

meta標籤提供關於HTML文檔的元數據。元數據不會顯示在頁面上，可是對於機器是可讀的。它可用於瀏覽器（如何顯示內容或從新加載頁面），搜索引擎（關鍵詞），或其餘 web 服務。html

 

SEO優化

  • 頁面關鍵詞，每一個網頁應具備描述該網頁內容的一組惟一的關鍵字。
    使用人們可能會搜索，並準確描述網頁上所提供信息的描述性和表明性關鍵字及短語。標記內容過短，則搜索引擎可能不會認爲這些內容相關。另外標記不該超過 874 個字符。
　　<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=" />

  • 其餘
　　<meta name="author" content="author name" /> <!-- 定義網頁做者 --> 　　<meta name="google" content="index,follow" /> 　　<meta name="googlebot" content="index,follow" /> 　　<meta name="verify" content="index,follow" />

移動設備

    • viewport：能優化移動瀏覽器的顯示。若是不是響應式網站，不要使用initial-scale或者禁用縮放。
      大部分4.7-5寸設備的viewport寬設爲360px；5.5寸設備設爲400px；iphone6設爲375px；ipone6 plus設爲414px。
  1. width：寬度（數值 / device-width）（範圍從200 到10,000，默認爲980 像素）
  2. height：高度（數值 / device-height）（範圍從223 到10,000）
  3. initial-scale：初始的縮放比例 （範圍從>0 到10）
  4. minimum-scale：容許用戶縮放到的最小比例
  5. maximum-scale：容許用戶縮放到的最大比例
  6. user-scalable：用戶是否能夠手動縮 (no,yes)
  7. minimal-ui：能夠在頁面加載時最小化上下狀態欄。（已棄用）

 

 

  • 忽略識別郵箱
<meta content="email=no" name="format-detection" />

  • 忽略數字自動識別爲電話號碼
 <meta content="telephone=no" name="format-detection" />



IOS設備對meta定義的私有屬性：

  
這meta的做用就是刪除默認的蘋果工具欄和菜單欄。
content有兩個值」yes」和」no」,當咱們須要顯示工具欄和菜單欄時，這個行meta就不用加了，默認就是顯示。<metaname="apple-touch-fullscreen"content="yes">

   蘋果設備狀態欄樣式

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

　　

   默認值爲default（白色），windows

  能夠定爲black（黑色）,瀏覽器

  black-translucent（灰色半透明）。緩存

 

   注意：若值爲"black-translucent"將會佔據頁面px位置，浮在頁面上方（會覆蓋頁面20px高度–iphone4和itouch4的Retina屏幕爲40px）。服務器

　　

 



APP 其它一些meta屬性
<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">




關鍵字: meta,標籤,HTML,XHTMLapp

meta主要爲分HTTP標頭信息(HTTP-EQUIV)和頁面描述信息(NAME)。標頭信息包括文檔類型、字符集、語言等瀏覽器正確顯示網頁的信息及處理動做；網頁描述如內容的關鍵字、摘要、做者和定義robots行爲等，爲搜索引擎索引提供信息。框架

meta標籤在head中定義，主要參數以下
http-equiv:將content屬性鏈接到一個http頭部字段，做爲http頭部的成分傳遞
name:將content屬性與一個名字鏈接，當請求此名字的數據時，將發送content屬性的值
content:根據http-equiv或name的不一樣屬性值提供相應的值
lang:指定此meta標記的語言

<meta http-equiv="Content-Type" Content="text/html; Charset=utf-8" />
說明網頁類型和字符編碼信息，W3C建議使用並放在head區的最上面。這是隨http頭部發送屬性值（固然如今的服務器通常不發送）或者由客戶端讀取。儘管在XHTML標準文檔聲明部分包含了這些內容，但W3C也建議在meta中設置，以更好的兼容一些 瀏覽器和搜索引擎。
<meta http-equiv="Content-Language" Content="zh-CN" />
說明文檔的國字語言代碼。在XHTML中，能夠在<html>的xml:lang和lang屬性中設置，所以能夠不使用.
<meta http-equiv="Refresh" Content="15; Url=http://www.cnblogs.com/tonywang711/" />
網頁15秒後自動轉向到url網址。謹慎使用跳轉，不然可能會被搜索引擎認爲做弊，不利於網站優化。若是使用meta跳轉，時間最好大於10秒。
<meta http-equiv="Expires" Content="Wed, 26 Feb 1997 08:21:57 GMT" />
指定網頁在緩存中的過時時間。注意：必須使用GMT的時間格式或直接設爲0
<meta http-equiv="Pragma" Content="No-cach" />
禁止瀏覽器從本地機的緩存中調閱頁面內容
<meta http-equiv="Widow-target" Content="_top" />
強制頁面在當前窗口以獨立頁面顯示，來防止別人在框架裏調用你的頁面。Content選項：_blank、_top、_self、_parent

以上是http-equiv標頭信息，爲用戶代理提供文檔信息或定義瀏覽器動做，下面name主要爲搜索引擎提供內容描述信息和robots定義，對搜索引擎優化起必定做用。

<meta name="Keywords" Content="word1,word2..." />
描述此文檔內容的關鍵詞，宜選用稍冷的組合詞，六組左右;SE對keyword比較敏感，做用不是很大，若是堆積關鍵詞或名不符實，則可能會被搜索引擎懲罰，因此寧缺勿濫。
<meta name="Kyewords" Lang="en" Content="vacation,greece,sunshine" />
<meta name="Kyewords" Lang="FR" Content="vacances,grè:ce,soleil" />
當數個META元素提供文檔語言信息時，搜索引擎會使用lang特性來過濾並經過用戶的語言優先參照來顯示搜索結果。
<meta name="Description" Content="網頁信息的描述" />
描述網頁的主要內容，有利於搜索引擎和用戶瞭解網頁摘要。因SE不一樣，以100字左右爲宜。摘要需對不一樣頁面給予不一樣的描述，明確包含標記性事實。
<meta name="Robots"Content="All|None|Index|Noindex|Follow|Nofollow" />
許多搜索引擎都經過放出robot/spider搜索來登陸網站，這些robot/spider就要用到meta元素的一些特性來決定怎樣登陸，固然有的SE不支持這個屬性。Robots用來告訴搜索機器人哪些頁面須要索引，是否跟蹤連接。Content的參數有all、none、index、 noindex、follow、nofollow。默認是all。
all：文件將被檢索，且頁面上的連接能夠被查詢；
none：文件將不被檢索，且頁面上的連接不能夠被查詢；(和 "noindex, nofollow" 起相同做用)
index：文件將被檢索；（讓robot/spider登陸）
follow：頁面上的連接能夠被查詢；
noindex：文件將不被檢索，但頁面上的連接能夠被查詢；(不讓robot/spider登陸)
nofollow：文件將不被檢索，頁面上的連接能夠被查詢。(不讓robot/spider順着此頁的鏈接往下抓取)
meta robots能夠逐頁控制對網站的訪問，還可在robots.txt文件中聲明URL，控制spider對它們的抓取。
<meta name="revisit-after" CONTENT="7 days" />
重訪時間。有時頁面不是常常更新或減輕服務器的負擔，能夠設置一個搜索引擎機器人下次重訪的時間，固然若是時間太短，SE bot並不會按這個時間準時重訪，它只會在大於這個時間訪問。
<meta name="Author" Content="xx" /> 標註網頁的做者或製做組,能夠是名字,或Email <meta name="Copyright" Content="本頁版權歸XXXX全部。All Rights Reserved" /> <meta name="Generator" Content="PCDATA|FrontPage" /> 說明你所用編輯器( 說明這個作什麼用？ ) meta 標籤經常使用的屬性就這麼多，一個頁面最好有的如Content-Type，Keywords，Description，其它根據須要經常使用的有Robots,Refresh，Widow-target。
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程