JOB STAGE
デザイナー・クリエイター専門の求人情報サイト ジョブステージ

独学でWebデザイナーになるには?

独学でWebデザイナーに転職・就職するポイント

Web業界の特徴は、業界が歴史が浅いため、他の業界経験者が多く転職してくる業界でもあります。もともとはグラフィックデザイナーの方、映像制作建築・空間デザインを行っていた方等、クリエイティブ業界の中でも転職する方も大勢います。需要も多いので未経験者でもしっかり勉強すれば、比較的転職しやすい業界でもあります。ここではどうやったら独学でWebデザイナーに転職できるか?独学の際のポイントを紹介していきます。

Webデザインの上達のポイント!

独学でWebデザインを学ぶ為にはステップがあります。こちらを参考にあなたに合った勉強方法を見つけて下さい。

  1. 好きなデザインのWebサイトをブックマーク
  2. Webデザインの基礎を紹介している書籍を購入
  3. Fireworks・Photoshopで好きなサイトのデザインを模写
  4. 制作したいWebサイトをデザイン
  5. 架空の会社・サービスを考えてデザインしてみる。

1.好きなWebサイトをブックマークする理由

初めはWebデザインが素敵だなと感じたサイトをインターネット上で探して、ブックマークしましょう。ブックマークの数は多ければ多いほど良いです。Webデザイン未経験の方が、デザインを独学で学ぶ為には最初は良いと感じるウェブサイトを沢山見て、何故良いと感じるのか考える時間が必要です。

2.Webデザインの基礎を紹介している書籍を購入

ブックマークしてある程度、量が溜まったら、書店でWebデザインに関する書籍を探しに行って下さい。最初は入門編で結構ですので、Webデザインを平易な言葉で説明している書籍が初めは分かり易くて、良いかもしれません。基本的なレイアウト、ユーザーインターフェースデザイン、色彩による心理効果等、デザインの基本を理解するのが理想です。

3.好きなサイトのデザインを模写する理由

未経験者の方はWebデザインのデータ作成に使用されている、アプリケーションソフト「Photoshop・Fireworks」の基本的なスキルを習得する必要があります。最初は何をつくれば良いか分からない方がほとんどだと思いますので、「Photoshop・Fireworks」に慣れる為にも、一番最初にブックマークしたウェブサイトを見ながらデザインを模写したり、スクリーンショットを撮ってから、模写する事をお勧めします。

レイアウトの方法、色の設定、文字ツール、オブジェクトをどう取扱うか?明度・彩度の・明るさの調整方法等、「Photoshop・Fireworks」独自の操作方法を習得して下さい。一つのサイトのデザインを模写するだけでなく、出来るだけ色々な種類のデザインを模写してみて下さい。最初は戸惑う事が多いと思いますが、慣れてくるとデザインの意図や目的が少しずつ理解できるようになってきます。「Photoshop・Fireworks」にも慣れてきたらこの勉強方法は終えて下さい。

4.最初は制作したいWebサイトをデザインしてみる!

ある程度「Photoshop・Fireworks」の操作方法に慣れ、Webデザインをするにあたっての流れが想像つくようになってきたら、次は自分で0からデザインしてみましょう。これは未経験者が転職活動時に提出する、ポートフォリオの一部となる大事な制作物となりますので頑張って挑戦して下さい。最初は自分のブログをデザインする事から始めるのが作りやすいかもしれません。他に制作したいWebサイトがあるならそちらを優先して下さい。

5.架空の会社・サービスを考えてデザインしてみる。

制作したいWebサイトやブログのデザインをある程度行ったら、次は架空の会社・サービスを考えてデザインしてみると制作しやすいですしポートフォリオにバリエーションが出てきます。例えば、架空の航空会社をネーミングから考えて、ロゴデザイン、ウェブサイトのデザインをと、次々に制作していきましょう。この制作過程は世の中のデザインが行われている基本的な流れを疑似体験できます。自分がつくりたいものを作るのでなく、プロのWebデザイナーとして就職する為に、より近い領域でデザインを勉強して下さい。

