株式会社ぺいじず

2020.08.20

Web制作の現場知識:Adobe イラストレーターのパッケージ機能

みなさんこんにちは。制作部のじゅんいちろうです。

技術の進歩というものは実にめざましいものがありますよね。これはWeb制作に限ったことではありませんが、今までできなかったことができるようになったりすると感動したりするものです。

今回は私が学んだWeb制作の現場知識をご紹介させていただきたいと思います。

あれ、画像のリンクが切れてる…元画像どこだっけ?しかもどれだっけ?

イラストレーターで作業をしていて、フォルダーやらディレクトリやらをわちゃわちゃした後にaiファイルを開いたらこんなメッセージが出たことはないでしょうか。

この警告メッセージはAdobeイラストレーターが「ai.ファイルの中に配置した画像ファイル(写真やロゴ等)のリンクが切れてるから画像が表示できないよ。違う画像にする?無視してそのまま作業する?とりあえず見なかったことにする?」と聞いてきているものです。

もしこのaiファイルがデザインカンプで、これをもとにして「さあ、コーディングをするぞ!」といった段階だった場合、このエラーメッセージを解決するまで作業が止まることになってしまいます!

自分だけで作業をしているだけならまだしも、作業を引き継いでもらうために送ったデータや入稿したデータからこのような警告メッセージが出たとしたらかなり焦りますよね…そうならないためにも何故エラーメッセージがでるのか、その対策として何をすればいいのかをご紹介したいと思います。

リンクって?

リンク切れが起きるっていうけど、そもそもリンクってなに?というところから確認していきたいと思います。

まずは下図をご覧ください。

この(図 – 1)はとあるフォルダの中身です。aiはイラストレーターで作成したファイルで、img0104aiファイル内でリンク配置した画像の元データです。

aiファイル内で画像をリンク配置すると、aiファイルは画像の元データの一部を取得し、自身に埋め込みます。aiファイルはこの埋め込まれた情報をたよりにimg0104がいる場所を探し当て、リンク画像を表示させています。

なぜ人はリンク画像を配置するのか

上記のように、リンク配置した画像は元データの情報の一部しか保持していないのでデータ容量がとても軽くなります。そしてデータが軽いのでサクサク作業をすることが可能になります。これは制作側にとって大きなメリットです。これこそがリンク配置をする主な理由です。(少なくともじゅんいちろうはそうです)

元画像を埋め込んでしまえばそもそもリンク切れなど発生しないのですが、イラストレーターでのあらゆる処理が重たくなるので非常にストレスが溜まりますし、なにより作業効率がダダ下がりになります…!

人間の心理としてもサクサク快適に作業ができる方を選ぶのは自然なこと…だから人はリンクをせっせと配置するのです。

そしてある日、リンク切れのエラーメッセージが出てきてとても焦るという事象が発生してしまうのです…

リンク切れは何故おきる?

では何故リンク切れという事象が発生してしまうのか、そのメカニズムを確認していきたいと思います。

まずは下図をご覧ください。

aiファイルを開くとイラストレーターがファイルの中身を表示させようといろいろな処理を行います。そのなかでリンク画像を表示するために(図 – 2)の①~③を実行します。埋め込まれた一部情報を頼りに元画像がいる場所へ行き、情報と一致する場所に画像があればリンク画像として表示できるという仕組みとなっています。

在庫管理をイメージするとわかりやすいかもしれませんね。

img01~04が欲しいと注文が入ったとします。通常ですと入力してある在庫情報どおりの場所に在庫情報どおりの個数があるのでスムーズに注文処理と発送ができますよね。しかし、何者かが商品であるimg01~04の保管場所を勝手に変更してそのまま在庫情報を更新しなかったら、いざ注文を受けたときに在庫上存在するはずのものがない!ということになって騒ぎになりますよね。

イラストレーターでもそれは同じこと…あるべき場所にあるべきものがないと困るわけです。

(図 – 3)のように、aiファイルが持っている一部情報と一致する場所に元画像が存在しないことでリンク切れが発生してしまうというわけです。(画像のファイル名を変更したり、aiファイルが持っている情報と元画像の情報が一致しなくなるようなことをするとリンク切れが発生します)

では、いつでも起こりうるリンク切れに対処するいい方法はないのでしょうか…
ありました。

リンク切れを防ぐ画期的な機能が実装されていた!

その機能とは、Adobe イラストレーター パッケージ機能』です。

どんな機能なのかざっくり説明しますと、データ一式を誰かに渡す際に必要なデータを一つのフォルダにまとめてくれるというとても便利な機能となっています。

リンク画像が違うフォルダにあろうがディレクトリにあろうが全てもれなく収集してきてくれます!すごいですね!

使い方も非常に簡単です。


メニューバーからファイルを選択
パッケージをクリック


フォルダアイコンをクリックして保存場所を選択
作成したパッケージのフォルダ名を入力
パッケージをクリック

上記のようにたった5ステップでパッケージ化することができます!
便利!

最後に…

私が紙のデザインをしていたときもリンク切れを防ぐ方法はありましたが、人間が手動で行うものがほとんどでした。「自分ルールを作る」「会社のハウスルールを遵守」「入稿前にリンクを埋め込み、元画像も添付する」「とにかく気を付ける」などです。それでもリンク切れは起きてしまうんですよね…

人間ですからね、どうしてもミスは起きてしまいます。上記の対策に関してもリンクの埋め込みを忘れていたり、画像の添付に漏れがあったりと、いくつかの項目を人間が実行するわけですからミスがどうしても発生してしまいます。

ミスをしたことよりも「ミスを出さない・減らす」仕組みを構築することが大事なのはどこの現場でも同じですよね。そういった観点からもこのパッケージ機能は非常に優秀な機能と言えるのではないでしょうか。

みなさんもぜひ『Adobe イラストレーター パッケージ機能』という強力な武器を駆使してリンク切れを回避しましょう!

※現在ぺいじずでは、Movable Typeを使ってWeb制作をする仲間を募集中です。
ご興味のある方は採用情報をご確認くださいませ。

関連記事

株式会社ぺいじず

私たちは、東京都で創業33年の制作会社です。
長年のマニュアル制作で培われたライティングスキルを活かし、効果的なWebサイトをご提案しています。