html之meta標籤

時間 2019-11-08

標籤 html meta 標籤欄目 HTML 简体版

原文原文鏈接

百度百科對於meta的描述：META標籤是HTML標記HEAD區的一個關鍵標籤，它位於HTML文檔的<head>和<title>之間（有些也不是在<head>和<title>之間）。它提供的信息雖然用戶不可見，但倒是文檔的最基本的元信息。<meta>除了提供文檔字符集、使用語言、做者等基本信息外，還涉及對關鍵詞和網頁等級的設定。因此有關搜索引擎註冊、搜索引擎優化排名等網絡營銷方法內容中，一般都要談論META標籤的做用，咱們甚至能夠說，META標籤的內容設計對於搜索引擎營銷來講是相當重要的一個因素，合理利用 Meta 標籤的 Description 和Keywords 屬性，加入網站的關鍵字或者網頁的關鍵字，可以使網站更加貼近用戶體驗。html

我對上面對meta標籤的描述的理解是：meta標籤表達的是整個html文檔的描述信息，html中的meta標籤影響搜索引擎註冊和搜索引擎優化web

<meta>的屬性chrome

meta標籤有3個屬性：name、http-equiv、content。每一個name或http-equiv都對應一個content。更確切的說，name或http-equiv的值表示屬性，content的值爲name或http-equiv的值所表示屬性的值瀏覽器

例如百度百科meta詞條的網頁的meta緩存

<meta name="description" content="一般所說的META標籤，是在HTML網頁源代碼中一個重要的html標籤。META標籤用來描述一個HTML網頁文檔的屬性，例如做者、日期和時間、網頁描述、關鍵詞、頁面刷新等。...">
複製代碼

name：主要用於描述網頁，好比網頁的關鍵詞，敘述等。與之對應的屬性值爲content，content中的內容是對name填入類型的具體描述，便於搜索引擎抓取。服務器

name屬性的取值cookie

value	intro
keywords	告訴搜索引擎網頁的關鍵字
description	告訴搜索引擎網站的主要內容
viewport	經常使用於設計移動端網頁
robots	定義搜索引擎爬蟲的索引方式
author	標註網頁做者
generator	標明網頁採用什麼軟件製做的
copyright	標註版權信息
revisit-after	搜索引擎爬蟲重訪時間
renderer	雙核瀏覽器渲染方式

robots對應content的取值網絡

value	intro
none	搜索引擎將忽略此網頁，等價於noindex，nofollow
noindex	搜索引擎不索引此網頁
nofollow	搜索引擎不繼續經過此網頁的連接索引搜索其它的網頁。
all	搜索引擎將索引此網頁與繼續經過此網頁的連接索引，等價於index，follow。
index	搜索引擎索引此網頁。
follow	搜索引擎繼續經過此網頁的連接索引搜索其它的網頁

renderer屬性是爲雙核瀏覽器準備的，用於指定雙核瀏覽器默認以何種方式渲染頁面。app

例如360瀏覽器優化

<meta name="renderer" content="webkit"> //默認webkit內核
<meta name="renderer" content="ie-comp"> //默認IE兼容模式
<meta name="renderer" content="ie-stand"> //默認IE標準模式
複製代碼

http-equiv屬性 ：至關於http的文件頭做用。

value	intro
content-Type	設定網頁字符集
X-UA-Compatible	瀏覽器採起何種版本渲染當前頁面
cache-control	指定請求和響應遵循的緩存機制
expires	網頁到期時間
refresh	網頁將在設定的時間內, 自動刷新並調向設定的網址
Set-Cookie	cookie設定

具體實例

X-UA-Compatitle

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> //指定IE和Chrome使用最新版本渲染當前頁面
複製代碼

cache-control的做用有兩個

做用1：設置緩存策略

<meta http-equiv="cache-control" content="no-cache">
複製代碼

cache-control對應content的取值

value	intro
no-cache	先發送請求，與服務器確認該資源是否被更改，若是未被更改，則使用緩存。
no-store	不容許緩存，每次都要去服務器上，下載完整的響應
public	緩存全部響應，但並不是必須。由於max-age也能夠作到相同效果
private	只爲單個用戶緩存，不容許任何中繼進行緩存
max-age	表示當前請求開始，該響應在多久內能被緩存和重用，而不去服務器從新請求

做用2：禁止當前頁面在移動端瀏覽時，被百度自動轉碼

<meta http-equiv="Cache-Control" content="no-siteapp" />
複製代碼

expires

<meta http-equiv="expires" content="Sunday 26 October 2016 01:00 GMT" />
複製代碼

refresh

<meta http-equiv="refresh" content="2; URL=http://www.baidu.com"> //表示2秒後跳轉向百度
複製代碼

Set-Cookie 若是網頁過時。那麼這個網頁存在本地的cookies也會被自動刪除。對應content取值的格式

<meta http-equiv="Set-Cookie" content="name, date"> 
複製代碼

例如

<meta http-equiv="Set-Cookie" content="User=Lxxyx; path=/; expires=Sunday, 10-Jan-16 10:00:00 GMT">
複製代碼

相關標籤/搜索

HTML標籤