【最速！】HTML/CSSを1か月以内に独学で身に付ける学習法

プログラミング学習において、大半の人はHTML/CSSの学習から始めます。

正確にはプログラミングではなくマークアップ言語というホームページ作成ができる言語になります。

ホームページ作成の技術を身に付ける手段の中には有料講座がありますが、率直に言うと何万円も払う必要はありません。

その上、そういったコースは数か月という期間が必要な場合が多いです。

今回は独学で、なるべく早く、しかも安い出費でHTML・CSSを身に付けたい人に向けての記事になっています。

「身に付ける」の定義は人によって違いますが、本記事では「簡単なホームページを1人で作れる」とさせて頂きます。作成スピードやデザインセンスは人それぞれ違うので、あくまで「簡単なホームページを作れる」というレベルです。

イメージとしては下のようなホームぺージです。

本記事を読むことによって、学習の出費と時間を最小限に抑え、一人でホームぺージを作れるようになります。

1か月以内にHTML/CSSを独学で身に付ける学習法

必要なのはテキスト1冊

学習手段として、スクールに通う、オンラインプログラミング学習を使うという手段もありますが「HTML/CSSを身に付ける」ということなら上記のテキスト1冊で十分です。

他のテキストを買う必要はありません。

タイトルにも「すべて身につく」とありますが、おおげさではなく基礎ならこの1冊で十分です。大変人気のテキストですので、売り切れる前にまずは入手しましょう。

このテキストをおすすめする理由は「内容がわかりやすい」の一言につきます。

内容がわかりやすい

飲み込みが早い人で、学習時間が大量に確保できる方ですと数日でホームページを作れるようになります。

もちろん、誰もがここまで早くできるようになるわけではありませんが、これから紹介していく方法で1か月でできるようになります。

ちなみに勉強時間は最低でも８0時間は確保して頂きたいです。(例：平日２時間、休日６時間目安）

具体的な勉強法

具体的な勉強方法ですが、流れとしては、

テキストを一通り読む →テキストの課題を作る→自分のポートフォリオを作る

という内容になります。

テキストを一通り読む

まずはテキストをざっくりで良いので一通り読みましょう。本当にざっくりで大丈夫です。

細かい構文などはスルーでOKです。

手を動かしていった方が早いので、「HTML/CSSってこんな感じなんだ」くらいの内容がわかるくらいの理解で問題ありません。

本を読んだ後に、HTMLとCSSの違いを3つ言えれば大丈夫です。

ページ数は多いと感じる人もいると思いますが、大半が画像ですし熟読の必要はありません。

また、意外と大事なのが、「目次」です。

テキストの構成を把握し、実際ホームページを作ってく中でわからない部分がある時にすぐに調べられるようにするためです。

テキストを開いて、

「目次を読む→テキストの構成を把握→内容を読んでいく」

という流れで進めて下さい。

読む目安としては２時間です。あまりに長すぎると読むだけで苦痛になる方もいるので集中できる時間としてもこのくらいです。

もちろん、読むのが苦じゃない方は2時間以上でも構いませんが、どんなに長くても1日以内に終わらせましょう。

テキストの内容に沿ってホームページを作る

ここでの学習目安はおおよそ2週間から長くて3週間です。

テキストは、１つのホームページを作りながらホームページ作成を学んでいく内容となってます。

一通りテキストを読み込んだ後は、「いかに手を動かしてくか」が大事です。

以上のように目的が大きく違うので、気を付けましょう。

もちろん、ホームページを作りながら流れを理解していくことは大事です。

自分のポートフォリオを作る(ゴール）

ここが「簡単なホームページを作れるようになる」というひとつのゴールです。

テキストで作ったホームページをベースに自分でアレンジしていきましょう。

上記は筆者が作成したポートフォリオの一部です。多少テキストのレイアウトと違いますが、使っているスキルはテキストの内容と同じです。

ゼロからデザインをしてみるのも否定はしませんが、デザインスキルは本記事の目的からそれてしまうので割愛します。

テキストで作ったホームページの画像やテキストを変えて、自己紹介だったり、仮想のお店のホームページを作ります。1度完成させてるので、制作期間は1週間を目安にしましょう。

テキストのホームページだけで終えても悪くはないのですが、自分のポートフォリオを作るのには目的があります。

それは、ポートフォリオページを作れば、技術の復習+就職時のアピールになるというメリットが得られるからです。

余裕がある方は、構成を変えていったり、複数作ってみるのもいいでしょう。

場数と検索力が大事

仕事もそうですが、コーディングに関しても数をこなすことが大事です。

最初は慣れませんが、サイトを作っていくうちにスピードが上がっていきます。

また、わからないところがあれば、検索して調べていきましょう。

HTMLとCSSでしたら、ググればいくらでも情報が出てきます。

基本はテキストで大丈夫ですが、わからない部分、知りたい事があれば検索するクセをつけていきましょう。

学習後のアクション

テキストに沿って集中して学習していけば、1か月でホームページが作れるくらいのレベルになります。

その後のプランは、「就職するか学習を続けるか」というのが主な選択肢になってきます。

一通りホームページを作れれば就職できる会社もありますが、もし技術面に不安だったり就職したら即戦力になりたいと言う場合は、無料のプログラミングスクールをおすすめします。

「結局スクールじゃん」という方もいるかもしれませんが、プログラミングはHTML/CSSよりはるかにエラーにあう場面が多く、独学では効率が非常に悪いです。

また、スクールを通せば、就職支援を受けられるというメリットもあります。

不安な方はスクールを検討してみてはいかがでしょうか。
→無料のプログラミングスクールおすすめ3選！【転職支援あり】

プログラミングスクールに通うにしても就職するにしても、HTML/CSSを独学するのは無駄ではありませんし、達成すれば自信にもつながります。

本記事での学習方法が参考になれば幸いです。