Workook
仕事図鑑

独学でwebデザイナーは可能?独学で必要な知識・スキルを身につけるための勉強方法

ログインすると、この記事をストックできます。

プロフィール

独学でwebデザイナーは可能?独学で必要な知識・スキルを身につけるための勉強方法

スマートフォンの普及やインターネット回線の高速化にともなって、Webサービスに力を入れる企業が増えています。

これまでは実店舗で買い物などの取引が当たり前だった世のなかから、今ではインターネット上で完結できるような世界へと変わりつつあります。

そのことからもWebサイトを訪れるのが日常的になり、需要が高まっている職業がWebデザイナーです。「Webデザイナーのスキルを独学で習得して仕事にしてみたい」と考える人も多いのではないでしょうか。

本記事ではWebデザイナーの仕事内容や必要なスキル、独学でWebデザイナーになるコツを解説しています。

また、独学でWebデザイナーになった株式会社「クリエステッチ」寺井 隆敏さんや、Webデザイン講師でもある伊賀弓さんに、Webデザインの学習に関するおすすめの勉強方法について聞いてみました。

独学で必要なスキルを身につけ、Webデザイナーを仕事にしたい人は、ぜひチェックしてみてください。

目次

Webデザイナーの仕事内容と必要なスキル

写真/Canva

Webデザイナーとはサイトの目的を果たすために最適な形にデザインする仕事です。どのようなデザインにするかによってサイトの使いやすさや見やすさが変わり、成果にも大きく影響する重要な要素を担っています。

Webサイトにも企業のコーポレートサイトや、サービスサイトECサイトLP(ランディングページ)など、種類はさまざまです。

Webデザイナーの仕事はデザインだけにとどまらないので、その仕事内容と必要なスキルを解説します。

Webデザイナーの仕事はデザインだけにとどまらない

写真/Canva

まずはWebサイトを制作するにあたって、クライアントから解決したい課題をヒアリングすることが大切です。ヒアリングを怠って見た目のデザインを単によくしても、目的に沿ったサイト制作はできずに効果が見込めません。クライアントの抱えている課題や悩みを親身に抽出することからはじめましょう。

課題を抽出したあとは、サイトのコンセプトや構成を固めて、デザイン、コーディングへと移ります。コンセプトや構成を固めないとサイトのゴール、方向性、デザインに一貫性が保てません。その結果、サイトに訪れた人に世界観が伝わらず、知りたい情報にも辿り着けないことでサイトから離脱されることもあるでしょう。

サイトをリリースしたあとはサイトへの流入があるかや、おこなった施策が成約率UPに結びついているかなど効果の測定も大切です。

会社やプロジェクトによってはディレクター、デザイナー、コーダーなどの担当で分業することもありますが、このように課題の抽出から設計、デザイン、コーディング、効果の測定と一連の流れをおこなうこともWebデザイナーの仕事といえます。

こうしたWebデザイナーの仕事を理解するうえで役立つ一冊をご紹介します。

『イラスト図解式 この一冊で全部わかるWeb制作と運用の基本』(NRIネットコム株式会社小出修平(共著))

Web制作の専門用語や、業務プロセスの基本的な知識が網羅され、イラストや図解でわかりやすく解説されています。

Webデザイナーに必要なスキルって?

写真/Canva

ここではWebデザイナーに必要なスキルを解説します。紹介しているスキルは初期段階からすべて習得する必要はありませんが、今後を見据えた際に必要となることは理解しておきましょう。

デザインの基礎知識

Webデザイナーの仕事をするうえでは、デザインの4つの基本原則(近接・整列・強弱・反復)や配色のルールなど、デザインの基礎知識は最低限必要です。

基本原則を押さえることで、伝えたい情報を効果的に伝えられます。昔に比べて洗練されたサイトが多いなかで、感覚でデザインをして効果を出せるような仕事ではないことを理解しておきましょう。

デザインソフトの操作スキル

Webデザイナーの仕事でおもに使われるソフトがAdobe社のPhotoshopとIllustratorです。

Photoshop写真の加工によく使われるソフトで、サイト内の画像をきれいなデザインにするために必要となります。

Illustratorはロゴやボタンなどのさまざまなオブジェクトやイラストの作成に必要です。

