検索
特集

Bootstrap、Emmet、レスポンシブWebデザイン対応を強化したDreamweaver CC 2015を使ってみた写真素材サービスAdobe Stockも(1/2 ページ)

2015年6月16日、Adobe Creative Cloudが2015年版のメジャーアップデートを果たした。本稿ではDreamweaver CC 2015と周辺のサービスをレビューした結果を紹介する。

Share
Tweet
LINE
Hatena

 2015年6月16日、Adobe Creative Cloud(以下、Creative Cloud)が公約通り年1回のメジャーアップデートを果たした。今回さまざまな機能追加や改善、新しいサービスなどが登場している。アップデートの概要についてはニュースなどで取り上げられているので参考にしていただきたい。

 本稿では、このアップデートの中から、Web制作系アプリケーションの一つである「Dreamweaver CC 2015」と周辺サービスをレビューした結果を紹介しよう。


Dreamweaver CC 2015の公式イメージ

レスポンシブWebデザインの機能がより強化された

 Web制作業界の最近のトピックとして必ずと言っていいほど挙げられるのが、グーグルの「モバイルフレンドリーアップデート」だ。これは、「モバイルに最適化されていないWebサイトは、PageRankが低くなりますよ」といったものだ。


グーグル提供のモバイル フレンドリー テストを@ITで実行した結果

 このため今後のWeb制作には、ますますモバイル環境への対応が求められることになるだろう。モバイルフレンドリーなサイトを作る上で欠かせないといえるのが「レスポンシブWebデザイン」だ。

 Dreamweaverには以前のバージョンからレスポンシブWebデザインの機能が搭載されている。そして、Dreamweaverのプレビュー画面でもGoogle Chromeと互換性を持たせることで、実機検証の手間をできるだけ削減する努力を重ねてきた。

 Dreamweaver CC 2015では、Dreamweaver自体のウインドー幅にかかわらずプレビュー画面の大きさをドラッグで調整できる「スクラブ」が搭載された。これでプレビューウインドー内でウインドーの幅が変わったときの状態を自由に確認することが容易になった。

 また、「メディアクエリーバー」が搭載された。これは、以前はEdge Reflowなどで搭載されていたメディアクエリをビジュアライズしたものだが、コンバージョンはさらにその数値がInner Widthなのか、Outer Widthなのか分かりやすいように色分けがされるようになった。

 これとスクラブを組み合わせることで、「現在どのスタイルが適用されているのか」が分かりやすくなっている。

Copyright © ITmedia, Inc. All Rights Reserved.

       | 次のページへ
ページトップに戻る