HTML メタタグの使用の概要 (推奨)

メタタグ機能

METAタグは、HTMLタグのHEAD領域にある重要なタグです。文書の文字セット、使用言語、作成者などの基本情報のほか、キーワードやページランキングの設定などを提供します。最大の機能は、検索エンジン最適化（SEO）を行うことです。

PS: 検索エンジンロボットが検索して分類しやすくするために、インターネットアプリケーションではこの点に注意する必要があります。

大規模なウェブサイトはどのように書かれていますか?

このタグについて知る前に、私はさまざまな主流の Web サイトのメタ設定を次のように調べました。

JD.com ホームページのメタ設定:

XML/HTML コードコンテンツをクリップボードにコピー

<メタ文字セット= "gbk" >
<メタ名前= "説明" content = "JD.COM - 家電製品、デジタル通信、コンピューター、家庭用家具、衣類やアクセサリー、マタニティ用品やベビー用品、書籍、食品など、数万点のブランド品の高品質商品を販売する、プロフェッショナルな総合オンラインショッピングモールです。便利で誠実なサービスで、快適なオンラインショッピング体験を提供します！" >
<メタ name = "キーワード" content = "オンラインショッピング、オンラインモール、携帯電話、ノートパソコン、コンピューター、MP3、CD、VCD、DV、カメラ、デジタル、アクセサリー、時計、メモリカード、JD" >

Taobaoホームページのメタ設定:

XML/HTML コードコンテンツをクリップボードにコピー

<メタ文字セット= "utf-8" >
<メタ http-equiv = "X-UA 互換" コンテンツ= "IE=edge,chrome=1" >
<メタ name = "レンダラー" コンテンツ= "webkit" >
<メタ名前= "spm-id" コンテンツ= "a21bo" >
<メタ名前= "説明" content = "Taobao.com - アジア最大かつ最も安全なオンライン取引プラットフォーム。衣料品、美容、家庭用品、デジタル製品、電話代/ポイントカードのチャージなど、8億点以上の高品質で特別価格の商品を取り揃えています。また、保証付き取引（商品受け取り後のお支払い）、前払い、偽造品の3倍の補償、7日間の無条件返品・交換、無料のデジタル修理などの安全な取引保証サービスも提供しており、オンラインショッピングの楽しさを存分に満喫できます！" >
<メタ name = "キーワード" コンテンツ= "" >

youkuホームページのメタ設定:

XML/HTML コードコンテンツをクリップボードにコピー

<メタ文字セット= "utf-8" >
<メタ http-equiv = "X-UA 互換" コンテンツ= "IE=Edge" >
<メタ名前= "タイトル" コンテンツ= "Youku - 動画再生、動画公開、動画検索を提供する中国有数の動画ウェブサイト - Youku Video" />
<メタ name = "キーワード" コンテンツ= "ビデオ、ビデオ共有、ビデオ検索、ビデオ再生、Youkuビデオ" />
<メタ名前= "説明" コンテンツ= 「ビデオ再生、ビデオ公開、ビデオ検索、ビデオ共有を提供するビデオサービスプラットフォーム」 />

Douyuホームページのメタ設定:

XML/HTML コードコンテンツをクリップボードにコピー

<メタ http-equiv = "コンテンツタイプ" コンテンツ= "text/html; 文字セット = utf-8" />
<メタ name = "レンダラー" コンテンツ= "webkit|ie-comp|ie-stand" >
<メタ http-equiv = "X-UA 互換" コンテンツ= "IE=Edge、chrome=1" >
<メタ name = "キーワード" コンテンツ= "DOTA2、人気ゲーム生放送、ゲーム生放送、HDゲーム生放送、モバイルゲーム生放送、eスポーツ生放送" />
<メタ名前= "説明" content = "Douyu - 全国ライブ放送プラットフォームは、DOTA2などの人気ゲームイベントのライブ放送や、さまざまな有名なゲームのライブ放送など、高解像度、高速、スムーズなビデオライブ放送とゲームイベントライブ放送サービスを提供しています。コンテンツが豊富で、タイムリーにプッシュされ、一味違うオーディオビジュアル体験をもたらします。すべてがDouyu - 全国ライブ放送プラットフォームにあります。" />

Tencentホームページのメタ設定:

XML/HTML コードコンテンツをクリップボードにコピー

<メタ文字セット= "UTF-8" >
<メタ name = "レンダラー" コンテンツ= "webkit" />
<メタ http-equiv = "X-UA 互換" コンテンツ= "IE=edge,chrome=1" >
<メタ name = "キーワード" content = "ニュースニュースセンターファクトニュースチャンネル、時事ニュースレポート" >
<メタ名前= "説明" content = "テンセントニュースは、事実に基づいたウェブサイトです。ニュースセンターには、時事ニュース、国内ニュース、国際ニュース、社会ニュース、時事解説、ニュース写真、ニューストピック、ニュースフォーラム、軍事、歴史、専門的な時事報道ポータルが含まれます" >
<メタ名前= "著者" コンテンツ= "スケーターシ" />

