Adobe Dreamweaver では、オブジェクトスタイルなどのデザインツールや柔軟な制作管理ツールを使用して、クロスメディアにも対応した高品質なページをすばやく作成、出力することができます。

また、CSS インスペクトツールによるデザイン、コンテンツ管理システムによる開発、Adobe CS Live の新しいオンラインサービスである Adobe BrowserLab との連携による高速で正確なブラウザー互換性テストが可能です。CS Live サービスは、一定期間無償でご利用いただけます。 

[ 主な特長 ]

次世代 web 環境を構築

ライブビュー

Dreamweaver では、ブラウザと同様の表示を再現するライブビュー機能が利用できます。ライブビューがデザインビューと異なる点は、実際のブラウザ上にページが表示される様子を編集できないビューとして、より正確にレンダリングできることです。

デザインビューからライブビューに切り替えることは、ページをただの編集可能な状態から、動的に操作できる "ライブ" 状態に切り替えることになります。 ライブビューを使用している間、デザインビューの動作は停止しますが、コードビューでの編集操作は引き続き可能です。

 

関連ファイル

Dreamweaver では、メインドキュメントを作業の中心に据えた状態を崩すことなく、メインドキュメントに関連したファイルを表示できます。たとえば、CSS ファイルや JavaScript ファイルがメインドキュメントに添付されている場合、メインドキュメントを表示したまま、それら関連ファイルの表示および編集ができます。

コードナビゲータ

新機能のコードナビゲータには、ページ上で選択した特定範囲に関連するコードソースのリストが表示されます。ここから、たとえば内部および外部 CSS ルール、サーバーサイドインクルード、外部 JavaScript ファイル、親テンプレートファイル、ライブラリファイル、iframe ソースファイルなど、関連するコードソースへと移動できます。

 

マルチスクリーンプレビューパネル

マルチスクリーンプレビューパネルを使用して、スマートフォンやタブレット、パソコンに向けたデザインを制作できます。メディアクエリのサポートにより、1 つのパネルで様々なデバイス向けにレンダリングのスタイル設定とプレビューを行えます。

PhoneGap で Android および iOS のネイティブアプリケーションを構築

新機能の PhoneGap を利用して、Android™ および iOS のネイティブアプリケーションの構築、パッケージングを行えます。オープンソースの PhoneGap フレームワークを使用すれば、Dreamweaver 内で既存の HTML を携帯電話のアプリケーションに変換することが可能です。

jQuery の統合

jQuery コードヒントを利用して、高度なインタラクティビティを追加できます。jQuery は様々なインタラクティビティを簡単に Web ページに追加できる、業界標準の JavaScript ライブラリです。jQuery Mobile を使用すれば、Android™ や iPone™ のモバイルストア用のモバイルアプリケーションの作成も行えます。

充実の CSS サポート

既製の CSS レイアウト

最新の既製 CSS レイアウトやテンプレートを利用して、手軽に CSS を使ったプロジェクトの作成ができます。各テンプレートにはレイアウトを解説する詳細なコメントが用意されているので、すばやく使用法をマスターできます。また、テンプレートはプロジェクトの趣旨にあわせてカスタマイズすることが可能です。

ブラウザ互換性チェック

最新のブラウザ互換性チェック機能では、時間の節約はもちろん、より一貫性に優れた Web 体験をあらゆるブラウザ・オペレーティングシステムに対して提供できるようになります。また、いちいちブラウザを起動しなくても、ブラウザとの互換性に関する CSS 関連の問題点をまとめたレポートを生成することができます。

包括的な CSS パネル

CSS に関する情報が CSS パネル一箇所に表示されるので、手軽に特定の要素に適用されたスタイルの確認や、属性がどこで定義されているかを追跡できます。また、コードビューに切り換えずに、既存のスタイルの編集が可能です。

CSS のレイアウトを手軽に視覚化