未経験者はデザインしたWebサイトの数がポイント!

未経験者の方がポートフォリオを制作するにあたって、最初はプロのクオリティにはなかなか辿りつけません。それでも転職活動を行う際にはポートフォリオの提出を求められます。未経験者の方は数を出来るだけ多くつくり準備して下さい。

HTML・CSS(コーデイングスキル)の上達のポイント!

html5とcss3を習得!

最初に買う書籍は?

HTMLとCSSが一緒に学べるような基本的な事を丁寧に解説している本を購入して下さい。最初にHTMLとCSSの機能・仕組みや関係性を理解しないとコーディングスキルの上達は無理です。特に独学の場合は、Web上の情報だけですと、情報が多すぎるので、信頼できる情報を判別するのが困難だと思います。最初の一歩は書店で自分にあう一冊を見つけて下さい。

気になるWebサイトのコードを解読する

クオリティの高い、気になるWebサイトのコードをブラウザーで見て、どのような構成になっているか解読する事がコーディングスキルを上げる為のポイントです。プロのコーダー職の方も普段から勉強の為に、人の書いたコードを読み解く事をしている人も多いです。

自分でデザインしたWebサイトを実際コーディングしてみる

ある程度HTML・CSSを理解できたら次は自分でデザインしたウェブサイトをコーディングしてみましょう。未経験者が転職活動する際に、コーディングスキルがあると転職活動を有利に進める事が可能です。デザイナーのデザイン力やセンスはすぐには伸びませんが、コーディングスキルは技術と知識があればある程度早いスピードで習得てきますので、採用される確率が上がります。もちろんこちらもポートフォリオで紹介するようにして下さい。レンタルサーバーを契約してアップロードしておくのが理想的です。

公開日:
最終更新日:

人気アクセスランキング!Best 8!

PICK UP!

ピックアップ!注目企業を紹介!

株式会社スタジオネオプロジェクト
Studio staff

スタジオスタッフ募集!

雇用形態:
契約社員
給  与:
月給18万円~
勤 務 地:
東京都目黒区・台東区
Camera Assitant

カメラアシスタント募集!

雇用形態:
正社員(中途採用・新卒採用)
給  与:
月給179000円
勤 務 地:
東京都 新宿区
Package Designer

食品パッケージデザイナー募集!

雇用形態:
正社員(中途採用・新卒採用)
給  与:
月給22万円〜
勤 務 地:
大阪府 池田市
Designer

リノベーション設計スタッフ・インテリア設計スタッフ募集!

雇用形態:
1. 正社員(中途採用・新卒採用)、2. アルバイト
給  与:
1. 月給20万円〜月給30万円、2. アルバイト:時給1,000円〜1,500円
勤 務 地:
埼玉県 さいたま市
Assitant director

アシスタントディレクター(企画/ライティング)募集!

雇用形態:
正社員(中途採用)
給  与:
月給23万円〜65万円
勤 務 地:
東京都 渋谷区
Studio assitant

スタジオアシスタント募集!

雇用形態:
正社員(中途採用・新卒採用)
給  与:
月給18万円以上
勤 務 地:
東京都 渋谷区
JOB STAGE

Job Stageについて

ジョブステージは、デザイナー・クリエイターの為の求人サイトです。グラフィックデザイン・広告業界・DTP業界、Web業界、フォトグラファー・撮影業界、映像・動画業界、編集・出版業界、プロダクトデザイン業界、建築・インテリア業界、ゲーム業界等の求人情報を掲載中!デザイナー・クリエイターのプロフェッショナルの為に求人広告を毎日更新で掲載しています。御陰さまでジョブステージは2005年6月1日より運営開始、2020年で運営16年目を迎える運びとなりました。各業界のお仕事をお探しの方は、ジョブステージをどうぞご利用ください。

  • FOLLOW US
  • twitter
  • facebook

Renewal Campaign!

採用担当者様、掲載お申込みはこちらから
現在、リニューアルキャンペーン開催中!7週間、無料で掲載できます! 先着30社様迄!
J
※過去にJob Stageをご利用されてない企業様に限ります