Webデザインの制作現場ではPhotoshopのほうが利用頻度が高いため、Photoshopを優先して覚えるのも良いでしょう。

また、レスポンシブデザイン※を制作する際に役立つfigmaAdobeXDなどのUIデザインツールも覚えておくと役立ちます。

作業効率を上げる機能があり、デバイスごとの見た目や操作感を試せるなどのメリットがあり、Webデザインの現場で使用されることも増えています。

※レスポンシブデザイン:スマホ、タブレット、PCなどさまざまなデバイスごとに異なるレイアウトやデザインを一つのHTML、CSSファイルで表示させることができるデザインのこと。

コーディングの知識(HTML/CSS)

写真/Canva

デザインをWebページで正しく表示させるために、コンピュータが理解できる言語で指示することをコーディングと呼びます。

そこで覚えておきたい言語がHTMLとCSSです。

HTMLとはWebページを作成するための言語のことです。インターネット上で公開されているWebページのほとんどはHTMLで作成されています。

CSSとはWebページの文字の色や大きさ、背景、配置など、見た目のデザインを指定するための言語です。

Webデザイナーは少なくともこのふたつの言語を理解しましょう。

ほかにもサイトに集客するためのWebマーケティングのスキルや、成約に必要なライティングスキルなどもあります。いくつかのスキルをかけ合わせることで、Webデザイナーとしての強みや、優位性をつくることも可能です。

独学でWebデザイナーになる、4つのコツ

写真/Canva

ここからは独学でWebデザイナーになるための4つのコツを解説します。独学でWebデザイナーになるのは簡単ではありませんが、不可能なことではありません。そのためには、効率よく、独学のコツを押さえていきましょう。

具体的な目標(期間・習得スキルなど)を決める

独学の敵は自分自身といっても過言ではないです。独学なので自分のペースで勉強できるのは利点ですが、意志を強く持たないと継続するのがむずかしいものです。

Webデザイナーになりたい理由を明確にして、そのなかで具体的な目標を決めるようにしましょう。

コーディングでソースコードを記述する際などに、慣れないことでうろたえてしまい、諦める人もいるためです。

具体的な目標は、いつまでにどんなスキルを身につけるかなど、期間と習得スキルを決めるのがおすすめです。

計画・スケジュールを立てる

写真/Canva

具体的な目標を決めたあとは計画を立てましょう。

まずは大きな目標を長いスパンで考えて、達成するためには日々、どういったことをやるべきか逆算して計画に反映させることが理想です。

計画に反映させないと、「明日は何しようかな」などと考える時間が日々発生し、時間のムダになります。日々やるべきことを淡々と継続して繰り返し、計画の進捗や目標とのズレを定期的にふり返るようにしてください。

以下に目安の学習スケジュールを参考で添付します。

学習スケジュールの参考/Canva

SNSで個人の活動を発信する

写真/Canva

独学でWebデザインを学ぶことは時に孤独で、うまくいかないことや、わからないこともでてくるでしょう。

そういったなかでSNSを有効活用するのをおすすめします。

Webデザインの勉強をしていることをSNSで発信すると、同じような境遇の人や、デザイナーの先輩とつながりを持てる場合があります。時にはアドバイスを受けたり、一緒に勉強する機会も生まれるかもしれません。ひとりではむずかしいことでも、つながりができるとがんばれるのが人間でもあります。

ただ注意したいのが、初心者相手に詐欺行為を働いてくる人間もいるため、怪しいと感じたら距離を取るようにしましょう。

Webデザインに関する資格を取る

写真/Canva

独学で勉強を続けるためにも、モチベーションの維持は大切です。Webデザインに関する資格を取ることも視野に入れると、自ずと勉強するようにもなるので検討してみてはどうでしょうか。

また資格によっては箔がついたり、ほかのデザイナーと比べた際に優位性にもつながるのでおすすめです。

以下にWebデザインに関するおすすめの資格を紹介します。

ウェブデザイン技能検定

Webデザインに関する唯一の国家資格であり、1~3級まで資格があります。3級は実務経験のない人でも受講できる試験で、筆記と実技試験から成ります。

Webデザイナー検定

Webデザインに必要な知識や・技能を評価する検定試験です。ベーシックとエキスパートの2つの資格にわかれ、筆記と実技試験から成ります。両試験とも誰でも受験することが可能です。ベーシックは比較的受かりやすく、一定の知識を有することの証明にもなるのでおすすめです。

