HTML メタタグの一般的な使用例のコレクション

HTML メタタグの一般的な使用例のコレクション

マタタグとは
<meta> 要素は、検索エンジン向けの説明やキーワード、更新頻度など、ページに関するメタ情報を提供します。
<meta> タグはドキュメントの先頭に配置され、コンテンツは含まれません。 <meta> タグの属性は、ドキュメントに関連付けられた名前と値のペアを定義します。
metaはhtml言語のhead領域にある補助タグです。ほとんどすべての Web ページでメタ タグを見ることができますが、ブラウザの表示ページには表示されません。これらのコードは不要だと思うかもしれません。実際、メタタグは非常に重要であり、ウェブサイトに実用的な効果をもたらします。たとえば、ウェブサイトの説明()は検索エンジンのインデックスに反映されます。たとえば、メタタグを使用して、ウェブサイトのエンコーディングをgbk2312またはutf-8に設定します。メタタグはキーワードを設定します

基本的な構文

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ   name = "キーワード"     content = "キーワード 1、キーワード 2、キーワード 3..." >   

キーワード タグの機能は、検索エンジンに Web サイトのコンテンツの内容を伝え、検索エンジンが Web サイトを定義してインデックス付けしやすくすることです。英語の入力方法では、キーワードはコンマで区切られ、キーワードの長さは通常 100 文字以内です。
たとえば、Web 開発技術の学習に関する Web サイトの場合、キーワードの説明は次のように記述できます。

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ   name = "キーワード"     content = "HTML チュートリアル、CSS チュートリアル、JavaScript チュートリアル" >   

ユーザーが検索エンジンでこれらのキーワードを検索すると、あなたのウェブサイトが結果に表示されます。ただし、初期の頃は多くの不正行為者(ブラックハットSEO)がキーワードスタッキングを使用していたため、検索エンジン(Baidu)はキーワードに対してそれほど敏感ではなくなりました。

メタタグ設定の説明
構文:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ   name = "説明" content = "説明内容" >   

ウェブページの説明は非常に重要で、検索エンジンに直接反映されます。たとえば、Baidu の Web サイトを開いて「Sina」を検索すると、次のページが表示されます。

文字セットを設定するメタタグ
構文:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv ="コンテンツタイプ"コンテンツ="text/html; charset ="エンコーディング" >   

一般的なエンコード形式には、中国語エンコード(gbk2312)と国際エンコード(UTF-8)があります。gbk2312は中国語エンコードです。ウェブサイトのコンテンツがすべて中国語の場合は、gbk2312を使用します。UTF-8は、国際エンコード(中国語と英語を含む)周辺のテキストに汎用的です。それらの主な違いは、gbk2312は中国語専用に設計されており、1つの中国語文字が2文字を占めるのに対し、UTF-8は汎用的で、1つの中国語文字が3バイトを占めることです。初期の頃は、ネットワーク帯域幅のリソースが不足していたため、gbk2312エンコードを使用すると帯域幅を節約し、Webページを開く速度を上げることができましたが、現在では自宅の帯域幅が4M以上になり、節約したバイト数を完全に無視しています。
例:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv = "コンテンツタイプ"  コンテンツ= "text/html; 文字セット = utf-8"   >   

ウェブを閲覧するとき、ほとんどの人は文字化けしたページに遭遇したことがあるでしょう。エンコード形式により、ブラウザは設定された編集形式で解析できます。エンコード形式が正しくない場合、文字化けした文字が表示されます。そのため、世界中のすべてのブラウザでウェブページを正常に表示できるように、ユニバーサル UTF-8 エンコードを使用することをお勧めします。

自動更新時間を設定するメタタグ
構文

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv ="refresh" content ="更新間隔時間" >   

更新時間は秒単位です。たとえば、フォーラム ページでは、更新しないと新しい投稿が表示されません。このように更新が速いページの場合は、自動更新コードを追加して、最新のページが表示されるようにすることができます。
例:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv ="refresh"コンテンツ="3" >   

