META標籤
html標籤
通常所說的META標籤，是在HTML網頁源代碼中一個重要的html標籤。META標籤用來描述一個HTML網頁文檔的屬性，例如作者、日期和時間、網頁描述、關鍵詞、頁面刷新等。
META標籤是HTML標記HEAD區的一個關鍵標籤，它位於HTML文檔的和之間（有些也不是在<head>和<title>之間）。它提供的信息雖然用戶不可見，但卻是文檔的最基本的元信息。<meta>除了提供文檔字符集、使用語言、作者等基本信息外，還涉及對關鍵詞和網頁等級的設定。</div><div class="cp">所以有關搜索引擎註冊、搜索引擎優化排名等網路營銷方法內容中，通常都要談論META標籤的作用，我們甚至可以說，META標籤的內容設計對於搜索引擎營銷來說是至關重要的一個因素，合理利用 <a target="_blank" href="/wiki/vyrk7482kylg8y.html" title="Meta">Meta</a> 標籤的 Description 和Keywords 屬性，加入網站的關鍵字或者網頁的關鍵字，可使網站更加貼近用戶體驗。</div><div class="cp">從<a target="_blank" href="/wiki/qg2xlq5rmkqvz05.html" title="HTML">HTML</a>代碼實例中可以看到，一段代碼中有3個含有<a target="_blank" href="/wiki/vyrk7482kylg8y.html" title="meta">meta</a>的地方，並且meta並不是獨立存在的，而是要在後面連接其他的屬性，如description、Keywords、http-equiv等。下面簡單介紹一些搜索引擎營銷中常見的META標籤的組成及其作用。</div><div class="catlog-title is-1"><h3>組成</h3><a id="catalog_2" class="title-anchor"></a></div><hr class="border-1"><div class="cp">META標籤可分為兩大部分：HTTP-EQUIV和NAME變數。</div><div class="cp"><a target="_blank" href="/wiki/z4n5k42wllmegyl.html" title="HTTP">HTTP</a>實例</div><div class="cp">HTML代碼實例中有一項內容是</div><div class="cp"><meta http-equiv="Content-Type" content="text/html; charset=<a target="_blank" href="/wiki/0gy2jzy43404no7.html" title="gb2312">gb2312</a>"></div><div class="cp">其作用是指定了當前文檔所使用的<a target="_blank" href="/wiki/gv03mqggoqnl672.html" title="字元編碼">字元編碼</a>為gb2312，也就是中文簡體字元。根據這一行代碼，瀏覽器就可以識別出這個網頁應該用中文簡體字元顯示。類似地，如果將"gb2312"換為"big5"，就是我們熟知的中文繁體字元了。</div><div class="cp">HTTP使用方法</div><div class="cp">1、<meta http-equiv="Content-Type" content="text/html;<a target="_blank" href="/wiki/xex6o880q6jwl97.html" title="charset">charset</a>=gb_2312-80">和<meta http-equiv="Content-Language" content="zh-CN">用以說明主頁製作所使用的文字以及語言；又如英文是<a target="_blank" href="/wiki/zwoo0nl0gjjmo4w.html" title="ISO-8859-1">ISO-8859-1</a><a target="_blank" href="/wiki/xex6o880q6jwl97.html" title="字符集">字符集</a>，還有BIG5、<a target="_blank" href="/wiki/03r5lqlz3gn5v27.html" title="utf-8">utf-8</a>、shift-Jis、<a target="_blank" href="/wiki/vwek7nlxlxoj3wv.html" title="Euc">Euc</a>、Koi8-2等字符集；</div><div class="cp">2、<meta http-equiv="Refresh" content="n;url=http://yourlink">定時讓網頁在指定的時間n內，跳轉到你的頁面；</div><div class="cp">3、<meta http-equiv="Expires" content="Mon,12 May 2001 00:20:00 GMT">可以用於設定網頁的到期時間，一旦過期則必須到伺服器上重新調用。需要注意的是必須使用GMT時間格式；</div><div class="cp">4、<meta http-equiv="Pragma" content="no-cache">是用於設定禁止瀏覽器從本地機的緩存中調閱頁面內容，設定后一旦離開網頁就無法從<a target="_blank" href="/wiki/vy6elmr80gyqqr3.html" title="Cache">Cache</a>中再調出；</div><div class="cp">5、<meta http-equiv="set-cookie" content="Mon,12 May 2001 00:20:00 GMT"><a target="_blank" href="/wiki/36zkvll5g3rqe84.html" title="cookie">cookie</a>設定，如果網頁過期，存檔的cookie將被刪除。需要注意的也是必須使用GMT時間格式；</div><div class="cp">6、<meta http-equiv="Pics-label" content="">網頁等級評定，在<a target="_blank" href="/wiki/kknxy894em954r2.html" title="IE">IE</a>的internet選項中有一項內容設置，可以防止瀏覽一些受限制的網站，而網站的限制級別就是通過meta屬性來設置的；</div><div class="cp">7、<meta http-equiv="windows-Target" content="_top">強制頁面在當前窗口中以獨立頁面顯示，可以防止自己的網頁被別人當作一個<a target="_blank" href="/wiki/9526l9yv3q00wog.html" title="frame">frame</a>頁調用；</div><div class="cp">8、<meta http-equiv="<a target="_blank" href="/wiki/oye7jl40llv8l4l.html" title="Page">Page</a>-Enter" content="revealTrans（duration=10,transition= 50）">和<meta http-equiv="Page-Exit" content="revealTrans（duration=20，transition=6）">設定進入和離開頁面時的特殊效果，這個功能即<a target="_blank" href="/wiki/gwyqekwy4eqqm82.html" title="FrontPage">FrontPage</a>中的"格式/網頁過渡"，不過所加的頁面不能夠是一個frame頁面。</div><div class="cp">HTTP-EQUIV用於向瀏覽器提供一些說明信息，從而可以根據這些說明做出反應。HTTP-EQUIV其實並不僅僅只有說明網頁的字元編碼這一個作用，常用的HTTP-EQUIV類型還包括：網頁到期時間、默認的<a target="_blank" href="/wiki/xkjre6n0vyvqx0.html" title="腳本語言">腳本語言</a>、默認的風格頁語言、網頁自動刷新時間等。</div><div class="cp">description</div><div class="cp">HTML代碼實例中有關"description"的代碼為：</div><div class="cp"><meta name="description" content="<a target="_blank" href="/wiki/0vg5z0lr0qvw0xw.html" title="網路營銷">網路營銷</a>教學網站提供《網路營銷基礎與實踐》教學支持：網路營銷課件,網路營銷論文,網路營銷實驗教學，電子商務論文，網路營銷與電子商務書籍等"></div><div class="cp">"description"中的content="網頁描述"，是對一個網頁概況的介紹，這些信息可能會在搜索結果中出現，因此需要根據網頁的實際情況來設計，盡量避免與網頁內容不相關的“描述”，另外，最好對每個網頁有自己相應的描述（至少是同一個欄目的網頁有相應的描述），而不是整個網站都採用同樣的描述內容，因為一個網站有多個網頁，每個網頁的內容肯定是不同的，如果採用同樣的description，顯然會有一些網頁內容沒有直接關係，這樣不僅不利於<a target="_blank" href="/wiki/vzerxqn6ywek0zq.html" title="搜索引擎">搜索引擎</a>對網頁的排名，也不利於用戶根據搜索結果中的信息來判斷是否點擊進入網站獲取進一步的信息。</div><div class="catlog-title is-1"><h3>屬性</h3><a id="catalog_3" class="title-anchor"></a></div><hr class="border-1"><div class="cp">帶（#）的為 <a target="_blank" href="/wiki/xkgoj3y27w4yq5q.html" title="HTML5">HTML5</a> 中的新屬性。</div><div class="table-container"><table class="table is-bordered is-striped is-fullwidth"><tr><td>屬性</td><td>值</td><td>描述</td></tr><tr><td>charset（#）</td><td>character_set</td><td>定義文檔的字元編碼。</td></tr><tr><td>content</td><td>text</td><td>定義與 http-equiv 或 name 屬性相關的元信息。</td></tr><tr><td>http-equiv</td><td><div class="cp">content-typ</div><div class="cp">edefault-style</div><div class="cp">refresh</div></td><td>把 content 屬性關聯到 HTTP 頭部。</td></tr><tr><td>name</td><td><div class="cp">application-nam</div><div class="cp">eauthor</div><div class="cp">description</div><div class="cp">generator</div><div class="cp">keywords</div></td><td>把 content 屬性關聯到一個名稱。</td></tr><tr><td>scheme</td><td>format/URI</td><td>HTML5不支持。定義用於翻譯 content 屬性值的格式。</td></tr></table></div><div class="catlog-title is-1"><h3>描述設計</h3><a id="catalog_4" class="title-anchor"></a></div><hr class="border-1"><div class="cp">1網頁描述為<a target="_blank" href="/wiki/8x3n4rg7omz6mo.html" title="自然語言">自然語言</a>而不是羅列關鍵詞（與keywords設計正好相反）；</div><div class="cp">2儘可能準確地描述網頁的核心內容，通常為網頁內容的摘要信息，也就是希望搜索引擎在檢索結果中展示的摘要信息；</div><div class="cp">3網頁描述中含有有效關鍵詞；</div><div class="cp">4網頁描述內容與<a target="_blank" href="/wiki/kk2vknqn890r662.html" title="網頁標題">網頁標題</a>內容有高度相關性；</div><div class="cp">5<a target="_blank" href="/wiki/5nooxem00orwnqv.html" title="網頁">網頁</a>描述內容與網頁主體內容有高度相關性；</div><div class="cp">6網頁描述的文字不必太多，一般不超過搜索引擎檢索結果摘要信息的最多字數（通常在100中文字之內，不同搜索引擎略有差異）。</div><div class="cp">Keywords</div><div class="cp">與META標籤中的"description"類似，"Keywords"也是用來描述一個網頁的屬性，只不過要列出的內容是“關鍵詞”，而不是網頁的介紹。這就意味著，要根據網頁的主題和內容選擇合適的關鍵詞。在選擇關鍵詞時，除了要考慮與網頁核心內容相關之外，還應該是用戶易於通過搜索引擎檢索的，過於生僻的辭彙不太適合做META標籤中的關鍵詞。關於META標籤中關鍵詞的設計，要注意不要堆砌過多的關鍵詞，羅列大量關鍵詞對於搜索引擎檢索沒有太大的意義，對於一些熱門的領域（也就是說同類網站數量較多），甚至可能起到副作用。</div><div class="catlog-title is-1"><h3>錯誤</h3><a id="catalog_5" class="title-anchor"></a></div><hr class="border-1"><div class="cp">網頁設計中META標籤寫法的常見錯誤如下：</div><div class="cp">1、META標籤中沒有網頁描述和關鍵詞設計；</div><div class="cp">2、整個網站所有的網頁使用同樣的META標籤內容；</div><div class="cp">3、在<a target="_blank" href="/wiki/vyrk7482kylg8y.html" title="META">META</a>描述"description"中堆砌關鍵詞，而不是對網頁核心內容的自然語言描述；</div><div class="cp">4、META標籤中關鍵詞和描述的內容一樣，有些甚至和網頁標題一樣；</div><div class="cp">5、META標籤中網頁介紹信息與網站內容缺少相關性；</div><div class="cp">6、META標籤中的關鍵詞數量過多；</div><div class="cp">……</div><div class="catlog-title is-1"><h3>標籤</h3><a id="catalog_6" class="title-anchor"></a></div><hr class="border-1"><div class="cp">1、在<a target="_blank" href="/wiki/m8z94jomz69wkm7.html" title="zblog">zblog</a>模板網站的首頁default.html 添加description和keywords標籤</div><div class="cp">按照這個順序依次操作：打開後台首頁——文件管理——打開SHEMS文件——打開你的當前模板樣式的文件（此處一般有2個選擇，之一是default，如果你是用系統默認模板就點擊default，否則就點擊另一個）——打開<a target="_blank" href="/wiki/8xxo84jgn09wg45.html" title="TEMPLATE">TEMPLATE</a>文件——編輯default.html（默認首頁），操作路徑為：THEMES/axna/TEMPLATE/default.html ，其中的axna是我的博客模板樣式，因人而異，操作完這些之後在<head></head>裡面添加如下代碼：</div><div class="cp"><meta name="keywords" content="xx,xx,xx" /></div><div class="cp"><meta name="description" content="yyyyyyy" /></div><div class="cp">Keywords裡面的xx等就是你當前頁面的關鍵詞，這個非常重要，要準確定位，而且確定了就不要再隨意修改。可設置多個關鍵詞但不要過多，適當即可，也不要重置堆砌關鍵詞，這是對搜索引擎不友好的。關鍵詞之前最好用逗號隔開。而description裡面的yy等字樣就是指對當前頁面的描述，在首頁里就是要指明這個網站是什麼樣的網站，有什麼用或者是做什麼的，等等。這一部分是會在搜索結果的頁面當中出現的，因此還是舉足輕重的。</div><div class="cp">添加了代碼后就點擊提交，然後文件重建即可，返回你的首頁，查看源文件就能看到首頁已經成功添加了這兩個標籤。</div><div class="cp">2、在網站的內頁模板single.html 中添加meta標籤</div><div class="cp">同理，此處的操作路徑為：./THEMES/axna/TEMPLATE/single.html 依次打開至single.html頁面。這裡，先介紹一下網上有一部分人的一些做法，可能是有點小問題的。</div><div class="cp">在single.html中添加如下標籤：</div><div class="cp"><meta name="keywords" content="<#article/tagtoname#>" /></div><div class="cp"><meta name="description" content="<#article/intro#>" /></div><div class="cp">其中，#article/tagtoname# 是調用文章頁面的關鍵詞，我們在進行新建文章時，有一欄要填tags，關鍵詞就是從你所填寫的tags調用過來的， #article/intro# 是調用文章簡介，在新建文章的後台頁面里，可以點擊下面的自動生成摘要，當然了，摘要也可以自己填寫，簡介就是從你寫的摘要裡面完完全全調用過來的。</div><div class="cp">可是運用這樣的代碼方法在一些博客中是行不通的，在部分博客中文章的簡介就自動調到頁面的最頂部。可見這種方面要慎用。當然了，還有其它更加簡便的方法，比如我們可以在Z-Blog安裝一個名為NOBIRDAticleSEO的插件，之後就多出<#nobird/article/seo#>標籤，並自動添加到文章頁模板中作為頁面的Description，同時還自動添加了keywords和author信息。</div><div class="cp">3、同樣，也可以在catalog.html、tags.html、search..html中添加meta標籤</div><div class="cp">代碼如下<meta name=description content =<#ZC_BLOG_TITLE#><#ZC_MSG044#><#BlogTitle#>” /></div><div class="cp">這部分大家是可以自行進行增刪修改的，不一定要那些調用代碼，也可以輸入自己想要加的文字。</div><div style="clear: both"></div></div></div></div><div class="column is-narrow is-full-touch"><div class="sidebar"><div class="summary-albums"><a class="image" target="_blank" rel="noopener noreferrer nofollow" href="/album/konz0k8yjg0gel/pics.html"><img src="https://i1.twwiki.net/cover/w275/m3/0/m30fc2eacd389fc693ab48ba63f524278.jpg"></a></div><div class="info-box"><div class="catlog-title is-2"><h4>基本信息</h4></div><div><dl><dt>中文名</dt><dd><div><span>META標籤</span></div></dd></dl><dl><dt>外文名</dt><dd><div><span>META tag</span></div></dd></dl><dl><dt>位於</dt><dd><div><span>里，</span></div></dd></dl><dl><dt>描述</dt><dd><div><span>一個HTML網頁文檔的屬性</span></div></dd></dl><dl><dt>來源</dt><dd><div><span>html標籤</span></div></dd></dl></div></div></div></div></div><ul id="fixbar"><li class="gotop"><span class="icon is-large"><i class="iconf i-dingbu"></i></span></li><li class="dir"><span class="icon is-medium"><i class="iconf i-dir"></i></span><span class="bar-font">目錄</span></li></ul></div></div><footer class="py-5 footer"><div class="container has-text-centered"><a target="_blank" rel="nofollow" href="/site/privacy">隱私條款</a><span> | </span><a target="_blank" rel="nofollow" href="/site/contact">聯絡我們</a></div></footer><div class="modal" id="dir-modal"><div class="modal-background"></div><div class="modal-card"><header class="modal-card-head"><p class="modal-card-title">目錄</p><button class="delete" aria-label="close"></button></header><section class="modal-card-body"></section></div></div><script src="https://cdn.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script><script src="https://i1.twwiki.net/js/com.min.js?v=12"></script><script async src="https://www.googletagmanager.com/gtag/js?id=G-PQB6P4TLQ5"></script><script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-PQB6P4TLQ5');</script></body></html>