Webデザイナーとは?現代社会に必須の仕事の詳細、必要なスキル、向いている人などを解説!
インターネットは、私たちの暮らしに欠かせないインフラ(生活基盤)。
イベントの参加申し込みやお気に入りのショップの最新アイテム、進学したい学校の資料請求など、インターネットを通じてさまざまな情報を手に入れている。
そんななか、Webサイトの制作にかかわる重要な役割を果たしているのがWebデザイナーという職業だ。
そこで今回は、Webデザイナーとはどんな仕事なのか、徹底取材。
実際にWeb制作会社で活躍するWebデザイナーのインタビューも交えて、仕事内容ややりがいなど、詳しく解説しよう。
目次

Web制作会社 デザイナー
大学で経営学を専攻し、卒業後、フィットネスジム本部に就職。
その後、食品メーカーで広報業務に携わるなか、Webデザインに興味をもち、働きながらWebデザインスクールで学ぶ。
2021年10月にWebデザイナーとして転職。
Web制作会社でWebデザイナーとして活躍している。
Webデザイナーとは? 何をするの?
Webデザイナーとは、企業や個人などから依頼を受け、Webサイトのレイアウトや配色、文字の装飾など、デザインを行う仕事。見映えのよさだけではなく、サイトに訪れた人(ユーザー)が使いやすいかどうかや、依頼者の要望、サイトの目的に合うデザインであることが重要になる。
例えば、ショッピングのサイトでは、そのサイトを通じて、商品がよりたくさん売れることが目的となっている。
Webデザイナーの仕事内容は?
Webデザイナーの仕事の工程は、大きく、「要件定義」「Webサイトの構成・レイアウト作成」「Webサイトのデザインを作る」「コーディング」の4つとなっている。これらのすべてを一人のWebデザイナーが担当する場合もあるけれど、規模の大きいWebサイトの場合はチームを組んで分業で制作する。
☆ココもポイント!
Webデザイナーの仕事の進め方は、勤務先や担当するサイトの種類などによって、大きく2つのパターンに分けられる。●クライアントワーク
クライアントワークとは、顧客(クライアント)である企業や団体、個人からの依頼を受け、顧客の要望に沿ってWebサイトを作っていくこと。
Web制作会社や広告制作会社で働くWebデザイナーが取り組んでいる仕事の多くが、クライアントワークとなっている。
さまざまな業界・分野のサイト制作に携わる。
●インハウスデザイナー(社内デザイナー)
Web制作会社や広告制作会社のデザイナーは、主には他社から依頼されるWebサイトを制作するのに対し、インハウスデザイナーは、自社のWebサイトを制作する。
主にはWebサービス(※)を運営する会社や一般企業に勤務し、自社のWebサービスサイトや商品サイト、情報サイトなどを制作する。
マーケティングや広報・宣伝といった業務の一環としてWebデザインに関わるケースも多い。
(※)Webサービス
インターネット上で利用できるサービス全般のことを指す。
オンラインショッピングサイトやWebニュース、動画配信サイトなど、多種多様なWebサービスがある。
ここからは山崎さんに仕事現場のリアルなお話をうかがいながら、具体的に解説していこう。
まず、山崎さんはどんな仕事をしているのか、教えてもらった。
企業や個人などからの依頼でWebサイトを制作するクライアントワークの事業のほか、デジタル関連のコンサルティング、システム開発などです。
そんななかで、私は、会社の事業全体の広報・宣伝、マーケティングに携わるインハウスマーケティングの部署に所属しています。
マーケティング担当者、SEO(エスイーオー:※1)担当者、当社のさまざまな情報を発信するブログの編集担当者といったメンバーたちとチームを組み、インハウスデザイナーとして働いています。
いろいろな仕事を経験して今にいたっていますが、主な業務はブログのアイキャッチ(※2)、バナー広告(※3)の制作などです」
(※1)SEO(エスイーオー)
「Search Engine Optimization」のことで、日本語で検索エンジン最適化という意味。
インターネットで調べものをするとき、検索エンジンで特定のキーワードを入力して検索するが、その際に意図的にサイトの情報を検索結果の上位に表示させるマーケティング手法のこと。
(※2)アイキャッチ
Webサイト上で、ユーザーの目線を引きつける大きめの画像のこと。
(※3)バナー広告
Webサイト上に画像や動画などを表示させ、クリックすると詳細が説明されたWebサイトへと誘導されるというしくみの広告。
長方形や正方形など、さまざまな形のバナー広告がある。

