Web系の転職・副業が3倍「楽」になる!
「無料」求人サイト4選 >>

現役Webデザイナー監修。Web制作独学ロードマップ|未経験OK

【本記事を読むことによる目標到達点】

 

  • Webデザイナー/エンジニアとして現場で働けるスキルが身に付く
  • Web制作案件を受注して月収30万円以上の継続的な収入が手に入る

当メディアのWeb制作独学ロードマップは、どの有料商材よりも、どの書籍よりもわかりやすく再現性の高い内容を目指して作成し改善を繰り返しております。もちろん無料で全てを公開しています。初心者の方はSTEP1から、中・上級者の方はSTEP4からご覧いただくことをおすすめします。

 

この記事の信頼性(ゆうけんブログの筆者はこんな人)

  • 現役Webデザイナー/エンジニアが執筆
  • 継続して月収80万円超のフリーランス
  • 完全未経験から独学でWeb制作スキルを習得
  • Twitterフォロワー数1,900人超(→@twinzvlog_yk
  • Web制作のメンター経験多数
  • 認定ランサー(ランサーズ最高ランク)

 

以下Twitterでの本記事の評判

 

この記事を読んでいる時点であなたは相当な熱意と行動力をお持ちなので、確実にスキルを習得できると断言します。独学だろうが未経験だろうが関係ありません。あとはやるだけです。

前置きはここまでにして、早速ロードマップを見ていきましょう!

 

【STEP1】Webデザインを学ぶ|Web制作独学ロードマップ

まずはじめにWebデザインの入門としてAdobeツール(Photoshop・Illustrator・Adobe XD・Dreamweaver)の使い方や豆知識を解説していきます。AdobeツールはWeb制作の現場でも当たり前に使われているので必ずマスターしましょう。全て無料で学べます。

Adobe製品をインストール

【Webデザイナー必須】Adobeおすすめ料金プランを徹底比較。|比較表あり Adobe「コンプリートプラン」できること・値段・インストール手順|学生必見

【無料】Adobe公式チュートリアルで基礎を習得

【無料】Photoshop「公式チュートリアル」で完全攻略|評判・口コミ・感想 【公式】Illustrator「無料チュートリアル」おすすめ学習方法【独学】 【無料】Adobe XD「公式オンライン講座」で独学習得|Adobe XD Trail【基本スキル】 【無料】Dreamweaver「公式チュートリアル」使い方を独学習得|オンライン講座【入門編】

Udemy講座でAdobeを完全マスター

Webデザイナー厳選!Udemy『Adobe』おすすめ講座4選+本|評判あり

 

【STEP2】コーディングを学ぶ|Web制作独学ロードマップ

次にWebデザイナーに必要なコーディングを学んでいきます。ここでは筆者が実際に使用していた『Udemy』というサービスの動画教材を使って学習していただきます。知っている方は多いかもしれませんが、Udemy講座はセール中に購入することでスクール並の内容を1,000~2,000円ほどで学ぶことができます。この機会に必ずマスターしましょう。

要注意!Udemy『新規受講生割引セール』適用されない?95%OFF エンジニア厳選!Udemy『Bootstrap』おすすめ講座5選|評判・感想あり 【注目】Udemy『HTML/CSS/JavaScript』おすすめ講座5選 Webデザイナー厳選。Udemy『Webデザイン』おすすめ講座7選|独学でWeb制作 失敗しない!Udemy『WordPress・PHP』おすすめ講座3選|Web制作

 

【STEP3】ポートフォリオを作る|Web制作独学ロードマップ

次にポートフォリオを作っていきます。ポートフォリオとは簡単にいうと実績を示すための作品集です。
自分はこれだけのことができるんだぞ!とアピールする際に使います。
もっと言うと、ポートフォリオはクライアントに自分のスキルをアピールするために重要な役割を持っています。例えば、Web制作会社にメール営業をする際にも優れたポートフォリオがあれば返信率や契約率が数倍も変わってきます。逆にいうとポートフォリオを持っていない場合、あなたがどれだけ高いスキルを持っていようが、どれだけ魅力的な人物だろうと『判断材料がない』ことで見向きもされないのでこの機会に必ず作りましょう。

無料!自作「WordPressテーマ」作り方|ポートフォリオに最適 完全無料!WordPress自作ポートフォリオの作り方|Webデザイナー監修 無料は注意!ポートフォリオおすすめレンタルサーバーと公開方法 就活で失敗しない。学生向けポートフォリオサイトの作り方|Web制作 無料!Photoshop「ポートフォリオ」作り方|3ステップ・実例あり お手軽。イラストレーターのポートフォリオサイト作り方|参考事例あり

 

【STEP4】案件を獲得する|Web制作独学ロードマップ

最後のステップでは案件の獲得方法を解説していきます。これまでの学習を活かして稼ぐためのステップです。筆者が実際にやってきた営業方法やその失敗談などを全て共有しているのでお役に立つはずです。ちなみにこの章で紹介する内容は有料記事として出す予定だったため、筆者が最も力を込めた『他にはない』濃厚で深みのある内容となっています。ぜひ最後までご覧ください。

 

(随時更新していきます。)

【未経験OK】Web制作『初案件獲得』で困らない方法|ウェビスト+クラウドテック 未経験可!クラウドテックの評判・口コミを徹底調査!マージンも Webデザイナー3ヶ月独学ロードマップ|5ステップ

 

MEMO
残りの記事も執筆中なのでお持ちください。

 

【Web制作独学ロードマップの関連記事】

この章ではWebデザインで使える豆知識や素材をご紹介します。ぜひ学習に使ってみてください。

失敗しない!Udemyおすすめランキング13選|人気講座紹介 【見たことない】背景画像『回転する』CSSアニメーション3選 注目!ナビゲーションバーCSSデザイン10選|navbar・メニュー スライダーマテリアルデザインをコピペで!CSSアニメーション3選【コード解説付】 【コピペのみ】CSSでハンバーガーメニューデザイン3選|シンプル hover×transitionのCSSボタンエフェクト9選【コピペOK】