転職するならどっち?webデザイナーとグラフィックデザイナーの違い

webデザイナーとグラフィックデザイナーの違い
読む時間の目安
この記事は10分くらいでサクッと読めるにゃ。忙しい人は目次から気になるところにジャンプできるにゃ。

webデザイナーとグラフィックデザイナー、どちらに転職・就職しようか迷っている方も多いと思います。

私はもともと、チラシや新聞広告などのグラフィックデザインから始めました。その後、webもやるようになり、今では、webデザインもグラフィックデザインも両方やっています。

今回は、webデザイナーとグラフィックデザイナーの

  • 違い
  • 共通点
  • 向き・不向き
  • 給料
  • 将来性

などについて比較しながら紹介していきますので、ぜひ参考にしてみてくださいね!

webデザイナーとグラフィックデザイナーの違い

媒体の違い

媒体の違い
  • webデザイナー:web
  • グラフィックデザイナー:紙・web・その他色々(交通広告・ノベルティグッズ・看板等)

まず、webデザイナーとグラフィックデザイナーの大きな違いは媒体ですね。

webデザイナーは当然ながらwebですが、グラフィックデザイナーは紙とweb以外にも色々な媒体のデザインを行います。

にゃーご
紙以外もやるんだにゃ

私の場合、グラフィックデザインでは、チラシ・名刺・パンフレットなどの紙媒体の他、駅の横断幕などの交通広告ノベルティグッズなども作成したことがあります。

グラフィックデザインは媒体がかなり幅広いです!

そのため、グラフィックデザイナーは、それぞれの媒体の特徴をよく理解しておく必要があります。

仕事の流れの違い

仕事の流れの違い
  • webデザイナー:要望ヒアリング→ワイヤーフレームやサイトマップ作成→デザイン作成→コーディング→ブラウザチェック等の確認作業→公開
  • グラフィックデザイナー:要望ヒアリング→ラフデザイン作成→デザイン作成→校正→入稿

※上記とは違う流れで進行する場合もあります。

webデザイナーとグラフィックデザイナーとでは、仕事の流れもかなり違います。

webデザイナーの場合、コーディングがあるのが大きな違いの一つですね。(コーディングはコーダーが行う場合もあります。)

にゃーご
コーディングは苦手だにゃ・・・
えりー
コーディングしなくてもいい場合もあるけど、コーディングの基礎知識がないとwebデザインを作るのは難しいね・・・

また、デザイン作成前に、ワイヤーフレームという設計図を作成するのも特徴です。

えりー
ワイヤーフレームでクライアントの要望をよ~~く確認しておかないと、リテイクが多くなって後から後悔するはめになります・・・

グラフィックデザイナーの場合、校正と入稿作業があります。もちろん、webでもミスがないか公開前のチェックは行いますが、紙のチェックはwebの比ではありません!

webは後からでも修正がききますが、紙は刷ってしまったら終わりだからです。

えりー
何百万円もかかる広告を入稿する時には手が震えるよね…
にゃーご
プレッシャー半端ないにゃ…

また、入稿作業は、入稿先にあわせて入稿形式に変換した後に入稿しなければならないので、これはこれで手間のかかる作業なんです。。。

このように、webデザイナーとグラフィックデザイナーでは、同じデザイナーと言えども、作業の流れは大きく異なります。

入稿のキホン webデザイナーを目指している方も覚えておこう!

  1. 画像をすべて埋め込み、文字をアウトライン化
  2. 先方のIllustratorのバージョンにあわせて別名で保存
    ※アウトライン前のデータも残しておくこと!
    後から修正があったときに、文字のアウトライン化をしてしまうと、文字の修正ができなくなってしまうからです!
  3. Illustrator(「ai」or「eps」)PDF形式のデータを、メールなどで先方に送ります。

使用ソフトの違い

使用ソフトの違い
  • webデザイナー:Photoshop(使用頻度高い!)、Illustrator、Dreamweaver、その他
  • グラフィックデザイナー:Illustrator(使用頻度高い!)、Photoshop

webデザイナーとグラフィックデザイナーとでは、使用ソフトも少し違います。

webデザイナーはPhotoshopを中心にデザインを行う場合が多いです。(Illustratorだけでデザインを行なってもOKです。)

私は、Illustratorから覚えたので、Photoshopでwebデザインを作らなければいけないとなった時にはかなり戸惑いました…。

えりー
フォトショは最初めちゃくちゃ使いづらかった・・・
にゃーご
イラレのほうが初心者に優しい気がするにゃ。

その他、webデザイナーの場合は、コーディングソフトとしてDreamweaverやその他ソフトも使用します。

一方、グラフィックデザイナーの場合、ほとんどIllustratorを使っていると思います。

えりー
チラシをExcelで作ってる人とかにイラレの素晴らしさを全力で伝えたい。
にゃーご
Excelチラシ職人・・・逆にすごいにゃ。

また、Photoshopは写真を加工する時くらいしか使わないかもしれません。

