現在進行系で、独学でWebデザインを学習している筆者ですが、今でもちょくちょく覗きに行く
学習するのにとてもお世話になったサイトを、健忘録を兼ねてまとめてみました。
筆者の場合、最初はオンライン学習で、その後書籍という流れで進めました。
なぜ、先にオンラインから始めたかというと、オンライン学習サイトによりますが序盤は無料でできることが多く「自分がコーディングに向いているか？」「楽しめて作業できるか？」を確認できるからです。
また、有料登録しても書籍を買う価格より月額料金が安い、有料登録中はサイト全部の講義を見ることができることが多いので、その気になればあらゆる言語を学べるという理由もあります。
専門書の書籍は比較的価格が高く「買ったはいいけど理解できなくてやめた！」というリスクが少ないのが利点です。
オンラインで学習できるサイト
オンラインで学習できるサイトはいくつかあり、学習内容・サービス・価格など様々。
ここでもやはり、どのサイトから始めれば良いのか…悩むところではありますが、筆者が学習で使用したサイトのみですが学習した順番に書いていこうと思います。
chot.design
コードの学習に特化しているわけではなく、Webデザインに必要な知識や基本、アプリの使い方などテキストベースで学習できるサイトです。一度に全てを見るというより、基礎知識が必要になったら覗きに行くという利用の仕方が良いと思います。
Webデザイン全体の基礎知識が網羅されているので、後々まで参考になるサイトです。
無料で登録と利用ができます。
Progate
プログラミングの入門が学べる、初学で学習するならとりあえずやってみよう的なサイト。
テキストベース。
HTML/CSSの他に、javascript・jQuery・sassやPHP・java・Pythonなど複の言語基礎が学べます。テキストエディッタを用意したり環境構築する必要もないので、直ぐ学習に取りかかれるのがメリット。
無料プラントと有料プランが有り、コースの途中までが無料でそれ以降は有料という流れなので、課金後は短期集中で必要なことだけをサラッと学習するのがおすすめ。
Web版とアプリ版があり、移動中の隙間時間で学習できるので空いた時間を有効利用できる。
ドットインストール
初学者から初心者へ踏み出した的な学習サイト。
動画ベース。
このサイトはテキストエディッタが必要となり、最初は環境構築から始まるのでより実践に近い環境で学習していくことになります。
学習は２〜３分ほどの動画を見ながら学んでいくスタイルなので、時間を決めてどっしり構えて学習する感じ。無料プランとプレミアムプランがあり、コースの途中まで無料でそれ以降はプレミアム用となっています。
動画の音声は無料プランは男性ボイス、プレミアムプランになると女性ボイスが選べる。
一つのコースでも学べることが多いので、より多くの知識を得るには最適。
Codejump
以前はCodestepという名で運営していた、コーディングの練習を主軸においたサイト。
サンプルと同じように表示できるよう自力でコーディングして完成させる模写練習ができる。
ヒントや解答もあるので、コーディングのお手本としての役割もある。
自力でのコーディングが難しく感じたら、ヒントや解答を見て理解を深めるのがおすすめ。
サンプルの数は非常に多くデザインも多岐にわたるので、様々なレイアウトのコーディング練習になる上、wordpressを使った模写もできる。
無料で利用できるが、有料にすることで実案件を元にしたサンプルもあるそう。
筆者はこのサイトに非常にお世話になりました。
Paizaラーニング
ここはWebデザインと言うより、主にバックエンド言語の学習に向いているサイト。
HTMLやCSSも一応学習はできるけれど、いずれ学習することになるphpなどの学習するのに向いているサイトかもしれない。
動画ベース。
ドットインストールと同じ動画を視聴するタイプだが、プロゲートみたくエディッタを用意する必要がない。プロゲートとドットインストールを合わせたような構成。
音声はアニメ調で聞き取りやすい。
無料と有料があり、筆者はphpの学習で利用した。
まとめ
筆者は、このような流れでオンラインで学習をしてきて現在に至るわけですが、これで終わりではなく更に理解を深めたり広く学ぶために、書籍を購入したりして学習をしています。
この後は、デザインの学習をしたり今まで学習したことの集大成として、自主制作の架空サイト制作やポートフォリオを作るのが良いと思います。
ここまで来るのに何度も挫折をしてきましたが、その度に復活して筆者も今、架空サイトとポートフォリオ作成に励んでいます。
この記事がこれからwebの学習を始めようか迷っている方や、始めたは良いけどどう学習して良いかわからない方の参考になれば幸いです。
コメント