独学でWebデザインを学ぶための、4つのステップ

写真/Canva

ここでは独学でWebデザインを学ぶための手順を3つのステップに分けて解説しています。学ぶために必要なツールや、実際にWebデザインを仕事として受け持つまでを解説しています。

①Webデザインに必要なツールを揃える

Webデザインを学ぶにあたっては、必要なツールを揃えましょう。パソコンについては、以下を目安にしてみてください。

・OS:Windows10もしくはiOS最新版

・CPU:Intel Core i5以上推奨

・メモリ:16GB以上

・ハードディスク:500GB以上

・モニターサイズ:15~20インチ以上

Webデザイナーの仕事は多くの画像やイラストなどの重いデータを扱うため、PCの性能にはこだわりたいところです。

前述したPhotoshopやIllustratorなどのデザイン用のソフトも忘れずに揃えてください。

また、コーディングする際に必要なエディタですが、プログラミング用のエディタを使用するのをおすすめします。

メモ帳のようなテキストのみを編集するソフトでも可能ですが、Adobe DreamweaverのようなHTMLやCSSの記述に特化したエディタがあるので、そちらを選びましょう。

②教本をベースに学習を進める

Webデザインに関する教本は書店にいくつも並んでいます。これらをベースにして基礎を学びましょう。

基礎を学んだあとは、教本内にあるサンプルサイトや、実在するサイトを参考に、実際にWebサイトをつくってみましょう。

Webサイトを実際につくる過程で自分に足りないスキルが見えてくるはずです。

➂自分オリジナルのサイトをつくる

ほかのWebサイトを参考にしてつくったあとは、自分オリジナルのサイトをつくってみましょう。実際に自分がつくったサイトで集客ができるのか検証するのもおすすめです。

Webデザインにくわしい人が周りにいれば、アドバイスを受けることも検討してみてください。ここで制作したWebサイトは自分の作品(ポートフォリオ)として、仕事を獲得するために有効活用もできます。

④クライアントワークを通して学ぶ

自分のサイトが完成しスキルも備わった段階になれば、実際に仕事を請け負うようにしましょう。

クラウドソーシングなどで簡単な案件からはじめるのが一般的です。

クライアントワークは金銭が発生するため、クライアントが求める成果物を納品しなければなりません。

お金をもらう以上はプロの意識を持って制作する必要がありますし、その過程が血肉となって成長を進めます。

また、クライアントからもフィードバックといった形でアドバイスをいただける機会もあるので、前向きにスキルの向上に努めましょう。

Webデザインを独学するためのツール(書籍・動画・サイトなど)

写真/Canva

デジタルハリウッドの大学やスクールで講師として活躍している、フリーランスWebデザイナーの伊賀弓さんにWebデザインを独学する時におすすめする書籍やサイト・SNSを聞きました。

Webデザイン関連の書籍

写真/Canva

基本的なデザインのいろはがまとめられている書籍の他、良いデザイン事例はインターネットでもたくさん見つかるため、特にダメなデザインの事例となぜダメなのかのポイントが分かりやすく書かれているものがおすすめ。

『ノンデザイナーズ・デザインブック[第4版]』(Robin Williams著)

Webデザインに限らず、名刺やプレゼン資料などデザインに関わる基本原則が学べます。

プロデザイナーでなくても分かりやすく整理されている、約20年前から読み続けられているロングセラー本です。

『けっきょく、よはく。余白を活かしたデザインレイアウトの本』(ingectar-e著)

先輩デザイナーとこれから学ぶ新人デザイナーさんの会話形式でわかりやすいのが特徴です。

色んな作例のOK事例とNG事例が載っていて、比較から学ぶことができます。

同じシリーズに、『ほんとに、フォント。』『あたらしい、あしらい。』『いろいろな、いろ。』があります。

『赤ペン添削でわかりやすい!選ばれるデザイナーへの道』(上司ニシグチ著)

SNSでも話題の著書による、上司がいないデザイナーのための添削本なので、独学でWebデザイナーを目指す人にもおすすめ。

新米デザイナーの作品を赤ペン添削しており、ダメなポイントが具体的にわかります。

