こんにちは、LIGの教育事業担当のペイです!
Webデザインの勉強がしたいけれど、仕事や育児などに時間をとられて、平日や日中はスクールに通えないという人もいるでしょう。
この記事では、独学でWebデザインのスキルを習得したいと考えている人に向けて、Webデザインに必要なスキルや独学に関する情報をご紹介いたします。ぜひ今後の学習計画に役立てていただければと思います!
また、本記事と同じ内容をYouTubeにもUPしています!動画や音声で楽しみたい方はこちらを参照してみてくださいね
目次
Webデザインは独学で習得可能なのか
sty
Webデザインは独学でも習得可能です。ただし、独学する場合に大切なのは、最初にゴールを決めるということです。
しっかりと目的を設定して、何をどのようにどういった形で学べばいいのかを確認し、モチベーションを高めたうえで、勉強時間をしっかり確保する必要があります。これはWebデザインだけでなく、どんなジャンルにおいても独学でお勉強を進める上で大切なことです。
また独学の中でわからないことが出てきてしまったときに、自分の周りに話を聞ける人を作っておくことも重要です。自分では解決できない問題にぶつかったときに、解決せずに進めずモチベーションが下がってしまうというのもよくあるお話です。
まずは独学でスキルを磨くという覚悟を決め、ゴールに向けて突き進みましょう。
Webデザインに最低限必要なスキル
Webデザインのスキルとして、最低限必要なものをわかりやすく解説します。
デザイン
Webデザインを行ううえで最低限必要なスキルのひとつが、デザインに関するスキルです。
優れたデザインの多くは、デザインの基本4原則(近接、整列、反復、コントラスト)を上手に組み合せています。この基本原則を意識しておくだけでも、デザインを学ぶうえでの発見があるでしょう。
また理論だけでなく、デザインを作成するためのツールを使いこなせることも重要なスキルです。Photoshop(フォトショップ)やIllustrator(イラストレーター)などのツールは、今ではWebサイト制作において必須になっています。
しかしデザインのソフトができれば良いというわけではなく、デザイナーとしての思考も身につけていくことが必要です。ユーザーが何を求めているのかを理解したうえで、サイトやページのデザインをしなくてはいけません。意図のあるデザインをしていくことが求められています。
よいデザインを作り上げるためには、UIデザイン・UXデザインについての理解、さらには後述するプログラミングやコーディング、マーケティングリテラシーなどの知識が必要になることもあります。
コーディング
コーディングとは、ブラウザなどで見た目を作るスキルのことです。コーディングについての知識は、Webサイトを作るうえでの基本の基本であり、Webデザイナーにとっても必須といえます。
コードの中でも、Webサイトの情報構造(ヘッダーやフッター、見出しなど)を形づくるコードが「HTML」であり、「CSS」はレイアウトやマージン、文字の色など、サイトの装飾を整えるためのものです。HTMLやCSSを整えることが、わかりやすく読みやすいWebサイト作りにつながります。
プログラミング
HTMLとCSSでデザインしたWebサイトに動きをつける役割を果たすのが、JavaScriptやjQueryです。クリックすることで詳細を表示したり、写真をスライド式で表示したりと動きをもたせることで、より使いやすくなり、デザイン性も高まります。
JavaScriptのようなスクリプト言語を組み立てたり、jQueryなどのライブラリを適切に活用するのは本来プログラマーのスキルでしたが、最近では、同業他者との差をつけるために習得しているWebデザイナーも多く、優れたWebサイト作りには必須の知識ともいえます。限られた画面スペースを有効利用する手段でもあるので、ぜひ身につけておきましょう。
マーケティングリテラシー
そもそもWebサイトがなんのために利用されるのかを理解することが必要です。
営業・集客・認知など、さまざまな方向性の役割を担うことができるのもWebサイトの特徴です。
また、ユーザーにアクセスしてもらえるサイト作りに欠かせないのが、検索結果の上位にサイトが表示されるようにすることです。これを、サーチエンジン最適化(SEO)対策といいます。Webデザイナーとして、魅力的なWebサイト作りをしたいなら、SEO対策やアクセス解析の知識も身につけておかなければなりません。
SEOやアクセス解析のためには、コーディングやデザインの段階からさまざまな側面を検討する必要があります。さらに、Webサイトの改善に向けても、大切な知識といえるでしょう。
Webデザインで使用するツール
ここでは、Webデザインで使用するさまざまなデザインツールについて解説します。
Photoshop
Photoshop(フォトショップ)は、ドットの集合で表現されたラスター画像処理やWebデザインに用いられるソフトです。デザイン全体のレイアウトはもちろん、写真全体の色味を調整したり、フィルターやぼかしを加えることができ、ビジュアル面での作り込みに適しています。
Webデザインの基本ツールではありますが、初心者には少々難しく感じられるかもしれません。優れたデザインのホームページを真似するなどしてスキルを習得していきましょう。
価格は、フォトプランで11,760円(税抜)/年、単体プランで26,160円(税抜)/年です。
Illustrator
Illustrator(イラストレーター)は、ある形状に線、曲線などと意味を持たせたベクター画像の作成・編集用ソフトです。基本ツールであるPhotoshopでデザイン・レイアウトしたのち、Illustratorでアイコンやロゴ、イラストなどの複雑な形をもつパーツを作成するという手法がよく用いられます。
またIllustratorは、複雑な曲線を4つのコントロールポイントを動かしながら作成するベジェ曲線が使えます。これは、優れたWebデザインを作るためには欠かせません。
価格は、単体プランで26,160円(税抜)/年となっています。
Sketch
Sketch(スケッチ)は、PhotoshopやIllustratorなどと異なり、ページのレイアウトといったUIデザイン・Webデザインに特化したツールです。画像を数値で記録するベクター画像を扱うだけに、解像度の変化に強いのが特徴で、操作も非常に直観的です。
Photoshopなどと比べて非常に軽快に動き、操作も簡単なので、初心者でも無理なく使うことができるツールのひとつです。
価格は99ドル/年で、1年間のアップデート保証があります。
Adobe XD
Adobe(アドビ) XDは、先ほど紹介したSketchと同様、UIデザインに特化したツールです。ベクター画像を扱うソフトで、ウェブサイトのワイヤーフレーム制作に適しています。操作性において、Sketchよりも優れているといった評価もあります。
開発初期の試作品に用いるプロトタイプ機能が備わっており、チームでデザインを共有する際にも便利です。新規案件の開発に向いたソフトといってもよいでしょう。
無料で体験版を手に入れることもできますが、単体プランの価格は、1,180円(税抜)/月です。
Webデザインを独学で習得する方法
Webデザインを独学で習得する方法について、身につけられるスキルや特徴などを解説します。
オンラインサービス
最近では、コーディングやプログラミングを習得するためのオンラインサービスが充実しています。無料でありながら、基礎から応用まで学べるサービスも増えています。
オンライン学習サービスの特徴は、知識をインプットしながら、ブラウザ上で実際にコーディング・プログラミングしてアウトプットできるという点にあります。効率よく学習を進めることができ、独学にはもってこいの方法ともいえます。
オンラインスクールとしては、「Code Camp」「TechAcademy」「WebCamp Online」などがあります。詳しくは以下のサイトをご参照ください。
参考:Webデザインの勉強におすすめのオンラインスクール・学習サービスまとめ
Webサイト
初心者が実際にWebサイトをデザインしようというとき、まずは現行のWebサイトからテクニックやアイデアを学ぶ必要があります。参考にしたい優れたWebデザインが集められているのが、Webデザインのギャラリーサイトです。
WebDesign Trends、MUUUUU.ORG、WebDesign Clipなどのサイトを定期的にのぞき、最新の優れたデザインを確認しておきましょう。
また、WordPressなどでサイトを制作し、デザインのアレンジを実践し、応用できるかどうか確かめてみるのもおすすめです。
書籍
HTMLやCSSなどのコーディングなら、書籍でも学ぶことが可能です。書籍を選ぶ際のポイントは、最新ソフトに関する情報が載っているものを選ぶということです。これからデザインを学ぶのですから、現在主流となっているバージョンを選んでおいて間違いはありません。また、モバイル端末に対応したサイト作りができるというのも大切なポイントです。
基礎から応用まで多種多様な知識がまとめられており、系統だって知識を身につけることができます。
HTMLとCSSを学習する際におすすめなのが、『スラスラわかるHTML&CSSのきほん』(狩野祐東著)や『HTML5/CSS3モダンコーディング』(吉田真麻著)です。
Webデザインを独学で学ぶメリット・デメリット
さいごに、Webデザインを独学で学ぶメリット・デメリットについてわかりやすく説明します。
メリット
Webデザインを独学で学ぶ最大のメリットは、時間に縛られず、自分のペースで学べるという点です。決まった時間に授業に出たり、通学に時間を割く必要がないため、子育てしながら仕事をしながらでも学ぶことが可能です。
さらに、スクールに通うのと比較して費用を抑えられるのも、独学のメリットのひとつです。無料のオンラインサービスで基礎力をつけ、書籍で体系的に学べば、最低限の費用だけですみます。
デメリット
一方、デザインを独学で学ぶデメリットは、わからないことがあってもなかなか人に尋ねられない点です。インターネットや書籍で解決法を探ろうとしても、解決しないことも多いでしょう。そういった停滞期間があることも覚悟しておく必要があります。
こうした理由から、スキルの習得に時間がかかりがちなのも、独学のデメリットといえます。初心者がスキルを習得するためには、早くて1年かかるといわれています。自分のペースで勉強する独学の場合、どうしてもゆっくりになりがちでもあり、2年から3年近くかかることも覚悟しておいたほうがよいでしょう。
まとめ
Webデザインは独学でも習得できますが、デザイン、コーティング、プログラミング、リテラシーのスキルを身に着ける必要があります。独学の場合、自分のペースで勉強できますが、不明点を人に聞くことができないので、習得に時間がかかってしまいがちです。
また、近年のWebデザイナー需要として、ただサイトが作れれば転職ができる時代ではありません。Webサイト制作についての全体的な理解や、勉強の段階でどのような視点を身に着けてサイト制作をしているのかを見られるようになってきました。
Webデザインを独学で学び始めたものの、本当に習得できているのか不安……。LIGが運営するWebデザイナースクールには、そんな方がたくさん通われています。現役Webデザイナーによるマンツーマンの指導が受けられ、制作会社ならではのオリジナルカリキュラムが学べます。自分では身につけにくいWebディレクションの部分や、マーケティングの知識、デザイン思考など、サイト制作に必要な知識や視点を、LIGの現場のノウハウをもとに授業をしていきます。
スクーリングに関しても平日10時〜22時、休日は10時〜20時、家でも学習できますので、さまざまなライフスタイルに対応可能です。Webデザインを学びたい方は、ぜひ一度気軽にお話を聞きに来てくださいね!
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。