FCKeditor　画像ボタンとイメージ挿入/編集ボタンの違い

FCKeditorには、画像を貼り付ける時に間違いやすい、よく似たボタンがあります。

ボタン画像 画像ボタン イメージ挿入/編集
ボタン名 画像ボタン イメージ挿入/編集
貼り付けた
画像の見え方

『画像ボタン』と『イメージ挿入/編集』で貼り付けた画像の見え方

左が『画像ボタン』、右が『イメージ挿入/編集』で貼り付けた画像です。
双方に違いはありません。
オンマウス時の
マウスポインタ

画像ボタンでのマウスポインタ

画像ボタンは、 リンクがある場合のマウスポインタが表示されます。

イメージ挿入/編集でのマウスポインタ

イメージ挿入/編集の場合は、マウスポインタは通常状態のままです。
ソース

・画像ボタンの場合

<input width="168" type="image" height="50" src="/myfiles/image/obita_test.jpg">

・イメージ挿入/編集の場合

<img width="168" height="50" alt="" src="/myfiles/image/obita_test.jpg">
用途

フォーム内の『検索ボタン』や、『送信ボタン』などを画像にしたい場合に使用します。

好きな画像をボタンとして使用できるため、
サイトのデザインに合わせることができます。

画像を貼り付けるために使用します。

画像のパスやサイズ以外に、altやtitleを入力することもあります。

上の表を見ると、
見た目上は全く変わりはありませんが、オンマウス時の状態や、ソースを見では、
全く違うことがわかると思います。

 

もちろん画像にリンクが貼ってあれば、オンマウス時の反応は画像ボタンの時と同じです。
ただ、画像にリンクが貼ってある場合のソースは、

<a href="http://www.obitastar.co.jp">
<img width="168" height="50" alt="" src="/myfiles/image/obita_test.jpg">
</a>

画像ボタンとは全く違います。

 

また、ソース以外にも、画像をクリックした際の動作に違いがあります。

『イメージ挿入/編集』と間違えて、『画像ボタン』で画像を張ってしまった場合、
この画像をクリックしても特に何も動作しません。

画像にリンクが張られていた場合は、
ページ移動や画像の拡大など、何らかの動作が起こります。
(リンクの設定間違いなどは除く。)

 

それぞれ正しい使い方がありますので、間違えないように注意しましょう。