最先端のWeb標準技術やデバイス環境に対応へ
Flash CS5＆Dreamweaver CS5 最新アップデート情報
今月号の記事
技術の進歩、デバイスの進化。クリエイターを取り巻く環境は劇的にそして急激に変化しています。アドビとしては、そうした状況でもクリエイターが皆さんが対応していけるように、才能を十分に発揮できるようにと、様々な観点からサポートしていきたいと考えています。その1つが、先月末に発売されたCreative Suite 5 Web Premiumです。しかし、最新バージョンをリリースしたら、それで終わりではありません。CS5をより最先端のWeb標準技術やデバイス環境に対応させるべく、早くもアップデートを公開しました。本記事では、
- HTML/CSS/JavaScriptオーサリングアップデート
- Flashアップデート
の２つの切り口から、最新情報をお届けします。
HTML/CSS/JavaScriptオーサリング アップデート
HTML5 Pack for Dreamweaver
まず大きなアップデートとして、5月のGoogle I/Oでアドビ システムズ CTOケビン・リンチが発表したように、Dreamweaver CS5向けにHTML5 Pack for DreamweaverというHTML5/CSS3開発環境を拡張機能として提供いたしました。Creative Suite 5、もしくはDreamweaver CS5に同梱されるAdobe Extension Manager CS5経由で当拡張機能をインストールすると、コードヒントやWYSIWYGでスマートフォン、タブレット、デスクトップなどのマルチスクリーン開発を確認できるメディアクエリービューなどを利用して、HTML5/CSS3開発を支援します。また、新規ドキュメントから始める際にもHTML5ドキュメントを選択でき、現時点でHTML5/CSS3の開発をする際に最も有効なアシスト機能をご利用いただけます。
HTML5 Pack for Dreamweaver でご利用いただける機能
- マルチスクリーン プレビュー パネル
メディアクエリーを利用し、３パターンのスクリーンを同時にプレビュー可能 - HTML5コードヒンティング(タグ、属性、プロパティ対応)
- 既存HTMLコードヒンティング強化(新規属性、値対応)
- CSS3コードヒント
- 2D/3Dトランスフォーメーション(2D/3D Transformations)
- アニメーション(Animation)
- 背景(Background)
- ボーダー(Border)
- Basic UI
- ラインレイアウト(Line Layout)
- マーキー(Marquee)
- メディアクエリー(Media Queries)
- マルチカラム(MultiColumn)
- Ruby
- テキスト(Text)
- トランジション(Transitions)
- ライブビューの<video>、<audio>タグサポート(要QuickTime)
- ライブビュー CSS3レンダリング向上
- HTML5[新規ドキュメント]２種類追加
- デザインビューの新規タグ レンダリング向上
iPhone、iPadなどの新規デバイス向けWebサイトを制作する際、また、デスクトップだけではなく携帯、スマートフォン、タブレットなどマルチデバイス向け開発をクライアントから要求されるケースが増加する現在、当拡張機能をご利用いただければと思います。
関連情報
Widget Browser
JavaScriptを駆使してWebサイトをよりリッチに効果的に演出したいと考えていても、なかなか学ぶ時間がない、どこを参照すればよいのかわからない、Dreamweaverを利用しているが簡単にAjax効果をつけたい、というユーザー様の声を多数いただいております。その回答になると思われるのがAdobe Labsで提供開始したWidget Browserです。スライドショーやトランジション、LightBoxなどのAjaxウィジェットをWidget Browser上で確認し、好みのウィジェットをお試しいただいた後、利用するものだけをダウンロードもしくはDreamweaverの挿入パネルからドラッグ&ドロップで取り込むだけで、お好みのAjax効果を挿入できます。Adobe AIRベースのアプリケーションなのでDreamweaverをお持ちでない方もご利用可能です。
Widget Browserに登録されているウィジェットはHTML/CSS/JavaScriptで作られており、Adobe Exchange経由で配布されるので、全世界から集められたウィジェットが確認できます。
また、自作のお気に入り、自身のウィジェットがある場合は、Adobe Exchangeに登録することにより全世界のユーザーに配布可能です。
※アドビはOpen Ajax Alliance、Open Ajax Metadataに基づいたウィジェットを支援しております。ウィジェットを登録する場合にはopenajax.orgを確認してください。
Dreamweaver CS5と一緒にご利用いただくと、より効率よくウィジェットをサイトに追加可能です。Widget Browserで確認し、選んだウィジェットを[Add to My Widget]からお気に入りに登録するだけで、Dreamweaverの[挿入]パネルの[Widget]からDreamweaverドキュメントに追加することができます。
関連するHTML、JavaScript、CSSファイルを直接読み込めますので、そのままコードビューやライブビューを利用してコーディングが続けられます。
※Widget Browserをご利用いただくには、Adobe IDが必要です。
Omniture Test&Targetとの連携
ターゲットとしているユーザーに的確に伝えるWebサイトを作るには、テストとターゲット分析が必要になります。OmnitureのTest&Targetを利用すると、デザインパターン、キャッチコピーを複数用意して、ターゲットとしているユーザーに何が響くのか試すことにより、コンバージョンの向上とROIの計測を実現するのが容易になります。Dreamweaver CS5ではOmniture Test&Targetサービスとの連携が可能になりました。拡張機能をインストールするとOmniture Test&Targetパネルが利用できるようになり、テストパターンを設定できるようになります。
いままで専用のJavaScriptコードを挿入し、Mboxやオファーなどを設定する必要がありましたが、これからはデザインビューで確認しながら作業効率よく設定できるようになります。 デザイナーの方でもパターン登録が可能になるとともに、Webマーケターの方が必要な設定を行う際にもご利用いただけます。
TEST&TARGET EXTENSION FOR DREAMWEAVER CS5
Flashアップデート
Flash Player 10.1 & Flash Professional CS5向けAIR for Android 拡張機能
6月18日にPC版、22日にモバイルパートナー向けの配布を開始したFlash Player 10.1、当リリースの最大の目玉はFlash再生環境がスマートフォンなどデスクトップ以外の他デバイスでも実現できるようになったことです。技術的努力としては、CPU使用率を極力おさえ、パフォーマンスよくFlashコンテンツを視聴できるように、また、Open Screen Projectを通じてGoogle、RIMなどのパートナーとも協力し、より多くのモバイル環境でFlashが再生できるように進めております。
以下プレスリリースより抜粋
Flash Player 10.1にてスマートフォン向けのブラウザー閲覧環境を提供するとともに、Flash Pro CS5を利用してAndroid向けアプリケーション.apkファイルを作成できるFlash Professional CS5向けAIR for Android 拡張機能も提供開始しました。
こちらはlabs.adobe.comでオンライン上のNDAを締結していただくことにより参加できるプライベートプレリリースとなりますが、いち早くFlash Proを利用してAndroid向けアプリケーションの制作をお試しいただきたい方に最適です。
関連情報
Omniture Test&Target / SiteCatalystとの連携
Flash利用のキャンペーン、コーポレートサイトを作る際の効果測定、そしてA/Bテスト などのパターン分析を行う際にご利用いただけるOmniture SiteCatalystとTest&Targetに、Flash Proツールからアクセスできるようになりました。専用の拡張機能を入れるとFlash Pro内にパネルが登場し、OmnitureのTest&TargetとSiteCatalystにアクセスできるようになります。テキスト、画像、ムービークリップすべてをトラック対象として登録できるようになったため、より効率よくトラッキング変数のマッピング、そしてコンバージョンの最適化、ROI計測、A/Bテストや多変数テストを視覚的に実装することができるようになります。