それでは、前述の4つの工程について、制作現場ではどのようにしてWebサイトのデザインが行われているのか、みていこう。
要件定義
要件定義とは、どのような目的でWebサイトを制作するのか、解決したい課題はどんなことなのかを明確にする工程。サイト制作の依頼主に要望をヒアリングし、「どのような人をターゲットに想定しているのか」「Webサイトを見た人にどう行動してもらいたいのか」「既存のWebサイトのどこに問題があるのか」「改善したいポイント」などを確認し、どんなサイトを作るのか、基本コンセプトを考える。
「私がこれまでに手がけたサイトの中から、Webデザイン制作会社が運営するスクールのサイト制作を例にあげて説明していきます。
Webデザインスクールのサイトは、スクールを探している人が訪れるWebサイトなので、説明会の予約や入学の申し込みといった集客につなげていけるようなサイトにすることが大切です。
そのため、要件定義の段階で最初に行うのは、マーケティング担当者と、スクールの運営スタッフへのヒアリングです。
今のWebサイトの問題点やこんな見せ方をしたいといった希望、リニューアルの目的など聞き出します。
このとき、重要なポイントになるのが数字です。
Webサイトを訪れた人の数、最後まで読まずに離脱する人の確率や離脱している部分、問い合わせの数など、マーケティング担当者やSEO担当者から聞き、目標に足りない数字があればどうしたら達成できるサイトになるのか、チームのメンバーと話し合いを重ねます。
また、数字には表れないのですが、サイトを見た人に、『どんな印象をもってもらいたいか』という点も大切。
『このスクールには本気で教えてくれる先生がいる』『転職を目指して学んでいる人が多い』など、当校の雰囲気や特色が伝わるような、暖かみのある印象のサイトに仕上げることが必要です。
そこで、スクールの現場で働くスタッフや生徒さんからも話を聞き、このスクールで学ぶ価値についての理解を深め、そこからWebサイト制作のコンセプトを固めていくという作業もしています」

Webサイトの構成・レイアウト作成
どのようなWebサイトを作るのか、コンセプトが決まったら、ワイヤーフレームを作成する。ワイヤーフレームとは、Webサイトのレイアウトの骨格になるデザイン設計図。
Webサイトに掲載するコンテンツの位置や、ロゴやテキスト、画像の配置などを考えながら練り上げていく。
見た目の美しさだけではなく、ユーザーが見やすく、使いやすいサイトになるよう、デザイン案を考える。
「この工程でポイントになるのは、ビジュアルと情報の部分をどのようにするのか、ということ。
鍵を握るのは、ユーザーが最初に目にふれるトップページです。
クリックして開いた瞬間に見える部分なので、見せ方やどんなことを訴求するのか、わかりやすく伝えることに注力します。
どんなにかっこよい画面にデザインしても、何が書かれているのかわからなければ、一瞬で離脱されてしまい、読んでもらえなくなるのです。
また、説明会の予約などの申し込みフォームまでスムーズに誘導していけるよう、情報を掲載する順番や、クリックするボタンの位置や色合い、大きさを考えることも必要。
ほか、不足している情報を加えたり、読んでもらいやすいような文章の文字数や1行あたりの文字数を割り出すなど、考えることはたくさんあります」

Webサイトのデザインを作る
ワイヤーフレームに沿って、画像や配色、フォント、ロゴやボタンの位置など、具体的にデザイン。IllustratorやPhotoshopなどのグラフィックツールを用いてレイアウトの調整や画像の加工などを行う。
「Webサイトに掲載するテキストや画像など、必要な素材をそろえて色やフォント、全体のトーンなどを考え、実際のデザインに落とし込んでいきます。
デザインの際には、いろいろなWebサイトを参考にしていますが、それ以外でも、身近なところにヒントになるものはたくさんあります。
スイーツのパッケージやお店のディスプレイなど、『こんな形や色使いがあるんだ!』と、うれしい発見があったときには写真撮りをします。
そうするうちにアイデアのストックが増えていくので、Webデザインにもどんどん取り入れていますよ」

