HTML の META タグの使用に関するヒントの例

HTML の META タグの使用に関するヒントの例

HTML メタタグ

HTML メタタグは、Web ページのコンテンツに関する情報をブラウザや検索エンジンに提供するために使用できます。たとえば、Web ページのコンテンツの説明、Web ページの重要なキーワード、Web ページのコードはすべて、メタタグによって一般的にマークされる Web ページ情報です。さらに、Web ページの作成者、Web ページが公開された時間、使用したエディターなど、それほど重要ではない情報も、META タグを通じてマークできます。META の機能は、この Web ページ情報を示し、ブラウザや検索エンジンに提供することだけです。Web ページを閲覧する「人」向けに書かれたコンテンツではありません。

ヘッド内に記述された HTML メタタグの例

XML/HTML コードコンテンツをクリップボードにコピー
  1. <ヘッド>   
  2. < title >テスト Web ページ</ title >   
  3. <メタ 名前= "説明"   content = "ページの簡単な説明です" >   
  4. <メタ  name = "キーワード"   content = "キーワード1、キーワード2" >   
  5. </ヘッド>    

標準の <meta> タグには終わりがありません。<meta> タグにパラメータを直接記述できます。Web ページにはさまざまな <meta> タグを含めることができますが、それらはすべて head タグに記述する必要があります。例の title タグは、Web ページのタイトルを示すために使用されます。<meta> タグの前後に記述できます。

1. 漢字の表示と配置

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

例:
Content-Type==>ファイルコンテンツ形式
;==>CONTENT" " で実行するすべての内容はセミコロンで区切られます
text/html ==> プレーンテキスト/ハイパーテキスト
charset==> 文字セットは中国語繁体字Big 5です。日本語の場合はiso-2022-jpです。


2. 検索エンジンがあなたを見つけやすくする

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  NAME = "キーワード"   CONTENT = "コンピュータ教育、インターネット教育、Linux教育、CSS教育、HTML教育、ソフトウェア教育、電子メール教育、SEO教育、リンク交換" >   
  2. <メタ  NAME = "キーワード"   CONTENT = "css'HomePage'html'linux'seo" >   

注: ウェブページのテキスト内のキーワードは中国語または英語で使用できます。


3. ウェブサイトのコンテンツの説明について

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  NAME = "説明"   CONTENT = 「これは無料でウェブデザインを学ぶのに最適な場所です、Network Institute」 >   

説明: 説明==>コンテンツの主な説明


4. このページの著者は誰ですか?

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  NAME = 「著者」  コンテンツ= "PCNET" >   

説明: このウェブページの著者名やその他の情報を記入します


5. この Web ページを完成させるために使用されたエディターはどれですか?

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  NAME = "ジェネレータ"   CONTENT = "Mozilla/3.0Gold(Win95)[Netscape]" >   

例:
このウェブページの著者名やその他の情報をマークします
ジェネレータ ==> エディター
Mozilla/3.0Gold(Win95)[Netscape]==>エディタとその他のバージョンノート


6. このウェブページはいつ完成しますか?

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  NAME = "作成日"  コンテンツ= "2003 年 1 月 1 日 20:40:01" >   

例:
作成日==>作成日
01-jan-2003 20:40:01 ==> 詳細な日付と時刻


7. このウェブページの有効期間はキャッシュによって制限されません

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  NAME = "期限切れ"  コンテンツ= "2005 年 1 月 1 日 00:00:00" >   
  2. <メタ  HTTP-EQUIV = "プラグマ"  コンテンツ= "no_cache" >   

例:
期限切れ==>ウェブページの有効期限
01-jan-2005 00:00:00 ==> 過去の日付と時刻。Mon,12 Jan 2007 00:00:00 GMT も使用できます。
no_cache==> キャッシュによる制限はありません。つまり、Web ページにはメモリ機能がありません。


8. ウェブページ作成者のウェブサイトとメールアドレス

XML/HTML コードコンテンツをクリップボードにコピー
  1. <リンク  rev = "作成"   href = "mailto:[email protected]" >   
  2. <リンク  rev = "作成"   href = "http://www.pcnet.idv.tw/" >   

説明: Web ページ作成者のメールまたは URL ステートメント
rev==> 肯定的な関連性
made=>ウェブページメーカー
href==>あなたのメールアドレスまたはウェブサイト


9. 自動ページ切り替えを有効にする

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  HTTP-EQUIV = "更新"  コンテンツ= "15; url = http://www.pcnet.idv.tw/" >   

例:
リフレッシュ==>更新または再編成
15==>15秒後に次のアクションを実行します
;==>CONTENT" " で実行するすべての内容はセミコロンで区切られます
url=http://www.pcnet.idv.tw/==>このウェブページへの変換を指定します


