HTML ページ ヘッダー コード例の詳細な説明

知識ポイント1: ヘッダー情報にWebページのベースURLを設定する

ベース URL の本質は、ハイパーリンクの属性を均一に設定することです。ベース URL タグは </base> で、href と _target の 2 つの属性があります。 href はベース URL のパスを設定するために使用され、_target はハイパーリンクを開く方法を設定するために使用されます。

ベース URL を追加すると、ページ内のすべての相対 Web サイト ルート ディレクトリ アドレスを絶対アドレスに変換できます。ブラウザがページを参照すると、相対的な Web サイトとディレクトリ アドレスが <base> タグを通じてベース URL パスに追加され、絶対アドレスに変換されます。まず、base.htm を作成し、次のように HTML コードを記述します。

ベース URL は上記のコードを通じて設定されます。 Base.htm ページ内のすべてのハイパーリンクのアドレスの前には「https://www.jb51.net」が付きます。つまり、絶対アドレスに変換されます。さらに、ページ上のすべてのハイパーリンクが新しいウィンドウで開かれます。

知識ポイント2: ヘッダー情報のメタ情報タグ

メタ情報タグはヘッダー情報の基本タグであり、プロフェッショナルな Web ページ コードにはメタ情報の詳細な設定があります。メタ情報タグは </meta> という単一のタグです。 Meta 要素によって提供される情報は閲覧ユーザーには表示されず、通常はページ情報の名前、キーワード、作成者などを定義するために使用されます。 HTML ページでは、メタ タグにメタ コンテンツが含まれ、HTML ヘッド ページには複数のメタ要素が存在する場合があります。

メタ タグ属性には、ページ説明属性 (name) と http タイトル情報 (http-equiv) の 2 種類があります。

名前属性

name 属性は主に Web ページのコンテンツを説明するために使用され、検索エンジンの最適化にも使用されるため、習得する必要があります。検索エンジン（Google、Baidu など）が見つけて分類できるように、name 属性を正しく設定します。検索エンジンは通常、メタ値を自動的に探して Web ページを分類します。 name の値は次のとおりです。

<1>キーワード。つまり、キーワードは、Web ページに含まれるキーワードやその他の情報を説明するために使用され、検索エンジンによって検索される可能性が高まります。記述形式は<meta name="keywords" content = "keywords"/>で、content属性の値はユーザーが設定した特定のキーワードとなります。 （一般的には、カンマで区切って複数のキーワードを設定できます。検索エンジンではキーワードの数に制限があるため、キーワードの内容は簡潔にする必要があります。）

<2>説明。中国語の意味は「説明」で、Webページの主な内容やテーマなどを説明するために使用されます。適切な設定により、検索エンジンに見つかる可能性も高まります。形式は <meta name="description" content = "ページの説明"/> です。content 属性値は、ユーザーが設定したページの具体的な説明で、最大 1024 文字まで入力できますが、検索エンジンでは最初の約 175 文字しか表示されません。

<3>著者。著者: ウェブサイトの著者名を設定するために使用され、プロフェッショナルなウェブサイトでよく使用されます。形式は<meta name="author" content = "著者名"/>です。

<4>ジェネレータ。ウェブサイト編集ツールの名前を設定するために使用されるジェネレーターは、専門的なウェブサイトのページでよく使用されます。形式: <meta name="generator" content = "Webサイト編集ツール名"/>

<5>ロボット。ロボット。ページの検索方法を制限するために使用されます。検索エンジンの検索ロボットは、Web ページ上のリンク (http リンクや src リンクなど) に沿って継続的に情報を取得し、独自のデータベースを構築します。このメタタグにより、一部のコンテンツが検索エンジンによって検出されなくなり、一部の情報の公開性が低下する可能性があります。記述形式は<meta name="robots" content="command combination">です。この属性の値には、index、noindex、follow、nofollow の 4 つのコマンドが含まれます。順列と組み合わせにより、4 つの組み合わせが存在します。 Index と follow の組み合わせは all とも呼ばれ、noindex と nofollow は none とも呼ばれます。

