【50代未経験】独学でWeb制作の学習をした期間は１年間【実体験】

こういった疑問や不安に関して、実体験に基づいて解説します。

この記事を書いている私は、会社員だった50歳のときに交通事故で脊髄損傷を負い手足が不自由な重度障害者になりました。
なんとか歩けてなんとかPCが使えます。
そのような私は長期入院により退職し、退院後は自宅療養でリハビリを続けました。

その後未経験から職業訓練でプログラミングの学習を始め、独学を経て現在は在宅でWeb制作を事業とする会社を設立し活動しています。

この記事ではWeb制作の独学方法について、私が１年間をかけて未経験から初案件を獲得するまでの独学方法を実体験に基づいて解説します。

体験談：独学でWeb制作の学習をした期間は１年間です

私は50代未経験から独学でWeb制作を学習するのに期間は１年間かけました。
完璧にWeb制作のスキルを身につけてから仕事に取り組みたいと思いましたが、それには無理があると気付き、ある程度の基礎的スキルを身に付けたら実務をしながら経験を積み勉強し続けることが大切だと考えたからです。

具体的なお話しをすると、必要なプログラミング言語を理解するために本などで理解を深めましたが、デザインカンプからのコーディングを行う学習では全く手が動かず、コーディングしながら「知らない」「わからない」ことはその都度調べ学習しながらしていくことに気が付きました。

私には障害があるので作業に時間がかかったり、体調の良し悪しもあり学習時間も多くは取れません。
人によって１日の学習時間は違うと思いますが、私を例にすると１日平均２〜３時間、体調の悪い時以外は毎日勉強していました。

会社員の方でも休みの日を含めると１日平均２〜３時間は取れるのではないでしょうか？
それならばある程度のWeb制作のスキルを身に付けるのに１年間もかからないでしょう。

よくある質問：独学だけでWeb制作のスキルは身に付きますか？

スクールに通う時間とお金があればその方が効率的であると思います。
しかし独学といっても、今は在宅でもわからない部分だけ「MENTA」でメンターに教えてもらうこともできます。

実際に私はWordPressでPHPが理解できず「MENTA」でメンターに教えてもらいネットや本では見つけられなかったやり方を教えてもらいました。
１日中ネットで検索していたこともあり、部分的にでもメンターに教えてもらって学習が進みました。

Web制作で必要なスキルと独学方法

Web制作に必要なスキル

Web制作に必要なスキルの独学方法

Progateで基礎学習

最初はオンラインプログラミング学習サービスのProgateから学習します。
Progateは環境構築が不要でPCとネット環境だけがあればすぐに学習が始められます。

HTML&CSSコースから始め、無料会員の範囲だけでは学習にならないので有料プランまで進んだら有料会員（税込￥1,078/月）になってHTML&CSSコースを最後まで。
Web制作のスキルを学習する流れは、HTML&CSS、JavaScript、jQuery、Sass、PHPの基礎の順でコースを進めます。

ここでは各コース半分ぐらいの理解で次のコースへ、有料会員が１ヶ月区切りなので１ヶ月で終わらすつもりで。

ドットインストールで実践的に

Progateを１周終えたら、より理解を深めるためにドットインストールでも同じコースの流れで有料会員（税込￥1,080/月）になります。

※ドットインストールのSassはCUI（黒い画面、Windowsではコマンドプロンプト、Macではターミナル）を使うため私は学習していません。

Progateでプログラミングの文法における基礎知識を学び、ドットインストールでProgateで学んだ基礎を使って実践的なプログラミングを学び、テキストエディタのVSCodeの設定を覚え、実際にコードを書いてWebサイトを作成します。

Progateと同じ有料会員が１ヶ月区切りなので１ヶ月で終わらすつもりで。

「１冊ですべて身につくHTML&CSSとWebデザイン入門講座」で手も動かす

「１冊ですべて身につくHTML&CSSとWebデザイン入門講座」では、Webサイトを作りながらHTML&CSSを復習し、新たにWebデザインの基礎と、PC・タブレット・スマートフォンなど異なる画面サイズの幅を基準にWebサイト表示を柔軟に調整し見やすく最適な表示にするレスポンシブWebデザインも学びます。

より理解を深めるために体系的に学べる本で分からないことや足りない知識を補います。
私は手が不自由でページをめくるのが大変なのでAmazon Kindleで電子書籍を利用していますが、参考になるページを画面で見ながらコーディングもできて便利です。

Dart SassとBEMはわからないところはネットで検索して学習

LibSassは、2020年10月に非推奨となっているのでDart Sassを学習します。

Dart Sassについては「ほんの一手間で劇的に変わるHTML&CSSとWebデザイン実践講座」に、BEMについては「プロの「引き出し」を増やすHTML+CSSコーディングの教科書」にそれぞれ解説されていて辞書的にも利用できます。

Dart SassとBEMはわからないところはネットからの情報の学習で充分だと思います。

模写コーディングで腕試し

模写コーディングとは、既存のサイトの見た目を真似てコーディングすることであり、サイトの構造を考え、わからないことは自分で調べ検索しながらコーディングする学習方法です。

YouTubeの「Webの神様」の模写コーディングで解説付きで学習できます。
Google Chromeの拡張機能の使い方も学習できます。

WordPressは動画で

WordPressの学習は「udemy」たにぐちまことさんの「ちゃんと学ぶ、WordPressテーマ開発講座」の動画を見ながら手を動かして実装します。

その後に本で「WordPress仕事の現場でサッと使える！デザイン教科書」も読みながら手を動かして同じく実装して理解を深めます。

デザインカンプからコーディングしてサーバーにアップロードまで

デザインカンプからのコーディングを「note」しょーごさんの「コーディング教材全部盛り！」で学習します。

初級からWordPress実案件レベル、即戦力編のPhotoshopデザインカンプからのコーディングまであり、サーバーのアップロードの解説もあるので、実際に公開までの学習ができます。

Webデザインは基礎的なことだけ

Webデザインではadobe社の３つのソフト「Photoshop」、「Illustrator」、「XD」の基礎的な使い方を学習します。

Adobe社のこの３つのソフトは有料で通常購入した場合は１年で税込72,336円です。
そこでデジハリ・オンラインスクール「Adobeマスター講座」を活用します。
Adobeマスター講座だと１年で税込39,980円になります。

ソフトの基礎の動画を１ヶ月閲覧可能なので、必要箇所だけを学習すれば充分です。
１年後も改めて受講すれば同額で利用できます。

ポートフォリオサイトを作って公開しよう

最後にポートフォリオサイトを作り、サーバーにアップして公開しましょう。

私は学習が終わった段階で最初からWeb制作を事業目的とする会社を設立しました。
しかしこれはおすすめできません。
最初から手間とコストがかかります。
最初は副業でも専業でもフリーランスとして個人事業がおすすめです。
余計な手間とコストをかけずに営業やWeb制作に集中できます。

私のポートフォリオサイトは会社のホームページも兼ねています。
私の１年の学習の結果は「オレンワーク株式会社」になります。

このポートフォリオサイトを公開して、知人から仕事の依頼が来たのが初案件になります。

私には障害があるため無理ができません。
営業せずにポートフォリオサイトを見た知人から仕事を受け、のんびり活動しています。