[Fireworks CS5] スライス書き出し設定が変わった

Firework CS5が発売されてそろそろ2週間近くたちます。もしかすると、もう誰かがブログに書いていそうですが、ひっそりと仕様が変わっているスライスの書き出しについて書いてみます。

気がついた発端は、先日公開していただいたCSS スプライト作成に便利な拡張機能「CSS Sprite Extension」です。これを見るとCS4までをよく使っていた方はあれ？と思うようなことをしていると思います。CS5限定でわざわざカスタムでスライスの命名を設定しているのですね。

さて、変更になった点は2点あります。いずれも「ファイル＞HTMLの設定＞ドキュメントの詳細」でスライスファイルの設定を行っている場合(デフォルト状態含む)です。

• ステート番号(f2,f3,...)を選択すると、s1、s2、s3と全ステートの書き出しファイルに対しs+スライス番号が振られる(cs4まではf2、f3となっていた)
• 1番目のステートからスライス番号がふられるようになった(CS4までは1番目のステートは_f1や、_1のようなステート名がついていませんでした)

一つ目は、フレームからステートに表示が変わったことによる変化だと思います。

もっとも、新しく作る場合Dreamweaverで画像を挿入するとき選ぶものが変わっただけなのですが、古いデータを更新する場合はそうは行きません。まとめてファイル名を変えたり、リンクをしなおすなどの対策が必要でしょう。

実際に書き出した例を下に載せます。左がCS5、右がCS4で「アンダースコア」＋ステート番号(f2,f3...)で書き出した場合になります。

 

2番目はステート番号だけに影響があるのかなと思いましたが、ロールオーバー(over,down,overdown)や、略称(o,d,od)を選択していた方もあるようです。これまでFireworksで書き出す場合1ステート目は通常状態ということで、ステート名は付加されないようになっていました。CS5からは「1」と付加されます。

例) button1.gif/button1_over.gif→button1_1.gif/button1_over.gif

ロールオーバー(over,down,overdown)や、略称(o,d,od)を使っていた方は次のような感じで設定しておいてはいかがでしょうか？画像は略称を使用する場合です。

この仕様変更の理由ですが、Introducing Adobe Fireworksのこの部分にあるようです。HTML書き出し的にこのような仕様のほうがjQueryなどに対応させやすいのですね。

When exporting HTML, you now have the option to enter custom state names in the HTML Setup dialog box–useful when exporting for jQuery-based state naming, or other custom naming.

おまけですが、ステートが1つしかない場合も「現在のステートのみ」にチェックを入れておかないと、ステート名が付加されてしまいます。「ファイル＞書き出し」から表示するモーダルダイアログでは「現在のステートのみ」のチェックをどうするかは選択できませんので、1つしかステートのないファイルを書き出す場合は、右クリック(MacはControl＋クリック)から選べる「選択したスライスの書き出し」で書き出しましょう。