2017年3月11日（土）にベルサール神田で開催したCSS Nite LP51「Reboot Dreamweaver」のフォローアップとして、北村 崇さん（TIMING DESIGN）、浅野 桜さん（タガス）の『いまどきのPhotoshopとDreamweaverとの連携』セッションのスライドなどを公開します。
メッセージと補足
コメント（北村さん）
皆さまお疲れ様でした。私自身、Webデザインをまだ全く知らない時に、初めて触ったのがDreamweaverでした。その時は私も「ドリームウェーバー」だと思い込んでいた内の一人です（笑）
今回はデータの作り方と考え方、そしてDreamweaverとの連携方法を短い時間の中でお話ししましたが、デザイナーとコーダーの連携はアプリケーション間だけではなく、コミュニケーション上でも大事だと思っています。
これを機に、「データの受け渡し方法」や「データ作りのルール」などを社内やチームで見直して、より円滑なワークフローを探して頂ければと思います。
コメント（浅野さん）
Dreamweaverは初心者からベテラン、デザイナーからエンジニアまでさまざまなユーザーの業務に適応できるアプリだと改めて実感しました。
一方で、轟さんのセッションの"ヤシドリ作戦"で私のExtractへの要望をお見せしましたが、まだまだ改善点があるのも事実。今後もユーザー全員で盛り上げていければいいですね。
アンケート等の質問について
Q.ビール本の正式名称
A.『Webデザイン必携。 プロにまなぶ現場の制作ルール84』
Q.レイヤー名の順序が違う（フッター→メイン→ヘッダー）場合もあるがそれはいいのか？
A.ルールが明確で、コーダーとの意思疎通に問題なければ、いいと思います。
Q.レイヤー名、手打ちですか？
A.手打ちですが、一括でレイヤー名を変更するスクリプト等もありますので、使ってみても良いと思います。 Group Layer Renaming
Q.手順がよくわからなかった。
A.最後のBootstrapを使うデモはアドビで紹介されているワークフローを元に、簡潔な形へ変更してご紹介しました。手順の概要は以下の通りです。
- DreamweaverでBootstrapを使ってサイトを作成しておく
- 「スニペット」パネルの「Bootstrap snippets」→「responsiveimages」を参照して、img タグにresponsiveimageのclassをあてる。
- ライブビューのビジュアルメディアクエリバーをクリックし、ライブビューでimgの画像右クリックすると「エレメントを隠す」という項目」が現れるので選択すると、classが自動で追加されて表示非表示を切り替えられる。
Q.「レスポンシブイメージ」という単語が出たが、HTML5実装のレスポンシブイメージではない？
A.今回ご紹介したサイズを変えながらの画像指定は、HTML5でのpicture要素などではなくBootstrapでのCSS実装になります。この点は新しい機能としてHTMLも是非追加して欲しいですね。
デモデータ
このセッションは「CSS Niteベストセッション2017」にてベスト・セッション10に選ばれました。
ベストセッション2019
2019年、CSS Niteでは49回の関連イベントを通して123セッションが行われました。その中からベスト・セッション＋αを選びました。