コーディング
コーディングとは、Webサイトが意図したように動かすことができたり、表示されるよう、コードを書く作業のこと。コーディングを行うことで、デザインした通りに文字や画像が表示されたり、アイコンボタンをクリックすると指定したページに飛ぶといった動作ができるようになり、Webサイトが完成する。
専門性の高い作業なので、制作するWebサイトの規模や、チームで分業してサイトを制作する場合には、コーディングを行うのはWebデザイナーではなく、WebプログラマーやWebエンジニアといった専門職が担当するケースが少なくない。
「当社のインハウスデザイナーの場合、コーディングはWebデザイナーの業務範囲ではなく、専門のエンジニアに依頼し、一緒にWebサイトを仕上げています。
また、当社のクライアントワークの制作チームも、コーディングはWebエンジニアが行っています。
ただ、これはあくまでも当社の進め方です。
Webデザイナー全体をみると、コーディングまでこなすケースもあり、コーディングやプロミングの高いスキルを身につけていることを強みに活躍の幅を広げている人もいます」
Webデザイナーになるには?
Webデザイナーになるには、資格は必須ではなく、なるためのルートはさまざま。大学や専門学校に通い、Webデザインを勉強
就職活動では、学んだ学部・学科、専攻などは問われないケースが多いが、大学、専門学校などの情報工学系、メディア系、デザイン系などに進学し、ソフトの扱い方やコーディング、デザインの基本スキルを学んでおくとプラスになる。☆ココもポイント
<Webデザインスクールで学ぶという選択肢も>
Webデザインスクールに通い、基礎的なスキルを身につけるという方法もある。
大学の一般学部で学ぶかたわら、Webデザインスクールで学んでいる学生もいる。
<他業種の仕事を経験した後、Webデザイナーになる人も>
新卒でWebデザイナーとして就職するほか、他の業種の会社勤めなどを経験してからWebデザインの世界へ転職するケースも多い。
未経験からの転職も可能だが、採用されるためには現場で即戦力になれるようなスキルと、ポートフォリオ(※)の提出が必要になる場合が多いので、Webデザインスクールで学び、転職する人も少なくない。
(※)ポートフォリオ
自分が作ったWebサイトなどの制作物・作品をまとめたもの。
新卒でWebデザイナーを目指す際にも、就職活動ではポートフォリオの提出が必要になる場合がある。
独学で学びながら、制作現場で働いて力をつける
Webデザインに関する参考書や、ノウハウを紹介しているサイト、動画で配信される無料講座などは多数。これらの教材を利用しながら独学で学んでスキルを習得し、制作現場で働きながらスキルアップしていく方法もある。
山崎さんにも話を聞いてみた。
実際、当社にも独学でスキルを身につけてWebデザイナーになったという人がいます。
いつでもどこでも勉強できて、費用もほとんどかからないのが独学のメリットです。
その一方で、独学は強い意志がないと、勉強を続けていくのは難しいというデメリットもあります。
私の場合、転職を目指し、Webデザインスクールに通いました。
Webデザインは奥が深いので、どこから勉強したらいいのかわからなかったので、独学では難しいと思ったのです。
スクールでは学費がかかるのですが、Webデザインの仕事に必要な基本スキルを体系的に学ぶことができたので、よかったと思います」
Webデザイナーの就職先は?
Webデザイナーの主な就職先は、Web制作会社、広告制作会社のほか、Webサービスを運営する会社や一般企業のWeb制作部署なども活躍の場となっている。フリーランスで活躍する人も
Webデザイナーの働き方は正社員のほか、契約、パート、派遣、アルバイトなどさまざま。Web制作会社などで経験や実績を積み上げてからフリーランスとして独立する人も少なくない。
Webデザイナーに必要な資格は?
Webデザイナーは資格がなくてもできる仕事だが、資格は一定の知識やデザインスキルがあることの証明になるし、取得を目指して勉強することで知識が増えるというメリットがある。Webデザイナーとして活躍するために役に立つ資格はいろいろある。例えば、次のような資格がある。
ウェブデザイン技能検定
Webデザインに関する幅広い知識と技能を認定する国家資格。3級から1級まで、3つのレベルがある。
Webクリエイター能力認定試験
Webデザインやコーディングのスキルを測る民間資格。実技試験のみのスタンダードと、実技試験と学科試験が実施されるエキスパートの2つのレベルがある。
Photoshop®クリエイター能力認定試験
Webサイト制作に必要な画像編集ソフト「Photoshop」の活用能力を認定する民間資格。実技試験のみのスタンダードと、実技試験と学科試験が実施されるエキスパートの2つのレベルがある。
Illustrator®クリエイター能力認定試験
Photoshopとともに、Webデザインに欠かせないグラフィックソフトがIlustrator。その実践的な操作スキルをもつことの証明になる民間資格。
スタンダードとエキスパートの2つのレベルがある。
HTML5プロフェッショナル認定試験
HTML、CSS、JavaScript(ジャバスクリプト)など、コーディングに必要な言語に関する知識と技術を認定する民間資格。Webコンテンツ制作の基礎スキルを測る「レベル1」と、最新のWebアプリや動的Webコンテンツの開発・設計をするスキルのレベルを測る能力を認定する「レベル2」の2段階が実施されている。
ウェブ解析士
Webサイトへのアクセス解析など、さまざまな解析データを活用し、成果を出せるWebマーケティングのスキルを認定する民間資格。このほかにも、Webデザイナーとしてのスキルアップに役立つ資格はたくさんある。
年齢や学歴、業務経に関係なく、誰でも受験できる資格試験もあるので、今から目指してみるのもいいだろう。