Qidian.com ホームページのメタ設定:

XML/HTML コードコンテンツをクリップボードにコピー

<メタ name = "キーワード" コンテンツ= "小説、小説ウェブサイト、恋愛小説、青春小説、ファンタジー小説、武術小説、都市小説、歴史小説、オンライン小説、オリジナルオンライン文学" />
<メタ名前= "説明" content = "小説を読む、素晴らしい小説はすべてQidian Novelsにあります。Qidian Novelsは、ファンタジー小説、武術小説、オリジナル小説、オンラインゲーム小説、都市小説、ロマンス小説、青春小説、歴史小説、軍事小説、オンラインゲーム小説、SF小説、ホラー小説、および初公開小説の最新章を無料で提供しています。素晴らしい小説はすべてQidian Novelsにあります！ ver:071011 人気の小説:。" />
<メタ http-equiv = "コンテンツタイプ" id = "meta_ContentType" コンテンツ= "text/html;charset=UTF-8" />
<メタ名前= "ロボット" コンテンツ= "すべて" />
<メタ名前= "googlebot" コンテンツ= "すべて" />
<メタ名前= "バイダスパイダー" コンテンツ= "すべて" />
<メタ名前= "著作権" content = "このページは www.qidian.com Qidian Chinese Network によって著作権が保護されています。無断転載を禁じます" />
<メタ http-equiv = "モバイルエージェント" コンテンツ= "フォーマット=wml; url=http://m.qidian.com" /> <メタ http-equiv = "モバイルエージェント" コンテンツ= "フォーマット = xhtml; url = http://m.qidian.com" /> <メタ http-equiv = "モバイルエージェント" コンテンツ= "フォーマット = html5; url = http://h5.qidian.com/bookstore.html" />
<メタ name = "アプリケーション名" コンテンツ= "Qidian Chinese Novel Network" /
<メタ名前= "msapplication-starturl" コンテンツ= "/Default.aspx?_s=ie9" />
<メタ名前= "msapplication-tooltip" content = "小説を読む_Qidian 中国小説ネットワーク|無料小説、ファンタジー小説、武侠小説、恋愛小説、青春小説、小説ネットワークあらゆる種類の小説のダウンロード" />
<メタ名前= "msapplication-task" content = "name=Starting Point Mini Games;action-uri=http://game.qidian.com/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/game.ico" />
<メタ名前= "msapplication-task" コンテンツ= "name=Bookshelf;action-uri=http://me.qidian.com/BookCase/1/1?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/book.ico" />
<メタ名前= "msapplication-task" コンテンツ= "name=読み取りクライアント;action-uri=http://c.qidian.com/android/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/phone.ico" />
<メタ名前= "msapplication-task" コンテンツ= "name=ランキング;action-uri=http://top.qidian.com/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/chart.ico" />
<メタ名前= "msapplication-task" コンテンツ= "name=検索;action-uri=http://sosu.qidian.com/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/search.ico" />
<メタプロパティ= "qc:admins" コンテンツ= "204236767661141166375" />

メタ

メタタグは、http-equiv と name 変数の 2 つの部分に分けられます。

http-同等

http-equiv は http のファイルヘッダーに相当します。ブラウザーに有用な情報を送り返し、ブラウザーが Web ページのコンテンツを正しく表示できるようにします。