Webデザイン情報を発信するサイト・SNS

写真/Canva

サイトやSNSは、実際に制作する時のためのインプットを目的に活用します。

良いデザインや参考になりそうなデザインをどんどん探して溜めておくのがおすすめ。

クライアントや一緒に仕事をする人とのデザインのすり合わせにも使えます。

サルワカ

名前の通り、サルでもわかるをテーマにWeb制作に関するノウハウを発信しているサイト。更新頻度も高いので、最新情報がわかり、コーディング事例もたくさんのっているので実践で参考になります。

ピンタレスト

インプットのためにひたすら参考になりそうなデザインや気になるデザインを集めておきます。普段からインプットし、参考事例をためておくことで、クライアントや他の人とのデザインイメージサンプルに活用ができ便利です。

1GUU

優れたWebデザインのサイトをあつめたリンク集。Facebookページを「いいね!」で購読登録しておくことで、毎日デザインに関わる情報が手に入ります。自動的に無理にでも情報がはいってくるように環境をつくることが大切です。

イラレ職人コロ(Twitter)

Adobe Illustratorの具体的なケースごとの使い方など、とにかくイラレに関することを発信しています。

上司ニシグチ(Twitter)

『赤ペン添削でわかりやすい!選ばれるデザイナーへの道』他、上司がいないクリエイターのオンラインコミュニティを運営している上司ニシグチさんのアカウントです。

〈成功秘話〉身に付けるべきビジネスマインド。独学からWEBデザイナー、Web制作会社経営へ

写真/Canva

Windows95が日本で発売を開始しインターネットが一般に広がった1995年に、大学で映画制作を学んでいた寺井隆敏さん。

卒業後、研究生として大学に在籍している時期に、本を片手にWeb制作を独学で学びはじめました。

「小学生の頃からPCに触れ、大学の同級生のなかでもいち早くインターネットを取り入れた」という寺井さんは、大学や劇団にアクセスして素晴らしいキャストを集めることができた経験から、誰もが利用できるシステムを作りたいと、独学で制作し立ち上げたのがWebサイト『CINEMA PLANNERS』です。

「映画制作には欠かせないキャストやスタッフの募集窓口や、情報交換の場として重宝され、気づけば、映像制作を学ぶ大学のほとんどで利用されていました」22年経った今も、『CINEMA PLANNERS』は、学生のみならず映画制作に関わる人にとって貴重な映画制作プラットフォームとして利用されています。

『CINEMA PLANNERS』の実現に必要であることをきっかけに、システムやサーバーについても学び、寺井さんは独学で身につけたスキルを活かして仕事を受けるようになります。クライアントの幅広い要望に対応するには、時には仕事を受けてから技術を習得することもあったのだとか。

それでも「あらゆる手を尽くしてやり遂げ、期待以上の仕事をすることを心がけていた」と言います。さらに積極的に人脈を広げ、紹介によって仕事を継続的に獲得することができました。

「仕事はできて当たり前、あとは人間性を買ってもらえるかどうかが大事」だと寺井さんは考えています。

現在、寺井さんはWeb制作会社「クリエステッチ」で事業を率いています。

同社の社員は全員独学でスキルを身につけた人ばかりだと言います。

「独学のほうがやる気が感じられます。やれる人は独学でも人以上のものを作ってくる。あとはコンセプトを持ってモノをつくっているかが大事なんです」と寺井さんは話します。

<寺井さんのおすすめの書籍>

『ニューエリート グーグル流・新しい価値を生み出し世界を変える人たち 』(ピョートル・フェリークス・グジバチ著)

〈まとめ〉独学で必要な知識・スキルを身につけるための勉強方法

写真/Canva

ここまで、独学でWebデザイナーになる方法について解説してきました。

独学でWebデザイナーになるのは簡単ではありませんが、不可能なことではありません。

本記事では独学でWebデザイナーになるために、スキルを学ぶためのコツや、書籍、SNS情報などを紹介してきました。本記事を参考にしつつも、まずは実際に頭や手を動かして、試行錯誤しながら学んでいきましょう。

ある程度知識やスキルが身についたあとは、臆せずに仕事を請け負うようにもしてみてください。

この記事をシェアする
  • LINEアイコン
  • Twitterアイコン
  • Facebookアイコン