Webデザイナーに求められるスキルは?
ここからはWebデザイナーになるために、必要とされるスキルや能力について解説。デザイン力
ユーザーが何度でも訪れたくなるような魅力的なWebサイトをデザインするためには、デザインに関するスキルは必須。レイアウト、色彩・配色、フォントなど、基礎知識は身につけておきたい。
また、クライアントワークではさまざまな業界のWebデザインにかかわるので幅広く対応できるデザイン力を養うことも大切。
ツールを使いこなす力
考案したデザインを、画面上で実現するためには、デザインツールを使いこなす力が必要。Adobe(アドビ)社のIllustratorやPhotoshop、XD、Figma(フィグマ)といったツールの操作方法を身につけ、表現の幅を広げていくことが大切だ。
山崎さんからのアドバイスも紹介しよう。
最新情報をキャッチアップしながら、新しいスキルを身につけていくことが必要不可欠です」
コーディング力
デザインされたものを、Webサイトとしての機能を盛り込んで完成させるまでには、コーディングやプログラミングの作業が必要。そのためには、文章や画像をレイアウトしてWebページの土台を構築する「HTML」や、文字のサイズや色などを指定する「CSS」といったコードのスキルや、動きを表現するJavaScriptなどのプログラミングスキルを習得しておきたい。
山崎さんからのアドバイスも紹介しよう。
なぜならデザインは、コーディングが実装されたサイト上で表現されて形になるからです。
つまり、実装されたWebサイト上で、自分が思い描いたような表現を実現するには、コーディングのスキルが欠かせないのです。
私も、現在の業務ではコーディングは担当していませんが、コーディングの基礎スキルは身につけていて、役立っていると実感しています」
UI・UXの知識
UI(ユーザーインターフェース/User Interface)とは、Webサイトにおいては画面上に表示されるボタンやメニュー、スライドなどを直感的かつ効率的に使えるように設計されたしくみのこと。UX(ユーエックス)とはUser Experience(ユーザー エクスペリエンス)の略。
ユーザーにとって、価値のある体験や楽しさが提供できるようにデザインすること。
UIもUXも、ユーザーが使いやすいWebサイトにデザインするうえで重要なポイントになるので、基本的な知識は備えておきたい。
専門性を高めてUIデザイナー、UXデザイナーとして活躍する人も増えている。
マーケティングに関する基礎知識
Webサイトを作る目的は、多くのユーザーに訪れてもらい、商品やサービスの認知度を高め、購入やサービスの利用につなげること。そうしたことから、Webデザイナーにもマーケティングの基礎知識が必要とされている。
ユーザーがどんなことを求めているのか、サイトを訪れるユーザーはどんな人たちなのか…などを理解し、Webサイトをより効果的で使いやすいものに仕上げていく。
ちなみにマーケティングの手法には「「SEO(エスイーオー/Search Engine Optimization):検索エンジン最適化」など、さまざまなノウハウがある。
コミュニケーション力
Webデザイナーは黙々とパソコンに向かうイメージがあるかもしれないが、多くの人と接する仕事でもあるので、コミュニケーション力が必要。クライアント企業の要望を的確につかむために担当者から話を聞いたり、よりよいサイトをつくるためにプロジェクトチームのメンバーと話し合うなど、コミュニケーション力が求められる場面が多い。