そのため、グラフィックデザイナーからwebデザイナーに転向する場合、Photoshopでのwebデザインにつまづく方が多いと思います。

webデザイナーを目指す方であってもグラフィックデザイナーを目指す方であっても、PhotoshopとIllustratorを両方とも使いこなせるように、日頃からよく勉強しておきましょう!

フォントの違い

フォントの違い
  • webデザイナー:ヒラギノ角ゴ(mac)・メイリオ(windows)、文字間は調整しない
  • グラフィックデザイナー:フォントは自由、文字間を調整する

webでは、基本的に自由にフォントを使うことはできません。

テキストを画像化して表示すれば自由なフォントを使うことも可能ですが、そうすると、ページの読み込みが遅くなったり、検索に引っかかりづらくなったりしてしまいます。(SEO対策的に不利

そのため、テキストの画像化は必要最低限にし、基本的にはデバイスに入っているフォントで表示するようにします。

デザイン作成時には、windowsではメイリオmacではヒラギノ角ゴを使うのが一般的です。

Googleフォントなどのwebフォントという手法を使えば、色々なフォントを使うこともできますが、日本語のwebフォントはまだまだ少ないです。

えりー
当サイトではGoogleフォントを使っています!

一方、グラフィックデザインでは、フォントを自由に使えます。

なお、文字間の調整(カーニング)も、webデザインでは行いません。グラフィックデザインのみで行います。

色・解像度・ファイルサイズの違い

色・解像度・ファイルサイズの違い
  • webデザイナー:色はRGB、解像度72dpi、ファイルは軽量化、単位はピクセル
  • グラフィックデザイナー:色はCMYK、解像度350dpi、ファイルサイズが大きい、単位はミリメートル

webデザインはRGB・解像度72dpi、グラフィックデザインはCMYK・解像度350dpiを使います。

えりー
これはもう丸暗記してしまいましょう。
にゃーご
webはRGB72dpi、紙はCMYK350dpi、webはRGB72dpi、紙はCMYK350dpi、webはRGB72dpi、紙はCMYK350dpi、…

webはまず表示されなければ意味がないので、ファイルサイズの軽さが重要視されます。

一方で、紙などは美しさが重要視されるため、ファイルサイズはとんでもなく重たく(大きく)なることが多いです。

ちなみに、重たいデータは、FirestorageGoogleドライブDropboxなどで送信します。

また、webの場合の単位はピクセル(px)を使います。一方、紙などの場合は単位がミリメートル(mm)なのでわかりやすいですね。

苦労をしたところの違い

苦労をしたところの違い
  • webデザイナー:コーディングなど、覚えることが多い!
  • グラフィックデザイナー:デザイン力やクリエイティブな発想が求められる

webデザイナーの場合、HTMLやCSSなどのコーディングスキルや、ソフトの使い方など、覚えることはとても多いです。また、常に新しい情報に敏感でなければなりません。

ですが、一旦仕事を覚えてしまえば、そのやりかたに沿ってやれば良いので、意外に簡単です。

えりー
科目で言うと、数学に似ています。1+1=2とわかっていれば、答えを出すのは簡単ですよね。

グラフィックデザイナーの場合、webデザイナーと比べると覚えることは少ないですが、よりデザイン力やクリエイティブな発想が求められます。

webはコーディングのことを考えなければいけないので、ある程度、コンテンツの配置や使用するフォントも決まってきますが、紙はサイズの制約はあるものの、配置やフォントは自由です。自由な分、より高度なデザイン力が必要です。

えりー
科目で言うと、国語に似ています。答えがいくつもあって、自分なりの答えを見つけるような感覚ですね。
にゃーご
数学も国語も嫌いにゃ・・・・・

webデザイナーとグラフィックデザイナーの向き・不向き

にゃーご
ボクはどっちに向いてるのかにゃ?

これは一概には言えません。

初心者の頃は、「将来はwebどっちを中心にやりたい?」と先輩に聞かれたものですが、グラフィックデザイナーもwebデザイナーも経験し、どちらもできるようになった今、同じことを聞かれたら、「どっちもやりたいです!」と答えると思います(*^^*)

グラフィックデザイナーとして紙媒体等のデザインを自由な発想で考えるのも楽しいですし、webデザイナーとしてコーディングやプログラミングを行い、自分の思うようにwebサイトが動いた時は感動を覚えます!

えりー
どちらも大変な部分もありますし、楽しい部分もたくさんあります!

よく、『コーディングが苦手だからグラフィックデザイナーのほうが向いているかも』と言う方もいますが、コーディングは勉強すれば必ずできるようになるので、最初は大変だと思いますが、諦めずに挑戦されたほうが良いと思います。

まずはどちらも経験してみる、というのがおすすめです!

にゃーご
まずはやってみることが大事なんだにゃ。

webデザイナーとグラフィックデザイナーの将来性

webデザイナーもグラフィックデザイナーも、どちらも将来性がある職業だと思います。

新聞よりインターネットでニュースを見る時代ですから、一見webのほうが安泰に見えますが、グラフィックデザイナーは例えばノベルティグッズのデザインなど、紙以外のデザインも広く対応しますので、一概にwebデザイナーのほうが安泰とは言えないと思います。

えりー
ただ、紙媒体が縮小傾向というのは事実ですね・・・

私の場合、webデザインの仕事も、グラフィックデザインの仕事もやっていますが、両方できるととても重宝されます!

webサイト名刺やチラシを一緒に作りたい』といったクライアントからの要望も多いためです。

にゃーご
めざせ二刀流だにゃ。

クライアント側からしても、webも紙も同じ人にやってもらえるならそれが一番良いですよね。ですので、webか紙かどちらかを選ぶというより、どちらもできるようにしておくのがおすすめです。

いずれにしても、色々なことを貪欲に学びつづける人が生き残ると思います!

webデザイナーは将来性がある職業!AI台頭の時代に生き残るためには…

2019.04.07

webデザイナーとグラフィックデザイナーの給料

平均年収で比較すると、webデザイナーのほうがやや高いことがわかります。

ただ、あくまで平均であって、webデザイナーよりも稼いでいるグラフィックデザイナーもいます。

給料はスキルによって決まりますので、webデザイナーであっても、グラフィックデザイナーであっても、スキルアップすれば給料が上がる可能性は十分にあります!

にゃーご
頑張って勉強するにゃ。

グラフィックデザイナーがwebデザイナーに転向する場合は、コーディングを意識する

私はグラフィックデザインから始めたので、webデザインを作り始めた時には戸惑いました。

webの場合は、コーディングを意識したデザインを作らなければならないからです。

にゃーご
やっぱり全然違うのかにゃ?
えりー
活かせる部分は多いけど、webと紙では考え方が全く違うね。

例えば、雑誌のようにコンテンツがバラバラに配置されたデザインにしてしまうと、コーディングするほうはものすごく大変になってしまいます。

最近は、PCだけでなく、スマホやタブレットといった、各デバイスでの表示も考慮しなければなりません。

にゃーご
もう増えないでほしいにゃ・・・・

また、webの場合、マウスを上に乗せた時の動作など、動きも一緒に考える必要があります。

必ずしもwebデザイナーがバリバリにコーディングできる必要はありませんが、最低限、コーディングの基本は抑えておく必要があります。

もちろん、webデザイナーがコーディングもできれば、前述のとおり、収入UPや転職成功などの可能性も高くなります!

しかも、グラフィックデザイナーの出身の方のデザインスキルは高い場合が多いので、グラフィックデザイナーがコーディングを身につければ最強です!

えりー
コーディングの勉強には、Progate(プロゲート)がおすすめです!

Progate(プロゲート)

webデザイナーとグラフィックデザイナーの共通点は「クライアントありき」ということ

webデザイナーもグラフィックデザイナーも、クライアントありきのお仕事です。

そのため、自分の好きなデザインを作るというより、クライアントの要望を叶えるデザインを作る必要があります。

えりー
とは言え、クライアントがとんでもない依頼をしてくることもしばしば。
やんわり別の提案をできる交渉スキルも必要かも。。。
にゃーご
とんでもない依頼・・・・・・?
えりー
よくあるのが「全部赤字にしてくれ!」とかね。普通に目が痛いよね。
にゃーご
全部赤字じゃどこが大事かわからないにゃ・・・

もちろん、ただ単にクライアントの言いなりになるのではなく、最終的にクライアントの利益になるようなデザインを提案できるようになるのがベストです。

そのためにも、デザインスキル以外にもマーケティングの知識など、さまざまなことをインプットしておきましょう。

まとめ

webデザイナーとグラフィックデザイナーは、同じ「デザイナー」という名前がつくものの、似て非なるもの。さまざまな違いがあります。

最終的には、webデザインもグラフィックデザインも、両方できるのがベストです。どちらもできるととても重宝されますし、転職・就職にも有利です!

『自分にはどっちが向いているかな?』と思う前に、まずはどちらも挑戦してみるのがおすすめです!

たとえ、今は『コーディングが苦手・・・』だとか『デザインセンスがない・・・』だとか苦手な分野があったとしても、1年後には苦手を克服できているかもしれません。

「苦手」って「今は出来ない」というだけであって、「向いていない」というわけではないんですよね。

えりー
苦手=今はできないだけ!苦手なだけで、向いていないって決めつけずに、挑戦してみましょう!

まずは食わず嫌いをせずに、貪欲に学んでいきましょう!

ABOUTこの記事をかいた人

猫と気ままに暮らすフリーランスwebデザイナー。
芸術学科卒 → 超ブラック企業のホームページ更新担当(正社員) → 正社員よりも稼ぐフリーター → 制作会社(バイト→正社員) → フリーランス(今ここ)
苦労もたくさんしてきましたが、やっぱりwebデザインは楽しい!これからwebデザイナーを目指す人にもwebの楽しさを伝えたい!そんな気持ちで記事を書いています。