【Adobe CS6】HTML5/CSS3やモバイルへの対応を強化『Dreamweaver CS6』

access_time create folderデジタル・IT
【Adobe CS6】HTML5/CSS3やモバイルへの対応を強化『Dreamweaver CS6』

アドビ システムズが5月11日に発売するデザイン・開発向けソフトウェア製品群『Creative Suite 6』(以下『CS6』)。ウェブ用オーサリングツール『Dreamweaver CS6』では、『CS5.5』から盛り込まれたHTML5/CSS3への対応を強化しているほか、モバイルアプリケーションプラットフォーム『PhoneGap』やjQuery Mobileなどモバイル向けの対応を強化しているのがポイントです。

『可変グリッドレイアウト』の機能を追加

スマートフォンやタブレット、パソコンなど複数の画面サイズに対して、画面レイアウトを切り替えて対応する『可変グリッドレイアウト』の機能が追加されました。これは、『CS5.5』で対応したCSS3のMedia Queryを利用して、スクリーンサイズごとにCSSファイルを切り替えて表示させるデザイン作業をより簡単に可能にしています。

新規作成で可変グリッドレイアウトを作成

具体的には、新規ドキュメントで「可変グリッドレイアウト」を選択できるようになり、スクリーンサイズごとに表示されるグリッドにボックスを吸着させて直感的にレイアウト作業を進められます。編集中は「スマートフォン」「タブレット」「パソコン」の3種類のボタンでスクリーンサイズを切り替えて作業が可能。

CSS3のトランジションに対応

ユーザーインタフェースのアニメーション効果を持たせるCSS3のトランジションは、パネルから設定が可能になりました。ターゲットにするdivタグのIDを指定し、トランジションを有効にする操作、効果、タイミング、終了値などを指定すれば、CSS3のコードを書いたり、ブラウザごとの挙動を指定しなくてもアニメーション効果を付加できます。

jQuery Mobileテーマに対応

jQuery Mobileへの対応では、カラーテーマやボタンなどをセットにしたスウォッチからテーマを選択可能になりました。テーマや位置のカスタマイズがパネル上で可能なほか、『Fireworks』で作成したテーマも利用できます。

クラウドサービス『PhoneGap:Build』への連携を可能に

HTML5ベースのモバイルアプリケーションプラットフォーム『PhoneGap』への対応では、クラウドサービス『PhoneGap:Build』への連携を可能に。『PhoneGap』に必要なソフトウェア開発キット(SDK)をローカルに持たなくても、js/css/htmlファイルをアップロードすれば、iOSやAndroid、BlackBerry向けのアプリをクラウド上でビルドしてダウンロードが可能になります。「PhoneGap:Build サービス」のパネルから利用でき、パネルからはエミュレータの起動や端末にダウンロードするためのQRコードを表示することも可能。

『CS6』関連記事は下記の記事にリンクをまとめていますのでご覧ください。

アドビ システムズがデザイン・開発向けソフト製品群『CS6』とサブスクリプション形式のクラウドサービス『Creative Cloud』を発表
https://getnews.jp/archives/196213

  1. HOME
  2. デジタル・IT
  3. 【Adobe CS6】HTML5/CSS3やモバイルへの対応を強化『Dreamweaver CS6』
access_time create folderデジタル・IT

shnsk

宮原俊介(編集主幹) 酒と音楽とプロレスを愛する、未来検索ブラジルのコンテンツプロデューサー。2010年3月~2019年11月まで2代目編集長を務める。ゲームコミュニティ『モゲラ』も担当してます

ウェブサイト: http://mogera.jp/

TwitterID: shnskm

  • ガジェット通信編集部への情報提供はこちら
  • 記事内の筆者見解は明示のない限りガジェット通信を代表するものではありません。