HTMLのメタタグ例を詳しく解説

以下は、HTML メタタグの使用法 (推奨) の概要です。編集者はこれがとても良いと思ったので、参考として共有します。エディターをフォローして見てみましょう

メタタグ機能

METAタグはHTMLタグHEAD領域のキータグであり、文書文字セット、使用言語などの基本情報を提供しますキーワードや Web ページのレベルを設定する最大の役割は、検索エンジンの最適化 (SEO) を実行できるようにすることです。

追記: indexエンジンロボットを検索して分類するのは簡単です。インターネットアプリケーションはそれに注意する必要があります。

大手ウェブサイトでどうやって書くの？

このタグを理解する前に、次のようにさまざまな主流 Web サイトでメタ設定を検索しました。

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

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

1. 2d3a0342eb7ca09363323105a222067f

2. 88b71ba24dda4890ba6e4f4609f9e26a

3. 56f0e1a4563647c0c823dad37dd3bcc5

淘宝網ホームページのメタ設定:

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

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit">
<meta name="spm-id" content="a21bo">
<meta name="description" content="淘宝网 - 亚洲最大、最安全的网上交易平台，提供各类服饰、美容、家居、数码、话费/点卡充值… 8亿优质特价商品，同时提供担保交易(先收货后付款)、先行赔付、假一赔三、七天无理由退换货、数码免费维修等安全交易保障服务，让你全面安心享受网上购物乐趣！">
<meta name="keyword" content="">

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

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

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="title" content="优酷-中国领先视频网站,提供视频播放,视频发布,视频搜索 - 优酷视频" />
<meta name="keywords" content="视频,视频分享,视频搜索,视频播放,优酷视频" />
<meta name="description" content="视频服务平台,提供视频播放,视频发布,视频搜索,视频分享" />

Douyu ホームページのメタ設定: XML/HTML コード

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

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="keywords" content="DOTA2,热门游戏直播,游戏直播,高清游戏直播,手机游戏直播,电子竞技直播" />
<meta name="description" content="斗鱼 - 全民直播平台提供高清、快捷、流畅的视频直播和游戏赛事直播服务，包含DOTA2等各类热门游戏赛事直播和各种名家大神游戏直播，内容丰富，推送及时，带给你不一样的视听体验，一切尽在斗鱼 - 全民直播平台。" />

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

XML/HTML コード

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

<meta charset="UTF-8">
<meta name="renderer" content="webkit" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="keywords" content="新闻 新闻中心 事实派 新闻频道,时事报道">
<meta name="description" content="腾讯新闻，事实派。新闻中心,包含有时政新闻、国内新闻、国际新闻、社会新闻、时事评论、新闻图片、新闻专题、新闻论坛、军事、历史、的专业时事报道门户网站">
<meta name="author" content="skeetershi" />

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

XML/HTML コード

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

<meta name="keywords" content="小说,小说网,言情小说,青春小说,玄幻小说,武侠小说,都市小说,历史小说,网络小说,原创网络文学" />
<meta name="description" content="小说阅读,精彩小说尽在起点小说。起点小说提供玄幻小说,武侠小说,原创小说,网游小说,都市小说,言情小说,青春小说,历史小说,军事小说,网游小说,科幻小说,恐怖小说,首发小说最新章节免费小说阅读,精彩尽在起点小说！ver:071011热门小说:。" />
<meta http-equiv="Content-Type" id="meta_ContentType" content="text/html;charset=UTF-8" />
<meta name="robots" content="all" />
<meta name="googlebot" content="all" />
<meta name="baiduspider" content="all" />
<meta name="copyright" content="本页版权 www.qidian.com 起点中文网所有。All Rights Reserved" />
<meta http-equiv="mobile-agent" content="format=wml; url=http://m.qidian.com" /><meta http-equiv="mobile-agent" content="format=xhtml; url=http://m.qidian.com" /><meta http-equiv="mobile-agent" content="format=html5; url=http://h5.qidian.com/bookstore.html" />
<meta name="application-name" content="起点中文小说网" /   
<meta name="msapplication-starturl" content="/Default.aspx?_s=ie9" />
<meta name="msapplication-tooltip" content="小说阅读_起点中文小说网|免费小说,玄幻小说,武侠小说,言情小说,青春小说,小说网各类小说下载" />
<meta name="msapplication-task" content="name=起点小游戏;action-uri=http://game.qidian.com/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/game.ico" />
<meta name="msapplication-task" content="name=藏书架;action-uri=http://me.qidian.com/BookCase/1/1?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/book.ico" />
<meta name="msapplication-task" content="name=读书客户端;action-uri=http://c.qidian.com/android/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/phone.ico" />
<meta name="msapplication-task" content="name=排行榜;action-uri=http://top.qidian.com/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/chart.ico" />
<meta name="msapplication-task" content="name=搜索;action-uri=http://sosu.qidian.com/?_s=ie9;icon-uri=http://www.qidian.com/Images/ie9/search.ico" />
<meta property="qc:admins" content="204236767661141166375" />

meta の詳細な説明

meta タグは、http-equiv と namevariable

の 2 つの部分に分けることができます。

http-equiv

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