http-equiv 属性

http-equiv属性の値は次のとおりです。

<1>コンテンツ タイプ、コンテンツ カテゴリ。ページのカテゴリと言語の文字セットを設定するために使用されます。記述形式は <meta http-equiv="content-type" context="text/html"; charset="gb2312"/> です。content 属性の値は、ページが HTML コードで出力されることを示し、文字セットは gb2312 (簡体字中国語) です。国際的な Web サイト開発では、文字を統一するために文字セットとして utf-8 を使用することをお勧めします。

<2>リフレッシュします。更新は、ウェブページが更新される時間、または一定時間後に自動的に他のページに移動する時間を設定するために使用されます。最初の形式 <meta http-equiv="refresh" context="30"/> は、30 秒ごとに更新することを意味します。2 番目の形式 <meta http-equiv="refresh" context="30;url=www.google.com"/> は、ページが 30 秒後に自動的に www.google.com に移動することを意味します。

<3>expires は中国語で「有効期限」を意味し、ページの有効期限を設定するために使用されます。 Web ページの有効期限が切れると、サーバーからコールバックされる必要があります。最初の形式は <meta http-equiv="expires" context="Wed,10 Mar 2011 12:00:00 GMT"/> です。コンテンツの値は Web ページの有効期限を表し、GMT の時間形式を使用する必要があります。 2 番目の記述形式は <meta http-equiv="expires" context="30"/> で、有効期限が何秒であるかを示します。

<4>キャッシュ制御、キャッシュ制御。キャッシュ内の Web ページの呼び出しを禁止するために使用されます。記述形式は <meta http-equiv="cache-control" context="no-cache"/> です。no-cache はキャッシュが許可されないことを意味します。

<5>set-cookie、set cookie、このページのクッキーの有効期限を設定するために使用されます。記述形式は <meta http-equiv="set-cookie" context="Wed,10 Mar 2011 12:00:00 GMT"/> で、これはクッキーがこの時点で削除されることを意味します。

知識ポイント3: ヘッダー情報の実装とCSSとJavaScriptの混在

CSS は HTML Web ページのスタイルを担当し、JavaScript は HTML Web ページの動的な動作を担当します。 CSS と JavaScript を組み合わせる最も一般的な方法は、それらをヘッダー情報に書き込むことです。
<1>CSS を追加するには、ヘッダー情報に <style type="text/css"></style> タグ ペアを追加するだけです。サンプルコードは次のとおりです

<2>JavaScript を追加するには、ヘッダー情報に <script type="text/javascript"></script> タグ ペアを追加するだけです。サンプルコードは次のとおりです。

知識ポイント4: よく使われるヘッダー情報機能の推奨事項

<1> ページ切り替え効果。そのうちの 1 つは次の形式で記述されます。

http-equiv 属性の値が page-enter の場合、ページに入るときに特殊効果が有効になることを意味します。http-equiv 属性の値が page-exit の場合、ページを終了する (離れる) ときに特殊効果が有効になることを意味します。

コンテンツ属性の値は特殊効果の種類を表し、動的フィルターとも呼ばれます。フィルターには多くの種類がありますが、その中でも最も一般的なのが blendtrans です。効果はフェードインとフェードアウトで、持続時間の値は効果が持続する時間 (秒単位) を示します。

別のフィルター効果の記述形式は次のとおりです。

revealTrans 動的フィルターは、ページの入口と出口の効果にも使用できます。 Duration はフィルター効果の持続時間 (秒単位) を示し、Transition は使用する効果を示すフィルター タイプです。値の範囲は 0 ～ 23 です。

<2> 他のウェブサイトによってウェブページがフレーム化されるのを防ぐために、現在のウィンドウにページを独立したページとして表示するように強制します。記述形式は次のとおりです。

<3>ページアイコンの設定、書き込み形式は次のとおりです。

href 属性の値は、ico アイコン ファイルのパスであり、相対ルート ディレクトリ パスです。