- Dreamweaver ユーザーガイド
- はじめに
- Dreamweaver と Creative Cloud
- Dreamweaver のワークスペースとビュー
- サイトの設定
- ファイルの管理
- レイアウトとデザイン
- CSS
- ページコンテンツとアセット
- ページプロパティの設定
- CSS 見出しプロパティおよび CSS リンクプロパティの設定
- テキストの操作
- テキスト、タグ、属性の検索と置換
- DOM パネル
- ライブビューでの編集
- Dreamweaver でのドキュメントのエンコード
- ドキュメントウィンドウでのエレメントの選択および表示
- プロパティインスペクターでのテキストプロパティの設定
- web ページのスペルチェック
- Dreamweaver での区切り線の使用
- Dreamweaver でのフォントの組み合わせの追加と変更
- アセットを使用した作業
- Dreamweaver での日付の挿入と更新
- Dreamweaver でのお気に入りアセットの作成と管理
- Dreamweaver でのイメージの挿入と編集
- メディアオブジェクトの追加
- Dreamweaver でのビデオの追加
- HTML5 ビデオの挿入
- SWF ファイルの挿入
- オーディオエフェクトの追加
- Dreamweaver での HTML5 オーディオの挿入
- ライブラリ項目の操作
- Dreamweaver でのアラビア語およびヘブライ語のテキストの使用
- リンクおよびナビゲーション
- jQuery Widget と効果
- web サイトのコーディング
- Dreamweaver でのコーディングについて
- Dreamweaver のコーディング環境
- コーディングの環境設定
- コードカラーリングのカスタマイズ
- コードの記述と編集
- コードヒントとコード補完機能
- コードの折りたたみと展開
- スニペットでコードを再利用する
- 構文チェックコード
- コードの最適化
- デザインビューでのコードの編集
- ページのヘッドコンテンツの操作
- Dreamweaver でのサーバーサイドインクルードの挿入
- Dreamweaver でのタグライブラリの使用
- Dreamweaver へのカスタムタグの読み込み
- JavaScript ビヘイビアーの使用(基本操作)
- JavaScript に組み込まれているビヘイビアーの適用
- XML および XSLT について
- Dreamweaver でのサーバーサイド XSL 変換の実行
- Dreamweaver でのクライアントサイド XSL 変換の実行
- Dreamweaver での XSLT の文字エンティティの追加
- コードのフォーマット
- 製品間ワークフロー
- テンプレート
- Dreamweaver テンプレートについて
- テンプレートおよびテンプレートから作成されたドキュメントの認識
- Dreamweaver テンプレートの作成
- テンプレート編集可能領域の作成
- Dreamweaver でのリピート領域およびテーブルの作成
- テンプレートの任意の領域の使用
- Dreamweaver での編集可能なタグ属性の定義
- Dreamweaver でネストされたテンプレートを作成する方法
- テンプレートの編集、更新、削除
- Dreamweaver での xml コンテンツの書き出しおよび読み込み
- 既存のドキュメントでのテンプレートの適用または削除
- Dreamweaver テンプレートでのコンテンツの編集
- Dreamweaver でのテンプレートタグのシンタックスルール
- テンプレート領域のハイライト表示の環境設定
- Dreamweaver でテンプレートを使用する利点
- モバイルとマルチスクリーン
- 動的サイト、ページおよび web フォーム
- web アプリケーションについて
- アプリケーション開発のためのコンピューター設定
- データベース接続のトラブルシューティング
- Dreamweaver での接続スクリプトの削除
- 動的ページのデザイン
- 動的コンテンツソースの概要
- 動的コンテンツのソースの定義
- ページへの動的コンテンツの追加
- Dreamweaver での動的コンテンツの変更
- データベースのレコードの表示
- Dreamweaver でのライブデータの入力とトラブルシューティング
- Dreamweaver でのカスタムサーバービヘイビアーの追加
- Dreamweaver を使用したフォームの作成
- フォームを使用したユーザーからの情報の収集
- Dreamweaver での ColdFusion フォームの作成と有効化
- web フォームの作成
- フォームエレメントの HTML5 サポート強化
- Dreamweaver を使用したフォームの開発
- アプリケーションのビジュアル開発
- web サイトのテスト、プレビュー、パブリッシュ
- トラブルシューティング
サイトのテストに関するガイドラインについて説明し、レポートを使用して、サイトをアップロードする前に Dreamweaver サイトをテストします。
サイトのテストに関するガイドライン
サーバーにアップロードして他の人に公開する前に、 ローカルの環境でサイトの動作を確認することを お勧めします。サイトの構築中に頻繁に テストとトラブルシューティングを行うことにより、問題を早期に発見し、 その再発を防止することができます。
ターゲットのブラウザーでページが予想どおりに表示されて機能すること、 リンクが破損していないこと、 ページのダウンロードに時間がかかり過ぎないことを確認します。また、サイトレポートを実行して、 サイト全体のテストおよびトラブルシューティングを行うこともできます。
以下のガイドラインは、 サイトを訪問するビジターに快適に閲覧してもらうためのヒントです。
ページがターゲットブラウザーで 正しく機能することを確認します。
スタイル、レイヤー、プラグイン、 JavaScript をサポートしていないブラウザーでも、 ページが見やすく、かつ機能することを確認します。古いバージョンのブラウザーで正しく表示されないページについては、 「チェックブラウザー」ビヘイビアーを使って、 ビジターを自動的に他のページに移動することもできます。
様々なブラウザーおよびプラットフォームで ページをプレビューします。
これにより、ターゲットブラウザーチェックでは わからないレイアウト、カラー、フォントサイズ、初期設定ブラウザーウィンドウサイズの 違いを確認できます。
サイトをチェックして、 破損リンクがあれば修正します。
他のサイトでもデザインの変更や 再構成が行われている可能性があるため、リンク先のページが移動したり、削除されている可能性があります。 リンクチェックレポートを実行してリンクをテストできます。
ページのファイルサイズ およびダウンロードに必要な時間を確認します。
大きなテーブルが含まれているページは、 ブラウザーによっては、テーブル全体のダウンロードが 終わるまで何も表示されません。 こういった場合はテーブルを分割することをお勧めします。 分割できない場合は、ページの上部、テーブルの外側に Welcome メッセージや 広告バナーなどのサイズの小さいコンテンツを置いて、 テーブルのダウンロード中でもこれらのマテリアルが表示されるようにします。
サイトレポートを数回実行し、 サイト全体のテストおよびトラブルシューティングを行います。
これにより、 サイト全体をチェックして、無題ドキュメント、空のタグ、 重複してネストされたタグなどの問題を確認できます。
コードを検証し、 タグやシンタックスエラーを見つけます。
パブリッシュ後の サイトを更新および維持します。
サイトのパブリッシュとは、 サイトを第三者に広く利用してもらうことです。 サイトのパブリッシュは継続的なプロセスであり、様々な方法で行うことができます。サイトのパブリッシュでは、Dreamweaver のツールや外部の バージョンコントロール用アプリケーションを使って、 バージョンコントロールシステムを定義および実行するプロセスが重要です。
ディスカッションフォーラムを使用します。
Dreamweaver ディスカッショングループは、 アドビの web サイト(_jpwww.adobe.com/go/dreamweaver_newsgroup)で開催されています。
ディスカッショングループは、 他のブラウザーやプラットフォームなどの 情報を得るのに最適なリソースです。他の Dreamweaver ユーザーと技術的な問題について 話し合ったり、役に立つヒントを共有したりできます。
パブリッシュ問題の トラブルシューティングに関するチュートリアルについては、www.adobe.com/go/vid0164_jp を参照してください。
レポートを使用したサイトのテスト
ワークフローまたは HTML 属性についての サイトレポートを実行できます。また、「レポート」コマンドを使用してサイト内のリンクを チェックできます。
ワークフローレポートを使用すると、 web チームのメンバーが共同で行う作業を効率化できます。誰がファイルをチェックアウトしたか、どのファイルがデザインノートと 関連付けられているか、どのファイルが最近変更されたかを示すワークフローレポートを 実行することができます。名前、値などのパラメーターを指定することで、 デザインノートのレポートをより詳細にすることができます。
ワークフローレポートを実行するように 定義されたリモートサイトへの接続が必要です。
HTML レポートを使用して、 様々な HTML 属性のレポートをコンパイル および生成できます。結合可能なネストフォントタグ、 代替テキストの欠損、重複してネストされたタグ、削除可能な空のタグ、 無題ドキュメントなどをチェックすることができます。
実行したレポートを XML ファイルとして保存し、 テンプレートインスタンス、データベースまたはスプレッドシートに読み込んで、 印刷したり web サイトで表示することができます。
Adobe Dreamweaver Exchange web サイトを利用して、 他のレポートタイプを Dreamweaver に 追加することもできます。
レポートを使ったサイトのテスト
-
サイト/レポートを選択します。
-
レポート内容ポップアップメニューからレポートの対象を選択し、 実行するレポートタイプ(ワークフローまたは HTML)を設定します。
「サイト内の選択したファイルを検査」を選択してレポートを作成するには、 先にファイルパネルでファイルを選択しておく必要があります。
-
ワークフローレポートを選択した場合は、「レポート設定」をクリックします。 それ以外の場合は、この手順を省略します。注意:
複数のワークフローレポートを選択した場合は、 レポートごとに「レポート設定」ボタンをクリックします。レポートを 1 つ選択し、 「レポート設定」をクリックして設定を入力します。 別のワークフローレポートに対しても同じ処理を繰り返します。
チェックアウトユーザー
特定のチームメンバーがチェックアウトしたすべてのドキュメントのリストを表示する レポートが作成されます。チームメンバーの名前を入力し、 「OK」をクリックしてレポートダイアログボックスに戻ります。
デザインノート
選択したドキュメントまたはサイトのすべてのデザインノートのリストを表示する レポートが作成されます。名前と値のペアを入力し、 ポップアップメニューから対応する条件を選択します。「OK」をクリックして、 レポートダイアログボックスに戻ります。
最近修正したファイルを選択
指定した期間中に変更されたファイルのリストを表示するレポートが 作成されます。表示するファイルの日付の範囲と場所を 入力します。
-
HTML レポートを選択した場合、 次のレポートから選択します。
結合可能なネストフォントタグ
コードのクリーンアップ時に結合可能なネストフォントタグのリストを 表示するレポートが作成されます。
例えば、<font color="#FF0000"><font size="4">STOP!</font></font> がレポートされます。
代替テキストなし
代替テキストを持たない img タグの リストを表示するレポートが作成されます。
代替テキストとは、画像を含むページを、 テキスト専用ブラウザーまたは画像を手動で ダウンロードするように設定されたブラウザーで表示したときに、画像の代わりに表示されるテキストのことです。スクリーンリーダーは代替テキストを読み上げます。 また、一部のブラウザーでは、ユーザーが画像上にマウスを置いたときに 代替テキストが表示されます。
重複してネストされたタグ
クリーンアップ対象のネストタグについての詳細なレポートが 作成されます。
例えば、<i> The rain <i> in</i> Spain stays mainly in the plain</i> のような 記述はレポート対象です。
削除可能な空のタグ
HTML コードのクリーンアップ時に削除可能なすべての空のタグについての 詳細なレポートが作成されます。
例えば、コードビューで様々なアイテムや 画像を削除した場合に、削除したアイテムに付属するタグがドキュメントに 残ってしまうことがあります。
無題ドキュメント
選択パラメーター内に含まれるすべての無題ドキュメントのリストを 表示するレポートが作成されます。Dreamweaver により初期設定のタイトルが付いたドキュメント、 title タグが複数あるドキュメント、または title タグのないドキュメントが すべてレポートされます。
-
「実行」をクリックして、レポートを作成します。
実行するレポートのタイプに応じて、ファイルの保存、 サイトの定義、またはフォルダーの選択(選択していない場合)などの操作を 行うよう要求されます。
結果パネルグループのサイトレポートパネルに 結果のリストが表示されます。
レポートの使用および保存
-
レポートを実行 します(詳しくは、前の手順を参照してください)。
-
サイトレポートパネルで以下のいずれかの操作を行って、 レポートを表示します。
結果の並べ替えの基準にする列の見出しをクリックします。
ファイル名、行番号、説明を基準に並べ替えることができます。複数の異なるレポートを作成し、それぞれのレポートを別々に表示させたままにすることもできます。
問題の説明を表示するには、レポート内の任意の行を選択し、サイトレポートパネルの左の「詳細情報」ボタンをクリックします。
レポート内の任意の行をダブルクリックすると、ドキュメントウィンドウ内に対応するコードが表示されます。
注意:デザインビューで表示している場合は、Dreamweaver により表示が自動的に分割ビューに切り替えられ、報告される問題がコードで表示されます。
-
「レポートの保存」をクリックして、レポートを保存します。
レポートの保存時に、既存のテンプレートファイルにレポートを 読み込むことができます。その後、データベースやスプレッドシートにそのテンプレートファイルを読み込んで印刷したり、 web サイトでレポートを表示したりできます。
注意:HTML レポートを作成した後は、「HTML のクリーンアップ」コマンドを実行し、 レポートに出力された HTML エラーを修正します。