Webプログラミングに役立つ Dreamweaverの基礎知識

Dreamweaverの基本

　Dreamweaverを初めて起動すると，「デザイナモード」と「コーダーモード」を選ぶダイアログボックスが表示されます（図1）．これは後からどちらにでも変 更できますし，パネル類の配置が替わるだけで機能的な違いはないため，どちらを選んでも構いません．ここでは「デザイナモード」を選びました．

▼図1 初回起動時にのみ表示されるモード変更ダイアログ

　なお，MacOSX版ではこの選択肢は出ず，デザイナモードにあたる「初期設定」が自動的に選択されます．起動すると図2のような画面が表示されます．中央のエディタ部分を中心に，上部にツールバー，下部にプロパティインスペクタ，そして右側にパネル類が配置されています．

▼図2 Dreamweaverの起動時画面

　それでは，ファイルを1つ作ってみましょう．［ファイル］→［新規］メニューをクリックすると，「新規ドキュメント」ダイアログボックスが表示されます．ここでは，HTMLをはじめ，ActionScript，CSS，JavaScriptやXML，ASP，ASP.NET，ColdFusion，JSP，PHPなどが選べるようになっています．

　ファイルの作成中は，図3の「ビュー」ボタンを切り替えると，HTMLのソース，デザインをそれぞれ見ることができ，両方を分割して表示することもできます．たとえば，コードビューでPHPのプログラムを打ち込みます．すると，主要な関数群の場合はコード補完も表示されます（図4）．

▼図3 ビューボタンでコードビュー・デザインビューと分割ビューを選べる

▼図4 途中まで関数を打ち込むとコードヘルプが表示される

　PHPのプログラムを打ち込み終えたら，デザイン ビューに戻ってみましょう．打ち込んだプログラムは，図5のようにアイコンとして表示されます．そのため，PHPが含まれたファイルも，デザイナが引き続き作業することができます．

▼図5 PHPプログラムのデザインビューでのアイコン

［修正］→［ページプロパティ］メニューをクリックし，「ページプロパティ」ダイアログボックスで「タイトル/エンコーディング」を選ぶと，ドキュメントタイプを変えることができます．

　HTML 4.01のTransitionalやStrictの他，XHTML1.1やXHTM　Mobile 1.0なども選ぶことができ，DOCTYPE宣言なども自動的に挿入されます．文字コードなどもここで選んで変更できます．また，既存のファイルをDreamweaverで開いたときに文字化けしてしまった場合には，ここで正しいエンコードを選んで［リロード］ボタンをクリックすれば，読み込み直すことができます．

　このように，Dreamweaverはエディタソフトとしても必要十分な機能を備えています．これだけでも，十分使う価値はあるのですが，まだまだ便利な機能があり ますので，この後は筆者を含めてDreamweaver愛好者である私たちがさまざまな角度からDreamweaverの魅力を紹介していきましょう．

ページ 2 / 10

前のページ

次のページ