アフィリエイト

以下詳細です。

関連ファイルおよびコードナビゲータ

Dreamweaver CS4 では、最新の Web ページを構成するために使用されるさまざまなファイルを効率よく管理できます。関連ファイルをクリックすると、コードビューにそのファイルのソースが表示されるのに加え、デザインビューには親ページが表示されます。新機能のコードナビゲータには、現在選択している対象に影響を及ぼすすべてのコードソース (CSS (カスケーディングスタイルシート) ルール、サーバーサイドインクルード、外部 JavaScript 関数、Dreamweaver テンプレート、iFrame ソースファイルなど) が一覧表示されます。

実際に確認してみました。まずは関連ファイルですが、とりあえず今取り掛かっているサイトの中のindex.htmlをクリックしてみました。

このindex.htmlには外部CSS「styles.css」をリンクしてある状態になっています。結果、下の画像のようにindex.htmlに関連しているファイルとしてタブが作成され簡単に参照出来るようになっているのが分かります。

このように、Dreamweaver CS4では、htmlファイルを開くと、それに関連しているCSSやJavascriptのファイルやソースが2階層まで見られて、編集もできる機能が搭載されています。

この新機能はかなり便利です。特にページごとに外部CSSを使い分けている場合には、さらに便利さを実感できるかと思います。ありそうでなかった機能、といった印象でした。

コードナビゲータ

そして次はコードナビゲータですが、デザインの画面でCSSが適用されている任意の場所（タイトルロゴであったりメニューボタンであったり）をクリックし、マウスを数秒間動かさずに止めていると、船の舵のようなアイコン（コードナビゲータのインジケータ）が現れます。

このアイコンをクリックすると、ドキュメントのソースコードや適用しているCSSがリストとして表示され、編集をしたい項目をクリックすれば、編集画面が現れ、そのまま編集をすることが可能になっています。

これも大変便利な機能です。ただこのインジケータのアイコンは自分が望まない時も現れてしまう時が多々あります。

そのような時は、インジケータを無効にするにチェックを入れ、自分が必要な時に「Alt」キーを押しながらクリックして表示させるのが良いでしょう。

今回紹介した新機能は派手さはありませんが、とても親切な機能でますますDreamweaverが使いやすくなったと思います。