価値	説明する	例
コンテンツタイプ	ページで使用する文字セットを設定する	< meta http-equiv ="content-Type" content ="text/html; charset=utf-8" > GB2312 は、Web サイトが簡体字中国語を使用していることを意味します。 ISO-8859-1 が使用されている場合、Web サイトで使用されるエンコーディングは英語であることを意味します。 UTF-8 は世界共通の言語エンコーディングを表します。 PS: HTML5ページの場合、<meta charset="utf-8"/>を直接使用します。
X-UA 互換	IE8 の専用タグは、IE8 ブラウザを指定して特定のバージョンの IE ブラウザのレンダリング方法をシミュレートし、いくつかの互換性の問題を解決するために使用されます。	< meta http-equiv ="X-UA-compatible" content ="IE=7" > 上記のコードは、ドキュメント標準を宣言するために DTD が使用されているかどうかに関係なく、IE8/9 は IE7 エンジンを使用してページをレンダリングすることを IE ブラウザに伝えます。 < meta http-equiv ="X-UA-compatible" content ="IE=8" >上記のコードは、IE8/9 が IE8 エンジンを使用してページをレンダリングすることを IE ブラウザに伝えます。 < meta http-equiv ="X-UA-compatible" content ="IE=edge" >上記のコードは、IE ブラウザに対して、IE8/9 以降のバージョンではページが IE の最高バージョンでレンダリングされることを伝えます。 < meta http-equiv ="X-UA-compatible" content ="IE=Edge,chrome=1" > 上記のコードでは、IE=edge は IE に最新のエンジンを使用して Web ページをレンダリングするように指示し、chrome=1 は Chrome Frame を有効にします。 PS: Google は、Google Chrome Frame (Google Embedded Browser Framework GCF) というプラグインを追加しました。このプラグインは、ユーザーの IE ブラウザを変更せずに維持できますが、ユーザーが Web を閲覧するときには、実際には Google Chrome ブラウザカーネルを使用し、IE6、7、8 などの複数のバージョンの IE ブラウザをサポートします。
期限切れ	Web ページの有効期限を設定します。	< meta http-equiv ="expires" content ="Fri,12Jan200118:18:18GMT" > PS: 時間形式はGMTである必要があります
リフレッシュ	自動的に更新され、新しいページが表示されます。	< meta http-equiv ="更新" content ="2;URL=https://www.baidu.com" > PS: 2 はページが 2 秒間表示され、その後次の URL にジャンプすることを意味します。
クッキーを設定する	Web ページの有効期限が切れると、ローカル Cookie は自動的に削除されます。	< meta http-equiv ="Set-Cookie" content ="cookie value=xxx;expires=Friday,12-Jan-200118:18:18GMT;path=/" > PS: 時間形式は GMT である必要があります。
ウィンドウズターゲット	ページを現在のウィンドウに独立したページとして表示するように強制します。これにより、Web ページが他のユーザーによってフレームページとして呼び出されるのを防ぐことができます。	< meta http-equiv ="ウィンドウターゲット" content ="_top" >
キャッシュ制御	キャッシュメカニズム	< meta http-equiv ="cache-control" content ="no-cache" > パブリック: 応答が任意のキャッシュによってキャッシュできることを示します。プライベート: 応答メッセージ全体または一部が単一のユーザー向けであり、共有キャッシュでは処理できないことを示します。これにより、サーバーは、この応答メッセージが他のユーザーのリクエストに対して有効になることなく、現在のユーザーに対する応答メッセージの一部のみを記述できるようになります。 no-cache: 要求または応答メッセージをキャッシュできないことを示します。 no-store: 重要な情報が誤って公開されるのを防ぐために使用されます。これをリクエストメッセージで送信すると、リクエストメッセージと応答メッセージの両方でキャッシュが使用されなくなります。 max-age: クライアントが指定された時間 (秒単位) を超えない経過時間の応答を受信できることを示します。 min-fresh: クライアントが、現在の時間と指定された時間の合計よりも短い応答時間の応答を受信できることを示します。 max-stale: クライアントがタイムアウト期間を超えて応答メッセージを受信できることを示します。 max-stale メッセージ値を指定すると、クライアントは指定されたタイムアウト期間を超える応答メッセージを受信できます。

名前

name 属性は主に Web ページを説明するために使用されます。対応する属性値は content です。content 内のコンテンツは主に検索エンジンロボットが情報を検索して分類するために使用されます。

価値	説明する	例
著者	ウェブページの著者を記載する	<メタ名="author"コンテンツ="dashen" />
キーワード	検索エンジンによってインデックスされていたページのキーワード	< meta name =" キーワード " content =" ニュース、ニュースセンター、ニュースチャンネル " >
説明	ページの説明（検索エンジンのインデックス用）	< meta name ="description" content ="ニュースセンター、政治ニュース、国内ニュース、国際ニュース、社会ニュース、時事解説、ニュース写真、ニューストピック、ニュースフォーラム、軍事、歴史、専門的な時事報道ポータルを含む" >
ビューポート	ページのズームを制御するために使用	< meta name ="viewport" content ="width=デバイス幅、initial-scale=1、最大スケール=1、最小スケール=1、ユーザースケーラブル=いいえ" >
レンダラー	デュアルコアブラウザがデフォルトでページをレンダリングする方法を指定します。	< meta name ="renderer" content ="webkit" > // デフォルトの Webkit カーネル< meta name ="renderer" content ="ie-comp" > // デフォルトの IE 互換モード< meta name ="renderer" content ="ie-stand" > // デフォルトの IE 標準モード PS: 360 ブラウザのサポート
ジェネレータ	ウェブサイトの作成に使用したソフトウェアについて説明します	< meta name ="generator" content ="Microsoft" />
改訂	ウェブドキュメントの変更時刻	< meta name ="改訂" content ="デザインネットワーク、2015 年 6 月 24 日" />
ロボット	検索ロボットに、どのページをインデックスする必要があるか、どのページをインデックスする必要がないかを通知するために使用されます。	<メタ名="ロボット"コンテンツ="なし" /> 値: all\|none\|index\|noindex\|follow\|nofollow、デフォルトは all all: ファイルが取得され、ページ上のリンクを照会できます。 none: ファイルは取得されず、ページ上のリンクを照会することはできません。 index: ファイルが取得されます。 follow: ページ上のリンクをクエリできます。 noindex: ファイルはインデックス化されませんが、ページ上のリンクは照会できます。 nofollow: ファイルは取得されませんが、ページ上のリンクは照会できます。
著作権	ウェブサイトの著作権情報	< meta name ="copyright" content ="このページは XXX によって著作権が保護されています。無断転載を禁じます" />