Dreamweaverから消えた、アノ機能を使うには？｜スタッフコラム｜ソフト産業プラザ テックス TEQS

TOP > マガジン > スタッフコラム > Dreamweaverから消えた、アノ機能を使うには？

## スタッフコラム

講師 森コラム
2016年10月19日

### Dreamweaverから消えた、アノ機能を使うには？

こんにちは！ iMedioセミナー講師の森 和恵です。

一段と肌寒くなってきましたね。
10月半ばになってやっとです。今年は暑かった･･･。
いよいよこのコラムも次回で50回。どんなネタがいいか、Twitterで募集中です。
https://twitter.com/r360studio/status/786068370609274880

さて。今回は、＜Dreamweaver＞についてです。

３年ぐらい前にDreamweaver講座を受けた方から、先日質問がありました。
「先生、イメージプレースフォルダがメニューになくなったんです･･･」

イメージプレースフォルダとは、
CS6の時にあった「仮画像」を挿入する機能↓です。
http://www.yocchi01.mydns.jp/Dreamweaver/Dreamweaver06.html

Webページを作ってて、写真と文章は後からくるから、とりあえずページの
枠組みだけ作っておかなくてはならないなんてことありませんか？
わたしは、ページのテンプレート（ひな形ページ）を作る時によく使います。

残念ながら、イメージプレースフォルダ機能は、
現在のCC2015バージョンでなくなってしまいました。ホントに残念です。

なくなってしまっても、イメージプレースは使いたい･･･
という方のために手順を紹介しますね。

（１）画像を挿入する操作を行います。
（［挿入］－［image］メニューでなくても、普段馴れてる方法でOK）

（２）画像ファイルを選択する「イメージソースの選択」ダイアログが
表示されたら、ファイル名を「XX」指定し[OK]ボタンを押します。
（ファイル名は、適当なアルファベットなら何でもOK。）

（３）画像は表示されず、壊れたアイコンが表示されます。アイコンを
選択しつつ、プロパティパネルの[幅]と[高さ]に必要なプレースフォルダの
サイズを入力し、代替にコメントを書き加えます。

（４）最終的に、以下のようにコードが表示されます。
<img src="xx" alt="～コメントに指定した文～" width="300" height="300"/>

（５）プレースフォルダを差し替えるには、＜デザインビュー＞の場合は、
画像をダブルクリックして新たな画像を指定します。＜ライブビュー＞の場合は、
画像をクリックして右上のメニュー（≡）からsrcを指定します。

（おまけ１）壊れたアイコンだと見栄えが悪い･･･という方は、
placehold.jp↓のURLをsrcに指定してください。
[Advanced]機能を使えば、色や表示文字の指定なんかもできます。
http://placehold.jp/

（おまけ２）CSSを用いて見栄えを指定する方法は、セレクタに“img[src=”xx”]”
（src属性にxxが指定されているタグに対してスタイルを割り当てる）を用いればOKです。

文章だけでは、ちょっとわかりにくかったかもしれませんね。一度、
Dreamweaverを動かしながら、確かめてみてください。ちなみに、Dreamweaverの
画像関連のメニューは、Adobeさんのヘルプ↓が参考になりますよ。
https://helpx.adobe.com/jp/dreamweaver/kb/cq05270222.html

また、別の画像挿入のアプローチですが、最新のCC2015からは、
Creative Cloud Extractという機能が追加されています。Dreamweaverから、
Photoshopを起動することなく、PSDファイルから画像やスタイルを切り出す機能です。
http://www.adobe.com/jp/creativecloud/extract.html

･･･ということで、担当講座のご紹介。最新のDreamweaverについて学んでみませんか？
今日ご紹介した二つのネタは、講座でも触れてみたいと思います。

“Dreamweaver入門 ～はじめよう！Web制作～《最新版 CC 2015》”（10/28開催）
https://www.sansokan.jp/events/eve_detail.san?H_A_NO=21818
※使うテキストも紹介。わたしの講座は、全部オリジナルで講座のために書き起こしてます。

ではまた、次回お会いしましょう。

r360studio 森 和恵 (^^)

【Twitterにて情報配信中】（ https://twitter.com/r360studio ）
【 担当講座一覧 】（ http://r360studio.com/seminar/ ）

過去の記事へ
新しい記事へ