解像度や保存形式の基礎知識

質問

自分はFLASH８とIllustratorＣＳ、PhotoshopＣＳなどを使用してWebページを作ることが多いのですが、いつもできあがったFLASHサイトのデータが重くなってしまうことで困っています。

原因としてはやはり画像データが重過ぎるせいだとは思うのですがイラレのaiデータを作成するといつも１Ｍを越えてしまう重さになってしまいます。その上画質もあまり良くなかったり・・・。

プロの方が作ったサイトなどを見ると、画質が綺麗なわりに読み込み時間がそんなにかからなかったりするのはなぜなのでしょうか？

今まで全て独学で行き当たりばったりでやってきてしまったので、画質の適正な解像度や、データを軽減する工夫などの知識が全くありません。
ここら辺で一からしっかりと手堅いデータの作り方を勉強したいと思うのですが、お勧めの書籍やサイト等ありましたら、どうか教えていただけないでしょうか。

主に、FLASH８、IllustratorＣＳ、PhotoshopＣＳの画質保存、相互のソフトに読み込むための知識に特化したものを探しています。
またはFLASHデータ軽減の助けになるものをお願いします。
一応基本的なマニュアル本は持っているのですが・・・イマイチかゆいところに手が届かない感じで困っています。

よろしくお願いいたします。

回答No.2

ddg67 · ベストアンサー

補足見ましたけど、あら～　えらい難しい所の話を求めているんですね(^_^;

まず基本的な事の確認で
　Photoshopで（Illustratorはどーいうソフトか判ってますよね？）100%表示させた時に、写真全体が写っていますよね？　
Web用に保存を使って100%表示（実際にはソフトのウィンドウの中なんで100%よりも少し小さめで100%の大きさになるのが望ましいのですが）させた時に画像の劣化の無い範囲で圧縮率を変えて保存しなおします。

Web用に保存で０～１２までの圧縮率を選べます、１２だと逆にデータサイズが大きくなります、１０は少し小さく８にするともっと小さく、６、５、・・・画面を見ながら画像の荒れ方が悪くならない程度に圧縮率を高く（数値は低く）していきます。

そうすると1MBぐらいあったデータが100kbぐらいの大きさになります（数値は例です、その都度違うので）

1MBのデータをまとめて作れば重くなる、100kbのデータなら10個まとめても元データよりも軽いですから、それで軽いFLASHが出来る、というのは理解できますよね。？(^_^;

ソフトに付属の説明書やチュートリアル（指示に従って練習していくと操作方法が覚えられる）を１から読む、練習すると基本的な事は全て覚えられますよ、マニュアル本に頼らなくても(^_^;

昔はマニュアル本なんて無くて辞書を片手に（日本語版ソフトが無くて）試行錯誤しながら作ってましたので、それに比べたら・・・・(^_^)v

お礼

早速のご回答ありがとうございます！

おっしゃっていることは全て理解できます。
元データをWeb用に保存で適正の圧縮率で圧縮して保存して利用する、ということですね。
ただ、より綺麗に表示させる方法として、FLASHで拡大縮小しないために適正な大きさにリサイズする、ということがわかりません。
ピクセル数をFLASHに合わせると画像が汚くなってしまいます。
それならばピクセル数を合わせるとか考えず、ただWeb用に保存で軽くしたデータを読み込み、FLASH上で配置したい大きさに自由変形して使う方がいいのでしょうか？
それともFLASH自体のピクセル数大きめに設定した上でそのピクセル数に合わせて保存する、というのが得策なのでしょうか。

またイラレで作ったポスターのような画像(フォトショのEPSデータを配置し、ロゴを入れたもの)をFLASHで綺麗に表示したい場合はaiデータを直接読み込むのではなく、重さを考えてjpgに変換した上で利用したほうがいいのでしょうか。何か他に方法はないのだろうか。と思ってしまうのです。

質問ばかりで心苦しいのですが、自分自身少し混乱してしまっているのでお付き合いいただければ幸いです；

＞昔はマニュアル本なんて無くて辞書を片手に（日本語版ソフトが無くて）試行錯誤しながら作ってましたので、それに比べたら・・・・(^_^)v

確かにそうですね。ちょっと煮詰まっていたので冷静になれました・・・。ありがとうございます！

回答No.1

ddg67

Web用に保存をうまく使っていますか？

モニターの大きさに合わせてデータを作っていますか？？

お礼

ご回答ありがとうございます。

＞Web用に保存を
利用していますが、うまく使えているかと言われるとよくわかりません。
＞モニターの大きさに合わせてデータを作る、とはどういうことでしょうか？？

FLASHで画像の変形をすると汚くなる、という情報をみかけたので、Photoshopで画像作成時にピクセルをFLASHのピクセルに合わせてみたのですがかえって汚くなってしまいました。何か別の方法が？？
恐らくFLASHをパブリッシュする際できるだけウィンドウいっぱいに表示されるように、設定を「100％」にしているので、そのために画像が拡大されて汚くなるのではないかと思います。
ならばFLASH自体のピクセル数を増やせばいいのかもしれないのですが、そうするとただでさえ重いデータがさらに重くなってしまいます。

と苦悩しております。

外部ファイル読み込みも試してみたのですが、やはり汚く表示されてしまいました。かと言ってピクセルを大きくすると表示サイズまで変わってしまうし・・・。

また、イラストレータのデータをどういう風にFLASH上でピッタリなサイズに変換すればいいのかわかりません。イラストレータ上でルーラのサイズに合わせて縮小して、jpgで保存して、外部ファイル読み込みで表示してみたのですが画像が耐えられない汚さになってしまいました。
イラストレータのデータと画像のデータを別々に読み込んだりするのがいいのでしょうか？
Aiデータでライブラリに読み込めば綺麗には表示されるのですが、データが大変重くなってしまいます。AIデータは外部ファイル読み込みで利用できなかったのですが、やっぱりそれは無理なのでしょうか？

と、こんな風にデータのリサイズや、読み込み等の段階でイロイロとつまづいています。
まとまらない文章で長々と申し訳ありません。

こういったことは今後も増えると思うので、一回一回こういった掲示板で聞くよりは勉強しなおしたほうがいいのだろうか、と思ってそのための書籍やサイトがないかと思ったのです。

ただもちろん現状に対するアドバイスなどもいただけると嬉しいです。

・イラストレータのサイズをFLASH上で適切な大きさ(表示サイズ)にする方法
・イラストレータで作成したデータを軽く綺麗にFLASH上で利用する方法
・jpg画像データをFLASH上で軽く綺麗に表示する方法。

などです。

引き続き、どうかよろしくお願いいたします。