クリエイティブ

JPEG?ベクターデータ?画像形式についてわかりやすく解説!

Tags: / / / /
Written by マスベサチ

パンフレットや名刺、ウェブサイトを作るときに、制作会社から「ロゴのベクターデータください」「写真の解像度が足りません」などと言われたことはありませんか?
自分でSNSに画像をアップしようとしたけど、画像形式が違ってアップできなかった、という経験のある方もいらっしゃるかもしれません。

弊社でも、お客様とのやりとりの中で素材のご提供をお願いする際に、画像形式や解像度についてのご質問をいただくことがあります。
この記事では、上記のようなシチュエーションで困ったことがある方向けに、画像形式について分かりやすく説明していきます。

画像形式とは?

画像形式には、以下のような種類があります。

  • JPEG
  • ベクターデータ
  • GIF
  • PNG

その他にもたくさんの種類がありますが、代表的なものを挙げてみました。
今回は印刷物やウェブサイトを作るときに知っておくと便利な「JPEG」と「ベクターデータ」を主にご紹介しつつ、補足として「GIF」と「PNG」にも触れていきます。

それぞれの画像形式の違いは、分かりやすくざっくり言うとこんな感じです。

  • 写真はJPEG
  • ロゴはベクターデータ
  • アイコンや文字はGIFPNG

画像形式の確認方法

ファイルの画像形式は、ファイル名の「.(ピリオド)」の後に書いてある英数字3文字で確認することができます。
この「.(ピリオド)+英数字3文字」のことを拡張子と言います。

もしお手元のパソコンでファイル名に拡張しが表示されていない場合は、以下の手順で拡張子を表示させることができます。

Windows10の場合

  1. タスクバーから「エクスプローラー(フォルダのアイコン)」を起動
  2. 上部メニューの「表示」をクリック
  3. サブメニューが表示されるので、その中の「ファイル名拡張子」にチェックを入れる

こちらのサイトで、画像付きで詳しく解説されています。
https://pc-karuma.net/windows-10-show-explorer-file-name-extension/

macOSの場合

  1. 「ファインダー(ブルーの顔のアイコン)」を起動
  2. メニューバーの「Finder」>「環境設定」と選択、「詳細」をクリック
  3. 「すべてのファイル名拡張子を表示」を選択

JPEGの特徴

  • 写真の保存に向いています。
  • 圧縮されるので、圧縮率によっては荒れた画像になってしまいます。
  • 印刷に使う画像は、解像度に注意が必要です。

解像度について

解像度とは「画像の精密さ」のことです。
解像度の数値が高ければ高いほど精密な画像、低ければ低いほど荒い画像ということになります。
印刷で使う画像は300dpi350dpi、ウェブで使う画像は72dpiが一般的です。

ウェブの時にはそんなに解像度に気を使う必要はありませんが、印刷の時には注意が必要です。
印刷に使いたい写真があったとしても、その写真の解像度があまりに低ければ、とても荒れた状態で印刷されてしまうので気をつける必要があります。

ベクターデータとは

デザイン会社から「ベクターデータください」と言われたことはありませんか?
多くはロゴデータのやりとりの時に聞くフレーズです。

ベクターデータとは、主にIllustratorを使って作成されたデータのことで、分かりやすくいうと「どれだけ拡大しても荒れない」ファイル形式です。
拡張子は「.ai」「.eps」「.svg」などが使われます。

ロゴデータは、名刺で使ったりパンフレットで使ったりウェブサイトで使ったり……
媒体によっていろんなサイズで使用することがありますよね。
なので、制作会社としてはどのサイズで使ってもキレイな状態で使用できるように、ベクターデータで提供していただきたいのです。

これからロゴマークをデザイナーさんに依頼される方は、ベクターデータでの納品をお願いされるといいと思います。
ベクターデータはIllustratorPhotoshopといった専門のソフトがないと開けませんが、あとで別のデザイナーさんに名刺やパンフレット・ウェブサイトを作ってもらう時に必要になってきます。

そのほかの画像形式

GIFの特徴

  • 256色までしか表現できないので、写真には向いていません。
  • GIFアニメーションで有名です。最近流行りのシネマグラフはGIFアニメーションで作られています。

PNGの特徴

  • 背景を透明にできます。GIFも透明にできますが、PNGでは半透明も表現できます。
  • 半透明が表現できるので、人物や物を切り抜いて背景を透明にしたときの保存に向いています。
  • 写真も綺麗に保存できますが、JPEGに比べてファイルサイズが大きくなってしまいます。

まとめ

いかがでしたでしょうか?
ざっくりとではありますが、分かりやすさを最重視して画像形式についてご説明してみました。

まとめると、以下の3点を覚えておくと、制作会社との画像のやりとりがスムーズになると思います。

  • 写真はJPEG
  • 印刷の場合、解像度には気をつける
  • ロゴデータはベクターデータで扱う

この記事が、デザイナーさんとお客様のお困りごとを少しでも解決する手助けになれば幸いです。
他にも、この質問よく受けるなーなど気づいたことがあったらまた記事にしようと思います。

最後までお読みくださりありがとうございました。
それでは、また。

株式会社MIRAIでは、Webマーケティング・コンサルティングから
ホームページ制作・動画制作など、様々なご相談を承っております。

お仕事のご依頼・ご相談はこちら

Category:デザイン
マスベサチ
1988年生まれ。一児の母。 中学1年生のとき、自分の描いたイラストを発表するホームページを作ったことがきっかけで、Web制作をはじめる。 MIRAIではデザイナー兼ディレクターとして、社内外の全てのデザインワーク・アートディレクションをおこなっています。