Webデザイナーに向いている人は?
Webデザイナーの仕事はデザインやものづくりが好きなことに加え、依頼者の要望を沿ったWebサイトに仕上げていくために余白や文字の大きさやバランスなど細部までこだわることができ、緻密な作業に集中して取り組める人に向いている。Webデザイナーの年収はどれくらい?
Webデザイナーの年収について見ていこう。Webデザイナーの平均年収は約480万円
厚生労働省『職業情報提供サイト job tag(日本版O-NET)』の統計情報(※1)によると、Webデザイナーの平均年収は約480万6000円となっている。ちなみに国税庁の調査によると、日本の給与所得者全体の平均年収は年間458万円(※2)という結果となっており、Webデザイナーの収入は日本の平均より高いといえる。
(※1)厚生労働省『職業情報提供サイト job tag(日本版O-NET)』
(※2)日本の給与所得者の平均年収について
出典:国税庁『令和4年分民間給与実態調査』(令和5年9月発表)
フリーランスでも実力しだいで年収1000万円以上に
Webデザイナーは、フリーランスで活躍することも可能な仕事。収入は実力しだいという厳しい世界でもあるが、高いスキルをもって実績を築き上げ、年収1000万円以上をかなえている人もいるという。
山崎さんにも話を聞いてみた。
私の職場で、独立してフリーランスのWebデザイナーになった先輩たちの場合、コンスタントに仕事があって、収入もアップしたと聞いています。
『プログラミングにも強い』とか、『マーケティングの専門知識があってコンサルティングまでこなす』など、Webデザインに加えて高い専門性があれば、高収入をかなえることもできると思います」
Webデザイナーの将来性は?
経済産業省の『電子商取引に関する市場調査』によると、インターネット上で商品の売買やサービスの取引を行う市場規模は増え続けており、Webデザイナーの人材はますます必要となっている。この市場調査の結果を調べてみると、消費者向けの電子商取引の市場規模は2018年には17.9兆円だったのが2022年には22.7兆円に増加。
また、企業間電子商取引の調査結果をみても、2018年は344、2兆円だったのが2022年には420.2兆円の規模へと拡大している。
気になるのはAI技術の進歩。
今後、Webデザイナーの仕事はどうなるのか、山崎さんに聞いてみた。
でも、Webサイトを使って集客したり、モノやサービスをたくさん売るためにどうしたらいいのかといった、根幹のクリエイティブワークは、AIにはできないと思います。
この先、AIがめざましく進歩していっても、Webデザイナーでなければできない業務はあると思うので、これからも必要とされる職業であり続けるでしょう」
(※)出典
経済産業省『令和4年度 電子商取引に関する市場調査』
・調査結果概要
https://www.meti.go.jp/press/2023/08/20230831002/20230831002.html
・報告書
https://www.meti.go.jp/press/2023/08/20230831002/20230831002-1.pdf
Webデザイナーにインタビュー!
Webデザイナーとして活躍中の山崎さんに、目指したきっかけや仕事の魅力、やりがいなど、さらにお話を聞いた。Webデザイナーになったきっかけや経緯は?
新卒でフィットネスジムを運営する会社に就職し、その後、食品メーカーで広報の仕事に転身。
主には自社の情報をテレビやWebなどメディアに取り上げてもらうためにプレスリリースを配信したり、メディアからの取材に対応するといった業務を担当していました。
そんななか、自分自身で表現して伝えたいという思いが強くなっていったのです。
自分が好きなことを仕事にしたいなと思い、行き着いたのがWebデザイナーです。
もともとデザインには興味があったし、広報の業務でWebサイト制作を外部に依頼していたことから自分でWebデザインをやってみたいという気持ちがありました。
でも美大などでデザインを勉強する必要があるのかな…などと迷ったりもしましたが、Webの仕事は未経験でも転職が可能と知り、目指そうと決心。
広報の仕事を続けながらスクール(デジタルハリウッドSTUDIO by LIG)に半年間通い、基本を学びました。
卒業後、念願かなってWebデザイナーに転職することができました」