CSS を使ったレイアウトを編集する際には、アウトラインの強調表示・背景色表示といったビジュアルエイドをオンにすることで、複雑になりがちなレイアウト構成の確認・選択・編集が容易にできます。また、ID や余白、マージン、ボーダーの詳細をはじめとする各レイアウトの設定値は、該当レイアウトを選択すると表示されるポップアップウィンドウ上で確認できます。

スタイルレンダリングツールバー

配信方法の違いを問わずに、コンテンツがエンドユーザに対してどのように表示されるかを確認できるので、スタイルレンダリングツールバーを利用すれば、パソコン画面、携帯デバイス、印刷出力などで、デザインがどのように表示されるかを手軽にプレビューすることができます。

CSS ベストプラクティス

コードを記述しなくても、手軽に CSS のベストプラクティスを実践できます。新しい CSS ルールはプロパティパネルで作成でき、この際、各プロパティがスタイルのカスケード上のどこに適用されるかの明快な説明を確認することができます。

CSS3 および HTML5 のサポート

スタイルの設定には、改良され新しい CSS3 ルールに対応した CSS パネルを利用できます。デザインビューではメディアクエリがサポートされるようになり、画面サイズを調整しながら様々なスタイルを適用できます。また、コードヒントやデザインビューのレンダリングサポートを利用し、将来を見据えて HTML5 でコーディングを行うことができます。ライブビューでは、<video> タグ (QuickTime を使用) と <svg> タグもサポートしています。

Ajax フレームワーク、「Spry」

Spry データ

RSS フィードやデータベースから取得した XML などを使用して、Web ページにデータを統合できます。また、統合したデータを簡単にソート・フィルタリング対応することもできます。

Spry ウィジェット

Ajax フレームワーク「Spry」のウィジェットを使えば、手軽にメニューバー、リスト、テーブル、タブ、フォーム検証、リピート可能領域といった一般的なインタフェイス要素を Web ページに追加することができます。

 

Spry エフェクト

Ajax 用の Spry エフェクトを使えば、手軽に発光、縮小、フェード、ハイライトなどの視覚的な画面遷移エフェクトをページ内の要素に追加することができます。

各種サーバ・テクノロジをオープンにサポート

最新のテクノロジをサポート

HTML、XHTML、CSS、XML、JavaScript、Ajax、PHP、Adobe ColdFusion、ASP、ASP.NET、JSP などを含む、先進の Web 開発テクノロジのサポートをしています。

手軽に XML

XSL または Ajax フレームワーク「Spry」のいずれかを利用して、すばやい XML コンテンツの統合が可能です。XML ファイルまたは XML フィードの URL を参照するだけで、対象コンテンツを表示し、必要な項目をページにドラッグ&ドロップ対応にします。

他のアドビの製品との連携

Adobe Bridge

Creative Suite のハブである Adobe Bridge を使用すると、さらに効率良いワークフローが実現します。プロジェクトのファイルやアプリケーション、各種設定にすばやくアクセスできるだけでなく、XMP メタデータのタグ付けや検索といった機能も利用することができます。

FLV のサポート

Web ページには、Flash の知識が一切なくても、わずか 5 クリックの簡単操作で FLV ファイルを追加できます。Web サイトのルック&フィールにあわせて、ビデオ再生環境をカスタマイズすることも可能です。

 

Photoshop・Fireworks との連携

Dreamweaver では、Photoshop や Fireworks からダイレクトにコピー&ペーストすることが可能です。プロトタイプ作成時のアセットをすばやく開発プロジェクト内でも利用できます。

Adobe BrowserLab との連携

Adobe BrowserLab は、完了間際のサイトのブラウザー検証に最適なオンラインサービスです。Internet Explorer、Firefox、Safari、Chrome など複数ある Web ブラウザーの種類、バージョン、オペレーションシステム環境を自分のマシンに構築することなく検証することができます。当 BrowserLab は CS Live オンラインサービスの一部として提供されます。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー