NEXTサイト内用語検索クリックしてウインドウを開き、必要に応じてウインドウ幅を調節して閲覧してください。type-ベースにページを切り替えました新しいページはこちらをご覧下さい。HOMEから入って下さい現在表示のページは、低解像度(狭い)モニタ用に残して有りますIllustratorでWeb用の画像を作成している人も多いと思います。使っていますが、Illustrator単独でも対応出来ないことは有りません)。ここではバージョン9から搭載された「Web用に保存」機能を中心に、IllustratorとWebとの連携を探りたいと思います。Web画像の作成の留意点Illustrator上でWeb用画像を用意する場合、幾つかの留意点が有ります。カラーに関してRGBカラーモードWebの表示・閲覧はモニタ上で行われます。モニタはRGB表示の為、画像作成時点でカラーモードをRGBにして作業します。「ファイル→新規」で開かれる「新規書類」ダイアログで、カラーモードを「RGBカラー」に設定。WebセーフカラーWebは、不特定多数のビジターによって様々なコンピュータ環境で閲覧されます。その為環境の違いによって、必ずしも同じカラーで表示されない、と言う問題が生じます。Webセーフカラーモード(Webセーフカラーパレット)で作業するようにした方が無難であるとされて来た訳です。両方のシステムパレットに共通する216色。パソコンでは理論的に24ビット、約1600万色のカラーが使用・表示が出来、本来Webでも事情は同じ訳です。上記したように閲覧環境は様々で有り、必ずしもその全てで対応しているとは限りません。双方共通に表示出来るカラーとして216色が設定されている訳です。最近のPCシステム、ディスプレーは殆ど24ビット表示に対応しており、又写真などの画像も広く使われている訳で、必ずしもWebセーフカラー216色に拘る必要も無いでしょう。少なくとも私は全く拘っていません。一つの目安として下さい。解像度Web画像の表示・閲覧は基本的にモニタ画面で行われます。従ってモニタ解像度(72dpi)を超える精細な画像ファイルを用意しても、表示はあくまでも72dpiでしか行われません。バラバラに異なる解像度の画像を72dpiで表示した場合、表示サイズが変わってくる恐れが有ります。Web用画像は全て72dpiに統一しましょう。Illustratorでのベクトル画像は基本的に解像度の制約を受けませんが、「Web用に保存」した場合、72ppiの解像度でラスタライズされ、細部はつぶれてしまいます(下図、ピクセルプレビューでの表示例、参照)。Web表示だけを念頭に置いたオブジェクト作成については、余り細部にこだわって描いても必ずしも忠実に再現されません。Illustratorで、画像を、ビットマップ(GIF、JPEG、PNG)形式で「Web用に保存」した場合、72ppiの解像度でラスタライズされます。その状態を、Illustratorの画面で確認できます。確認しながら描画を進めることが出来ます。切り替え「表示→ピクセルプレビュー」ピクセルにスナップ表示をピクセルプレビューに切り替えると、自動的に「ピクセルにスナップ」モードになり、オブジェクトが全てピクセルグリッドにスナップします。「ピクセルにスナップ」のチェックを外すと、ピクセルグリッドへのスナップが解除されます。画面表示を拡大することで、ピクセルを確認できます(Webでは実際、こんな荒い像で画像を見ている訳なんですね。眼を細めて遠くから見ると少しはましに見えます)。多用すると、Illustratorのファイルサイズが膨大になることが予想される)。Web用に保存ダイアログボックス「ファイル→Web用に保存」で開かれる「Web用に保存」ダイアログ(下図)で、各種設定が出来ます。ツールパレット手のひらツール画面の表示位置を変えるスライス選択ツールIllustrator10では、スライスした一片一片について、書き出し設定が出来ます。スライス片を選択するのに使います。拡大はクリック、縮小はAlt+クリックスポイトツール画面上のカラーを拾うことが出来ます。拾ったカラーが表示されます。書き出しの「設定」による、画像のプレビュー表示。設定の内容、ファイルサイズ、ブラウザでの表示速度などの情報。表示枚数の切り替え元画像、最適化(設定画像)、2アップ(元画像と設定画像)、4アップ(元画像と3種類の設定画像を比較出来る)。クリックすると表示)、詳細な設定が可能です。煩雑になりかえって分りにくくなります。必要に応じ、マニュアルなどを参照して下さい。