ページのヘッドコンテンツの操作

最終更新日 : 2021年4月27日

Dreamweaver Web ページでのコンテンツの表示と編集、メタプロパティとページタイトルの設定、ページのキーワードとページの指定などを行います。

ページには、ページの情報を説明する要素が含まれており、これは検索エンジンで使用されます。head 要素のプロパティを設定することで、ページの識別方法をコントロールできます。

ヘッドコンテンツの表示と編集

ドキュメントの head セクションのエレメントは、コードビューか、コードインスペクターを使用して表示できます。

ドキュメントのheadセクションに要素を挿入する

挿入/HTML から head タグを選択します。

表示されるダイアログボックス、またはプロパティインスペクターで 要素のオプションを入力します。

ドキュメントの head セクションの 要素を編集する

head エレメントは、コードビュー、またはプロパティインスペクターでコードを直接入力して編集できます。

プロパティインスペクターを使用して head セクションのエレメントを編集するには:

DOM パネル(ウィンドウ/DOM パネル)で head エレメントを選択します。 

プロパティインスペクターに、選択したエレメントのプロパティが表示されます。

プロパティインスペクターで要素のプロパティを 設定または変更します。

ページの meta プロパティを 設定する

meta タグは、 文字エンコーディング、作成者、著作権、 キーワードなど、現在のページに関する情報を記録する head 要素です。これらのタグは、有効期限、リフレッシュ間隔、 ページの POWDER レーティングなど、サーバーに情報を提供するためにも使用できます。(POWDER(Protocol for Web Description Resources)は、 映画レーティングなどのレーティングを web ページに割り当てる方法を提供します。)

meta タグの追加

挿入/メディア/メタを選択します。

表示されるダイアログボックスでプロパティを指定します。

既存の meta タグの編集

meta エレメントは、コードビュー、またはプロパティインスペクターでコードを直接入力して編集できます。

プロパティインスペクターを使用して meta セクションのエレメントを編集するには:

DOM パネル(ウィンドウ/DOM パネル)で head エレメントを選択します。 

プロパティインスペクターに、選択したエレメントのプロパティが表示されます。

DOM パネルから meta タグを選択します。

プロパティインスペクターでプロパティを指定します。

Attribute

meta タグにページに関する 説明情報(name)または HTTP ヘッダー情報(http-equiv)が含まれているかどうかを指定します。

このタグで提供する情報のタイプを 指定します。descriptionkeywordsrefresh などの一部の値は既に明確に定義されていますが(Dreamweaver では個別のプロパティインスペクターがあります)、 実質的に任意の値(例:creationdatedocumentIDlevel)を指定できます。

コンテンツ

実際の情報を指定します。 たとえば、値に level を指定した場合、コンテンツには beginnerintermediateadvanced を指定することができます。

ページタイトルの設定

タイトルプロパティは、ページタイトル 1 つだけです。 ページタイトルは、次のいずれかの方法を使用して編集できます。

  • コード内でタイトルを直接編集する(コードビュー)
  • DOM パネルで title タグを選択し、プロパティインスペクターでタイトルを編集する

ページのキーワードの指定

多くの サーチエンジンロボット(検索エンジンがインデックス作成するための情報を収集して web を自動的にブラウズするプログラム)は、キーワード meta タグの 内容を読み取り、その情報を使用してデータベース内のページをインデックス作成します。 一部のサーチエンジンでは、インデックス作成するキーワードや文字数が制限されていたり、制限を超えるとすべてのキーワードを無視したりするため、 適切に選択された少数のキーワードを使用することをお勧めします。

キーワード meta タグの追加

挿入/HTML/キーワードを選択します。

表示されるダイアログボックスで、 カンマで区切られたキーワードを指定します。

キーワード meta タグの編集

キーワード meta 詳細は、次のいずれかの方法を使用して編集できます。

  • コード内(コードビュー)でキーワードを直接編集します
  • DOM パネルでキーワードの meta タグを選択し、プロパティインスペクターでキーワードを表示、変更、または削除します。
メモ

キーワードはコンマで区切る必要があります。

ページの詳細の指定

多くのサーチエンジンロボット(サーチエンジンが インデックス作成するための情報を収集して web を自動的にブラウズするプログラム)は、説明 meta タグの内容を読み取ります。 一部はその情報を使用してデータベース内のページをインデックス作成し、 一部は検索結果ページにその情報を表示します(ドキュメントの最初の数行を表示する代わりに)。一部のサーチエンジンでは インデックス作成する文字数が制限されているため、説明を数語に制限することをお勧めします(例:Pork barbecue catering in Albany, Georgia 、または Web design at reasonable rates for clients worldwide)。