10. 入場または退場時の特殊効果(IEのみ)

XML/HTML コードコンテンツをクリップボードにコピー
  1. <メタ  http-equiv = "ページ変更効果が発生する状況を指定します"   content = "特殊効果モード (期間 = 特殊効果の継続時間、トランジション = 置き換えられた特殊効果)" >   

例:
http-equiv="Page-Enter はこのページに入るためのもので、Page-Exit はこのページから離れるためのもので、Site-Enter はこのサイトに入るためのもので、Site-Exit はこのサイトから離れるためのものです"。
content="revealTrans (ページ変更効果を指定)、blendTrans (ページ変更効果を「ブレンド」に設定)。
期間 = 特殊効果の期間 (秒単位) を設定します。3 ~ 5 秒が推奨されます。
トランジション=特殊効果を0~23(省略)に置き換えます。


注記:

これは <HEAD> と </HEAD> の間に配置する必要があります。主に、自分自身または他の人 (検索エンジン) のためにこの Web ページのコンテンツを説明するために使用されます。また、自動ページめくりなどの特別な効果を作成することもできます。
http-equiv または NAME 属性は content 属性と一緒に使用する必要がありますが、これら 2 つは互換的に使用することもできます。
META ディスクリプションタグの使用方法は、各検索エンジンの設定によって異なります。
メタタグの有無は、Web ページの通常の表示には影響しません。主な目的は、Web ページ上でさまざまな情報を提供したり、特別な効果を生み出したりすることです。
Webページでの使用においては、このページで説明しているタグ1.2.3.4.8をメインタグとして使い、必要に応じて残りを追加または削除することをお勧めします。
この例の実際の配置を確認するには、ソース コードの表示を使用できます。
詳しいレポート情報については、講師(著者)のウェブサイトをご覧ください。

<<:  ウェブページを白黒に変換します(Google、Firefox、IE、その他のブラウザと互換性があります)

>>:  JavaScript でよく使われる 3 つの Web エフェクトの詳細な説明

推薦する

Linux サーバーの状態を監視する方法

私たち、特に Linux エンジニアは毎日 Linux サーバーを扱っています。サーバーのセキュリテ...

SQL インジェクションのある Web サイトを見つける方法 (必読)

方法 1: Google の詳細検索を使用します。たとえば、次に示すように.asp?id=9などの ...

JavaScript は、シンプルな虫眼鏡の最も完全なコード分析を実装します (ES5)

この記事では、参考までに、シンプルな虫眼鏡を実装するためのJavaScriptの具体的なコードを紹介...

blockquote タグの使用に関する注意

<br />セマンティクス化は一言で説明することはできないし、まだ公式かつ厳密な定義もあ...

Linuxシステムの操作レベルの詳細な紹介

目次1. Linuxシステムの操作レベルの概要2. 実行レベルを確認する3. 現在のシステムの動作レ...

HTML テーブルタグチュートリアル (44): テーブルヘッダータグ

<br />ソース コード内で表の構造を明確に区別するために、HTML 言語では、表のヘ...

デザイン理論:人の心を理解する方法

<br />かつて、仏印と東坡氏が仏教について雑談していたとき、東坡氏が突然こう言った。...

Vue3 でサードパーティのコンポーネントライブラリをオンデマンドでロードする方法

序文Element Plus を例に、コンポーネントとスタイルのオンデマンド読み込みを構成します。環...

JavaScript はモーダルボックスのドラッグ効果を実現します

これはモーダル ボックスのドラッグのケースです。ここで実装する関数は次のとおりです。 1. ポップア...

Nginx プロセス管理とリロードの原則の詳細な説明

プロセス構造図Nginx はマルチプロセス構造です。マルチプロセス構造は、次のような Nginx の...

Linux での MySQL のインストールに関するチュートリアル

目次1. 古いバージョンを削除する2. サーバーのカーネルタイプを確認し、適切なバージョンをダウンロ...

ネイティブ CSS で無限テキストカルーセルを実装する一般的な方法

テキストカルーセルは私たちの日常生活で非常に一般的です。スーパーマーケットや実店舗の入り口には、テキ...

ARGB、RGB、RGBAの違いと紹介

ARGB は、アルファ (透明度) チャネルが追加された RGB カラー モードであり、32 ビット...

ドロップダウンリスト選択ボックスを実装するJavaScript

この記事の例では、ドロップダウンリスト選択ボックスを実装するためのJavaScriptの具体的なコー...

MySQL 8.0 のインストール中に発生した 3 つの小さなエラーの概要

序文これまで当社ではMySQLの5.7シリーズを使用していましたが、バージョン8.0のリリースに合わ...