値説明例content-typeページで使用される文字セットを設定します12406f5e5564e82ca91edd7365aaa35d上記のコードは、ドキュメント標準の宣言に DTD が使用されているかどうかに関係なく、IE8 であることを IE ブラウザーに伝えます。 /9 は IE7 エンジンを使用してページをレンダリングします。
bf6cf787c9e480425d6e2b48c3eea429 上記のコードは、IE8/9 が IE8 エンジンを使用してページをレンダリングすることを IE ブラウザーに伝えます。
23786d42039592619c59f32f943954c9 上記のコードは、IE 8/9 以降のバージョンがページのレンダリングに IE の最上位バージョンを使用することを IE ブラウザーに伝えます。
0340eecb6e6641120d8323df2494d797

上記のコード IE=edge は、IE に最新のエンジンを使用して Web ページをレンダリングするように指示し、chrome=1 は Chrome Frame をアクティブ化できます。

PS: Google はプラグインを追加します: Google Chrome Frame (Google 埋め込みブラウザFrameworkGCF) )、このプラグインはユーザーの IE ブラウザーを変更せずに維持できますが、Web を閲覧するとき、ユーザーは実際には Google Chrome ブラウザー コアを使用し、IE6、7、8 などの複数のバージョンの IE ブラウザーをサポートします。

set-cookie Web ページの有効期限が切れた場合、ローカル Cookie が自動的にa2c9227be6b1b6fd6b2530432b8dcaf7 windows-target 現在のウィンドウでページを強制的に独立したページとして表示します。これにより、自分の Web ページが他の人によってフレーム ページとして呼び出されることを防ぐことができます099e782fa7d4d5e3536fdbfbce2030a2キャッシュ制御キャッシュメカニズム9176adcf7fd21ee70b76b75374dee2d4

name

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

expires	Web ページの有効期限を設定します。	23c623dc02026f00c9a6d66615d33c48 PS: 自動的に更新して新しいページをポイントするには、GMT 時間形式を使用する必要があります
refresh	。	d12e847f29b24a4eef3fcc2e627a1f46 追記: 2 は、ページが 2 秒間留まり、その後次の URL にジャンプすることを意味します
	削除されます。	PS: GMT 時間形式を使用する必要があります。
		Public: 応答を任意のキャッシュ領域にキャッシュできることを示します。 プライベート: 単一ユーザーの応答メッセージのすべてまたは一部が共有キャッシュで処理できないことを示します。これにより、サーバーは、他のユーザーのリクエストには無効なユーザーからの部分的な応答のみを記述することができます。 no-cache: リクエストまたはレスポンスメッセージをキャッシュできないことを示します。 no-store: 重要な情報が意図せず公開されるのを防ぐために使用されます。リクエスト メッセージで送信すると、リクエスト メッセージと応答メッセージの両方でキャッシュが使用されます。 max-age: クライアントが、指定された時間 (秒) を超えない存続期間を持つ応答を受信できることを示します。 min-fresh: クライアントが、現在の時刻に指定された時刻を加えた値よりも短い応答時間で応答を受信できることを示します。 max-stale: クライアントがタイムアウト期間を超えて応答メッセージを受信できることを示します。 max-stale メッセージの値を指定すると、クライアントは指定されたタイムアウト期間の値を超える応答メッセージを受信する可能性があります。

値: all|none|index|noindex|follow|nofollow、デフォルト allall: ファイルが取得され、ページ上のリンクはnone: ファイルは取得されません。とページ ページ上のリンクはクエリできません。 index: ファイルは取得されます。 follow: ページ上のリンクはクエリできます。 1. HTML の無料ビデオチュートリアル2. 4. HTML にリンクを挿入する方法を説明します

値	説明	例
author	ページの作成者をマークします	3aa60acd2890f76fee63281f4f2502fc
キーワード	ページキー 検索エンジンに含めるキーワード	8c9576507e03ae02938e08ea3e55204a
description	ページの説明、検索エンジンに含める	e0859315c0a395d4a47b601f1571695d
renderer	デュアルコア ブラウザがデフォルトでページをレンダリングする方法を指定します。	2e3560c4189039010106a5cc9f144b3a//デフォルトの Webkit カーネル3150f7dff6100b28b61e71c0f6b7edb6//デフォルトの IE 互換モード818fa8726004467fc793eae5e5392e3b//デフォルトの IE 標準モード PS: 360 ブラウザのサポート
generator	Web サイトの作成にどのようなソフトウェアが使用されているか説明してください	ffb4484d6dc2a7d032fd6fa1be2fabdb		クエリ可能
		noindex: ファイルは取得されません。ページはクエリできます。 nofollow: ファイルは取得されませんが、ページ上のリンクはクエリできます。 copyright ウェブサイトの著作権情報 d0517c0bc7dfd58325f20c00307e7724 大規模なウェブサイトのメタ設定を通じて、次の情報を確認できます。一般的に使用されるのは、X-UA 互換、キーワード、および説明です。 【関連する推奨事項】
	HTML の知識ポイントを共有する	3. div が iframe によってブロックされるさまざまな状況を解決する

5. nodejs で HTML を解析する方法を説明します

以上がHTMLのメタタグ例を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。