撮影協力/株式会社LIG(リグ)。同社では、年間およそ150のWebサイトをリリース。毎年、複数のデザインアワードを受賞している
グラフィックデザイナーとの違いは? Webデザイナーの仕事の魅力とは?
Webデザイナーの場合はWebサイトのデザインをします。
そうした違いはありますが、どちらもデザインによる課題解決を目的としています。
ただ、Webデザインは数字が出るので、ユーザーの反応をみて試行錯誤ができることや、実際にユーザーが画面を使用するので使いやすさなどを考慮する必要があることなどが違いといえます。
サイトに訪れる人の数、離脱する人の確率など数字が出るので、商品やサービスの売上にどんな効果が出ているのか、客観的な結果となって表れるのです。
数字が出るので怖さもあるかもしれませんが、何のために作るのか目的がはっきりしていて、サイトをデザインした効果がみえやすいことが、私にとっては魅力です。
例えば、スクールのサイトを改善したら、説明会の申し込み件数が増えたというケース。
それは、スクールを運営する人たちにとってもうれしいことですし、Webデザインのスクールを探している人たちの役に立っているんだなという実感もあります」
Webデザイナーの大変なところは?
自社のサイトであっても先輩たちの厳しいチェックで、『このクォリティーでは、使えません』などとダメ出しされることもあります。
特に入社した当時はダメ出しが何度も続き、広告バナーのラフを20枚以上作って全滅だったこともあります。
でも先輩たちはチェックするだけではなくて、『なぜダメなのか』『こうするとよくなる』と丁寧にフィードバックしてくれるので、勉強になることばかり。
『こんなところも大切なんだ…』と、気づきがあるのです。
それらを1個ずつ自分の引出しにしていき、『先輩から注意されたことは、今度は絶対に指摘されないようにしよう!』と思い、頑張ってきました。
次はもっといいものを作ろうと、自分なりの基準を上げ、スキルアップの努力を続けています」
この仕事のやりがいは?
依頼内容にぴったりのものや、期待された以上のレベルのものが作れたときには、すごくよろこんでもらえるんですよ。
『こんなにステキなものを作ってもらえた!」『本当にありがとう!』と言葉をかけてもらうことも多くて、『頑張ってよかった!』という気持ちが湧いてきます。
また、前職の広報の仕事で感じていた、自分で表現したものを発信できないもどかしさがなくなりました。
自分が作ったものが形になり、いつも見ることができて、しかもサイトの離脱率が下がるなど数字の改善になって表れたりすると、自分自身の成長を感じることができる…やりがいの多い仕事です」

高校生の皆さんへのメッセージ
その経験から言えることは、自分が好きなことや得意なことを活かせる仕事は、働いている時間の感じ方が違うなということ。
デザインのアイデアが浮かばないときでも、『こういうものを取り入れてみようかな』と楽しみながら取り組んでいるので、働いている時間が豊かなものに感じられるのです。
高校生の皆さんも進路選びに迷っているときは、好きなことやどんなことに興味があるのか、考えてみてはどうでしょう。
もしもそれがデザインやWebに関わることだとしたら、ぜひ、Webデザイナーを目指してほしいです。
将来、一緒に頑張りましょう!」
Webデザイナーの仕事に興味がある人は、いろいろなWebサイトを見てどんなふうに作っているのか考えてみたり、なるために役立つ学問や学校の情報を調べてみよう。
取材協力/株式会社株式会社LIG(リグ)、LIGブログ、デジタルハリウッドSTUDIO by LIG、取材・文/小林裕子 撮影/沼尻淳子 構成/高木龍一(編集部)
出典:ウェブデザイン技能検定、Webクリエイター能力認定試験、Photoshop®クリエイター能力認定試験、Illustrator®クリエイター能力試験、HTML5プロフェッショナル認定試験、ウェブ解析士