詳細 meta タグの追加

挿入/HTML/詳細を選択します。

表示されるダイアログボックスに説明文を入力します。

詳細 meta タグの編集

meta 詳細は、次のいずれかの方法を使用して編集できます。

  • コード内(コードビュー)で詳細を直接編集します
  • DOM パネルで詳細の meta タグを選択し、プロパティインスペクターで詳細を編集します。

ページのリフレッシュプロパティを 設定する

リフレッシュ要素を 使用して、一定時間後にブラウザーが自動的にページをリフレッシュする(現在のページをリロードするか、別の ページに移動する)ように指定します。この要素は、URLが変更されたことを示すテキストメッセージを表示した後、ユーザーを1つのURLから別のURLにリダイレクトするためによく使用されます。

更新 meta タグの追加

挿入/メディア/メタを選択します。

表示されるダイアログボックスで、プロパティを次のように指定します。

Attribute

meta タグに HTTP ヘッダー情報(http-equivalent)が含まれることを指定します。

Value

このタグで提供する情報のタイプが refresh であることを指定します。

Content

ブラウザーがページを更新するまでの待ち時間(秒)を指定します。 ブラウザーのロード終了後すぐにページを更新するには、このボックスに「0」を入力します。

更新 meta タグの編集

更新 meta タグは、次のいずれかの方法を使用して編集できます。

  • コード内(コードビュー)でプロパティを直接編集します
  • DOM パネルまたはコード内で更新の meta タグを選択し、プロパティインスペクターでプロパティを編集します。

ベース meta タグの編集

ページ内のすべてのドキュメント相対パスの基準と見なされるベース URL を設定するために使用される、ベースエレメントを編集できます。

DOM パネルでベースエレメントを選択します。

プロパティインスペクターで、Base meta タグの プロパティを指定します。

Href

ベースの URL です。 「参照」ボタンをクリックしてファイルを参照して 選択するか、ボックスにパスを入力します。

ターゲット

リンクされたすべてのドキュメントを開くフレームまたはウィンドウを指定します。現在のフレームセット内のいずれかのフレーム、または以下の予約名のいずれかを選択します:

  • _blank は、リンクされたドキュメントを新しい名前のないブラウザーウィンドウに読み込みます。

  • _parent は、リンクされたドキュメントを、リンクを含むフレームの親フレームセットまたはウィンドウに読み込みます。リンクを含むフレームがネストされていない場合は、_top と同等になり、リンクされたドキュメントはブラウザーウィンドウ全体に読み込まれます。

  • _self は、リンクされたドキュメントをリンクと同じフレームまたはウィンドウに読み込みます。この Target はデフォルトなので、通常は指定する必要がありません。

  • _top は、リンクされたドキュメントをブラウザーウィンドウ全体に読み込み、すべてのフレームを削除します。

現在のドキュメントと別のファイルとのリレーションシップを定義する link タグを編集できます。

メモ

head セクション内の link タグは、body セクション内のドキュメント間の HTML リンクとは異なります。

DOM パネルまたはコードビューでリンクエレメントを選択します。

プロパティインスペクターで、リンク Meta タグのプロパティを指定します。

Href

関係を定義するファイルの URL。「参照」ボタンをクリックしてファイルを参照して選択するか、ボックスにパスを入力します。この属性は、通常の HTML の意味でリンクしているファイルを示すものではないことに注意してください。Link 要素で指定される関係はより複雑です。

ID

リンクに固有の識別子を指定します。

タイトル

リレーションシップの説明を入力します。 この属性は、リンクされたスタイルシートに対して特別な関連性を持ちます。詳細については、World Wide Web Consortium の web サイト www.w3.org/TR/REC-html40/present/styles.html#style-external にある HTML 4.0 仕様の External Style Sheets セクションを参照してください。

Rel

現在のドキュメントと Href ボックス内のドキュメントとの関係を指定します。使用可能な値には、AlternateStylesheetStartNextPrevContentsIndexGlossaryCopyrightChapterSectionSubsectionAppendixHelpBookmark があります。複数の関係を指定するには、値をスペースで区切ります。

Rev

現在のドキュメントと Href ボックス内のドキュメントとの逆の関係(Rel の反対)を指定します。使用可能な値は Rel と同じです。