ここでは時間を 3 秒に設定していますので、ご自身でテストしてください。

メタタグ設定により自動的に新しいページにジャンプします
構文

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv ="refresh" content ="ジャンプ間の秒数; Url ="新しい Web ページのアドレス" >   

例:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv ="refresh"コンテンツ="3; Url ="http://www.adminwang.com" >   

ブラウザでこのページを開くと、3 秒後に自動的に当社 Web サイトのホームページにジャンプします。

キャッシュを無効にするメタタグ設定
構文

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv = "キャッシュ制御"   コンテンツ= "キャッシュなし"   />   

ブラウザにはキャッシュ機構があり、Webページを開くと自動的にローカルに保存されることはご存じのとおりです。その目的は、一定期間内に再度アクセスしたときにキャッシュされたファイルを直接呼び出して、アクセス速度を向上させることです。ただし、フォーラムのように頻繁に変更されるページの場合、ブラウザにキャッシュファイルを保存させたくないため、このコードを追加できます。プログラム開発には別の用途もあります。プログラムのデバッグ中にコード変更の効果を随時確認したい場合は、このコードを使用してブラウザのキャッシュを無効にすることができます。
別の書き方:

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv = "プラグマ"  コンテンツ= "キャッシュなし"   >   

<<:  Docker を使用して Microsoft Sql Server を展開するための詳細な手順

>>:  MySQL の「特殊キーが長すぎます」の解決策

推薦する

MySQLとElasticsearch間のデータ非対称性問題の解決策

MySQLとElasticsearch間のデータ非対称性問題の解決策jdbc-input-plugi...

Docker デプロイメント Springboot プロジェクト例の分析

この記事は主に、docker デプロイメント springboot プロジェクトのサンプル分析を紹介...

JavaScript の 3 つの BOM オブジェクト

目次1. 場所オブジェクト1. URL 2. 場所オブジェクトのプロパティ3. ロケーションオブジェ...

HTML iframe 使用状況の概要の収集

Iframe 使用状況の詳細な分析<iframe frameborder=0 width=17...

WeChatアプレット認証ログインを処理するエレガントな方法

序文WeChat ミニプログラム プロジェクトでユーザー情報を取得し、ユーザー ログインを実装する場...

Windows 8 での MySQL 5.6.15 のインストールと設定方法のグラフィック チュートリアル

MySQLは私がとても気に入っているデータベースです。今日はWindows 8システムでインストール...

Dockerは単一のイメージを使用して複数のポートにマッピングします

必要:公式サイトのリソースサーバーは確かに1つのインスタンスでは使えず、複数のインスタンスを一緒に使...

WeChatミニプログラムがいいねサービスを実装

この記事では、WeChatアプレットの具体的なコードを参考までに紹介します。具体的な内容は次のとおり...

Windows 10 で MySQL を完全に削除してアンインストールする方法

序文この記事では、Windows 10 システムで MySQL を完全に削除してアンインストールする...

Vue で動的に追加されたルーティング ページの更新時に失敗する理由と解決策

目次問題の説明シナリオインターフェースリターンフロントエンドメニューの定義vuex のメソッド問題原...

Linux ホスト名設定の詳細な紹介

目次1. Linuxホスト名を設定するクライアントホストを構成するサーバーホストを構成する2. ホス...

ローカル yum ソースの設定、国内 yum ソースの設定、epel ソースの設定を行う Linux の手順

1. ローカルyumソースを設定する1. ISOイメージをマウントする マウント -o loop /...

フォント宝庫 50 種類の素晴らしい無料英語フォントリソース パート 1

デザイナーは独自のフォント ライブラリを持っているため、プロジェクトの設計時にすぐに使用できます。今...

MySQLテーブル構造を変更するコマンドを表示する

簡単な説明エディターはデータベースのエンコードが間違っているために問題に遭遇することが多く、これは頭...

RedHat 6.5 に MySQL 5.7 をインストールするための詳細なチュートリアル

RedHat6.5インストールMySQL5.7チュートリアル共有、参考までに、具体的な内容は次のとお...